Articles on: Online Store (Website)

Create an announcement bar on online store


In this article:

Introduction
Installation of Announcement Bar
FAQ that you should know

1. Introduction



Now, you can highlight important messages at the top of your store with a customizable banner and button. Easily set it up to match your brand while ensuring key promotions or announcements don’t go unnoticed. To grab attention, use a full-width banner with a contrasting color. The added button makes it easy for customers to take action instantly. 🚀

2. Installation of Announcement Bar





Step 1: From your EasyStore Admin > Apps > Explore Apps > Search Announcement Bar > click Install this app 



Step 2: Choose your animation type & customize appearance settings

Select an animation type:

Slider - Eye-catching sliding updates
Marquee - Smooth scrolling promotions

You can also personalize colors and additional settings as shown in the screenshot below. You can preview how it will appear on your Online Store and see any changes in real-time.


Step 3: Enter your banner message here


You can choose to enable a button and countdown for your banner:

Button – Customize the button text and link to direct customers to a specific page (e.g., collections, new arrivals, promotions).
Countdown – Add a timer to create urgency for limited-time offers and promotions. (You may choose your preferred style)


💡 You may add up to 5 banners

Step 4: Save your changes, and you're all set! 🎉

3. FAQ that you should know



Q1: What should I do if my Announcement Bar is blocking my website’s top bar?

A1: If your Announcement Bar is overlapping with your website's top bar, follow these steps to fix it:

Go to Channels > Online Store > Edit Source > assets > theme.js

Scroll to the bottom of the file and add the following code & save

if($('#announcement-bar-top').length){ $('.header-bar.sticky-topbar').css('top',$('#announcement-bar-top').height() +'px'); }


Q2: Can I create multiple Announcement Bars?

A2: Yes, you can! 😊👌 If you create more than one Announcement Bar, they will be displayed as follows on your website

GIF as reference:

Updated on: 26/02/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!