The Badge block shows a decorative round seal, 100 px wide, with an icon or a short figure in the center and a phrase repeated around its edge. To add one, click Add block in a Section, Card rail, Contact form, Offcanvas drawer, Orbit, Share, Subscription or Video section, or inside a Group block or Columns block, and select Badge.
The seal uses the primary button colors from Color settings. In the default colors, the seal is black and its icon and text are white. The block has no size or color setting of its own. To put a label such as Best seller on a product card, see Add a label such as Best seller to a product instead.
Settings
Setting
What it does
Shape
Scallop, the default, draws a filled seal with a wavy edge. Circle draws no seal at all. The icon and the text then show on their own in the primary button text color, which is white in the default colors, so they do not show on a light background.
Center
Icon, the default, shows an icon in the middle. Text shows Center text there instead.
Center text
Shows when Center is Text. Keep it to a few characters, such as 85+, because it sits inside the ring of text.
Icon
Shows when Center is Icon. Cup is the default. The other choices are Bag, Box, Clock, Eye, Heart, Leaf, Search, Share and Truck. None leaves the center empty.
Circular text
A short phrase in capital letters around the edge, starting at the top. Enter it once. The seal repeats it as many times as fit, with a dot between copies. Leave it empty for a seal with no text around it.
Spin seal
On by default. Turns the seal and its circular text slowly, one turn a minute, the whole time the badge is on screen. Shows when Shape is Scallop or Circular text is filled in.
Whether Spin seal is on or off, the seal and its circular text also turn as customers scroll the page. The icon or the center text stays upright. Visitors whose device is set to reduce motion see a still seal.
If Center has nothing to show and Circular text is empty, the badge does not show.
Layout
Setting
What it does
Width
The column the seal lines up in. Text column is a centered column up to 864 px wide. Page width, the default, matches Page width in Layout settings. Full width runs from edge to edge of the section. The seal keeps its size in all three.
Inside that column, the section's Alignment puts the seal at the left, in the center or at the right, as Section layout settings describes.
The Badge block shows a decorative round seal, 100 px wide, with an icon or a short figure in the center and a phrase repeated around its edge. To add one, click Add block in a Section, Card rail, Contact form, Offcanvas drawer, Orbit, Share, Subscription or Video section, or inside a Group block or Columns block, and select Badge.
The seal uses the primary button colors from Color settings. In the default colors, the seal is black and its icon and text are white. The block has no size or color setting of its own. To put a label such as Best seller on a product card, see Add a label such as Best seller to a product instead.
Settings
Setting
What it does
Shape
Scallop, the default, draws a filled seal with a wavy edge. Circle draws no seal at all. The icon and the text then show on their own in the primary button text color, which is white in the default colors, so they do not show on a light background.
Center
Icon, the default, shows an icon in the middle. Text shows Center text there instead.
Center text
Shows when Center is Text. Keep it to a few characters, such as
85+, because it sits inside the ring of text.Icon
Shows when Center is Icon. Cup is the default. The other choices are Bag, Box, Clock, Eye, Heart, Leaf, Search, Share and Truck. None leaves the center empty.
Circular text
A short phrase in capital letters around the edge, starting at the top. Enter it once. The seal repeats it as many times as fit, with a dot between copies. Leave it empty for a seal with no text around it.
Spin seal
On by default. Turns the seal and its circular text slowly, one turn a minute, the whole time the badge is on screen. Shows when Shape is Scallop or Circular text is filled in.
Whether Spin seal is on or off, the seal and its circular text also turn as customers scroll the page. The icon or the center text stays upright. Visitors whose device is set to reduce motion see a still seal.
If Center has nothing to show and Circular text is empty, the badge does not show.
Layout
Setting
What it does
Width
The column the seal lines up in. Text column is a centered column up to 864 px wide. Page width, the default, matches Page width in Layout settings. Full width runs from edge to edge of the section. The seal keeps its size in all three.
Inside that column, the section's Alignment puts the seal at the left, in the center or at the right, as Section layout settings describes.