Store Components & Features

Promo Bar Component

Add a custom message at the top of your online store. Perfect for instructions, promotions, or a call-to-action.

What's the Promo Bar Component?

The promo bar component provides a simple way to display messaging at the top of an InkSoft powered online store. This feature can be useful in communicating call-to-actions, instructions, promotions, or any other important details you need to convey to your shoppers.

The promo bar is 'sticky' and displays constantly at the top of the store to maximize visibility. Only one promo bar can be added per store and you cannot adjust its position as it is designed to remain at the top of your store at all times.

Add the Promo Bar Component

Once you are in Edit Mode:

  • Click on the blue icon at the bottom right to launch the component library window
  • Click the component dropdown
  • Select 'Promo Bar' from the drop-down
null

  • Click 'Layout 1'
null

Edit the Promo Bar Component

You will now see a preview of the promo bar and have controls on the left side of your screen. These controls allow you to:

  • Background color (Note: By default, the primary accent color of your store will be adopted).
  • Enter in your desired messaging here: (Note: You can use basic HTML text formatting -- See the final step for using HTML text snippets).
  • Choose the text position: By default, your text will be centered. You can left or right align.

'Save & Publish' if you are satisfied with the look of your promo bar.

null

Promo Bar Example

The promo bar will remain 'sticky' at the top of the site even as the page scrolls. This ensures your message is visible at all times.

null

Edit or Remove the Promo Bar Component

You can always edit or remove a promo bar. If you are in 'Edit Mode' simply hover your mouse over the component to access the 'Edit' or 'Remove' function.

null

Useful HTML Snippets

You can use basic HTML to enhance your message:

  • Bold Text: <b>Will make bold text</b>
  • Italtics: <i>Will italicize text</i>
  • Link: <a href="intert link between these quotes">Shop Now</a>