How to setup genie all in one bar in your storefront?

This module helps you add a beautiful announcement bar to communicate with customers more efficiently. Announce free shipping, upcoming product launch or sales promo with mobile responsive bar and improve your brand visibility. All in one bar is highly customisable to blend in the design with your template and comes with text and html support.

Setting up all in one bar is very easy. In this tutorial, I will guide you through all the elements in the settings to help you understand app dashboard better.

App settings

The floating bar can be activated and deactivated simply turning on/off a button from this settings. Turn the button on to activate the button in storefront.

Message settings

This section is to setup your message for the floating bar. Along with text message, you can also use countdown timer and button using short-codes and html tags to style your message better.

Supported html tags: <a>, <i>, <b>

Short-codes: {{timer}} = Countdown timer, {{button}} = Button

Display settings

This setting section is to setup your floating bar position and other display settings. You can set the bar both at top of the page with floating effect as well as on the bottom of browser window. Both positions work great for announcements and promotions.

Design settings

All in one bar comes with preset designs so that your can start immediately. Using this setting section you can also fully customize your bar’s style, color, text colors and font size with our easy to use click & set editor.

All in one bar module also has live preview to see the changes in realtime while editing. This will help you setup your bar faster.

After customising the design and completing other settings, save the changes and your all in one announcement bar is ready.


Talk to our customer support.

If you cannot find what you are looking for in our help center, open a support ticket.
We will get back to you shortly.

Create new ticket
Woman messaging on mobile phone