OT: Theme Sections

Search limit to:






Sticky Announcement Bar
Copy
Open in ChatGPT
Ask ChatGPT about this page
Open in Claude
Ask Claude about this page

The Sticky announcement bar section (only able to be added at Header) ensures key information, such as sales or shipping offers, remains constantly visible to visitors, effectively boosting conversions and enhancing the user experience.


1. Section Components

Section Sticky announcement bar Display an announcement bar that remains constantly visible on the header.
Available block Block Show simple text content with adjustable sizing

2. Location & Setup

To add & set up the Sticky announcement bar section:

  • Open the Shopify Theme Editor (Online Store > Themes > Customize).
  • Decide where you want to place the new section in Header.
  • Click "Add Section".
  • Select "OT: Sticky Announcement."

3. Highlight Features 

  • Always visible announcement: The announcement bar remains fixed at the header, ensuring important promotions or updates are constantly visible to visitors.
  • Customizable text blocks: Add one or multiple text blocks with adjustable sizing to highlight different messages within the bar.
  • Icon options: Enhance your announcements with icons using four flexible methods: pre-set icons, custom icon names, uploaded SVGs, or image uploads. 

4. Common Use Cases

🤔 How to set up the Sticky announcement bar?

If you don't know where to start to set up this section, just follow this:

STEP 1:

Add the OT: Sticky Announcement section to the Header.

STEP 2: Set up section blocks 

Each block represents a piece of content on the announcement. Click on the Block to set up: 

  • Enter text Content to display on the announcement bar.
  • (Optional) Add Icon, using one of the 4 ways:
Drop-down icon list

Choose one icon in the Icon drop-down list.
Use another icon
  • In the Icon drop-down list, choose Another icon.
  • Paste the icon name from icon list into Use another icon.
Custom icon Paste your own SVG code to use as Custom icon.
Upload icon

Upload icon image.

STEP 3: Enable sticky announcement bar

Click on the OT: Sticky Announcement section to open its settings panel:

Toggle "Enable sticky bar" to ON.

STEP 4: Click "Save" when done.

🤔 How to customize the Sticky announcement bar's look?    

To customize the look of the section, do this:

STEP 1:

Click on the OT: Sticky Announcement section to open its settings panel.

STEP 2:

  • Enable to Show section borders.
  • Enter Phone number to show on the announcement bar.

STEP 3:

Scroll down to Size settings groups to adjust Text size on desktop and mobile devices.

STEP 4:

Scroll down to Colors, Desktop layout and Mobile layout settings groups to adjust:

  • Color for background, icon, text, line and borders...
  • Content width, spacing, and padding of the section.

STEP 5: Click "Save" when done.

5. Layout Recommendations  

The Sticky announcement bar section can create appealing layouts. If you want support to set up the layouts, don't hesitate to chat with us!

📂 Layout recommendation


Check out demo here.

6. Support Information

Need help? Contact our support team at Omni Themes Support .