For the complete documentation index, see llms.txt. This page is also available as Markdown.

Text banner

Highlight important information on your product page, such as shipping, returns or a promotion, in a banner with an icon, heading, text and optional link.


The Text banner block is a highlighted box in your product information with an icon, a heading and a short description. You can add a link to make the whole banner clickable, and a background image for extra impact. Use it for shipping rates, return policies, promotions or care notes that shoppers shouldn't miss. You can add as many text banners as you need.

1. Our guide to set up a Text banner block:

Steps:

  • In the theme editor, open a product page using the page selector at the top.

  • In the Product information section, click Add block.

  • Select Text banner.

  • Click Save.

2. Block settings

  • Content

    • Icon: The icon beside the text: None / Box / Certificate / Chat bubble / Check mark / Clipboard / Credit card / Eye / Globe / Heart / Lightning bolt / Lock / Mail / Map pin / Percent / Phone / Plane / Price tag / Question mark / Recycle / Return / Ruler / Shopping bag / Smile / Snowflake / Star / Store / Sun / Timer / Truck / User.

    • Heading: The banner title.

    • Description: The banner text, with formatting and links.

    • Link: Optional. Makes the whole banner clickable and adds an arrow on the right.

    • Open link in a new tab: Opens the link in a new browser tab.

  • Background image

    • Image: Optional image behind the banner. A dark overlay is added and the text and icon turn white so they stay readable.

    • Focal point: Which part of the image stays visible: Top left / Top center / Top right / Middle left / Middle center / Middle right / Bottom left / Bottom center / Bottom right.

  • Style

    • Corner style: Square / Slightly rounded / Pill.

    • Show border: Adds a thin border around the banner.

  • Colors

    • Use custom colors: Turn on to use the colors below instead of your color scheme. Not used when a background image is set.

    • Text: Color of the heading and description.

    • Icon: Color of the icon and arrow.

    • Background: Banner background color.

    • Border: Border color. Applies when Show border is on.

3. Tips

  • Keep the description to one or two lines. Link to a full page, such as your shipping policy, for the details.

  • Choose an icon that matches the message, for example Truck for shipping or Return for returns.

  • Pill corners suit short one-line banners. Use Slightly rounded or Square for longer text.

Was this helpful?