Promotion banner

Promotion banner

Promotion banner (Quick purchase)

In the Quick purchase bar, you can display a promotional banner. Position the banner in one of three locations, add custom text with links, and customize the banner colors.

Enable and select the position of the banner

The Promotion Banner appears beneath the Mobile view settings in your sidebar customization panel. Within these settings, you can choose to display a Promotion banner and select its location and color scheme. Additionally, you can customize the text and include links.

image
icon
STEPS

In your theme editor (Customize):

  1. Head to the App Embed section of the theme editor.
  2. Open dropdown for Flash Quick Purchase Bar.
  3. Scroll down to the Promotion banner.
  4. Check off the Show promotion banner checkbox.
  5. Use the Promotion banner location selector to select if you want the banner to appear in a Top or Bottom position.
  6. Click Save.

Add text and link

Add a Heading and Supporting text in the banner. You can use the rich text editor to add linked text.

icon
STEPS

In your theme editor (Customize):

  1. Select the Default product template from the drop-down menu.
  2. Scroll down to the Promotion banner.
  3. Enter text to the Heading field to display in the banner.
    4. image
  4. Enter text to the Supporting Text to display below or next to the heading.
    5. We recommend a short sentence.
  5. Highlight any text you’d like to add a link to and select the link icon to add a link.
    6. image
  6. Click Save.

Edit Promotion banner color

You can select from one of the preset Color schemes for the banner, or Override with custom colors.

icon
STEPS

In your theme editor (Customize):

  1. Select the Default product template from the drop-down menu.
  2. Scroll down to the Promotion banner color scheme.
  3. Select one of the color options from the selector to determine which color scheme you’d like to use.
  4. Or click override with custom colors and click the color swatches to select the color you want for the Background and Text.
    5. To add a specific hex code color, click on the field to enter code (e.g. #FF0000)
  5. Click Save.