--- title: Smart notice bar help guide --- [Skip to content](https://www.synghub.com/smart-notice-bar-help-guide#main-content) [![Synghub-logo](https://www.synghub.com/hs-fs/hubfs/Final-logo.png?width=180&height=68&name=Final-logo.png)](https://www.synghub.com/?hsLang=en) ✕ - [Home](https://www.synghub.com/?hsLang=en) - Products - - Mega Menu - [Mega Menu Demo](https://www.synghub.com/mega-menu-module) - [Mega Menu Help Guide](https://www.synghub.com/mega-menu-help-guide) - Filterable Portfolio Gallery - [Filterable Portfolio Gallery Demo](https://www.synghub.com/filterable-portfolio-gallery-module) - [Filterable Portfolio Gallery Help Guide](https://www.synghub.com/filterable-portfolio-gallery-help-guide) - Multi-Purpose Hero Banner - [Multi-Purpose Hero Banner Demo](https://www.synghub.com/multi-purpose-hero-banner) - [Multi-Purpose Hero Banner Help Guide](https://www.synghub.com/multi-purpose-hero-banner-help-guide) - Multi-Purpose Content Cards - [Multi-Purpose Content Cards Demo](https://www.synghub.com/multipurpose-content-cards) - [Multi-Purpose Content Cards Help Guide](https://www.synghub.com/multi-purpose-content-cards-help-guide) - Enterprise Global Footer - [Enterprise Global Footer Demo](https://www.synghub.com/enterprise-global-footer) - [Enterprise Global Footer Help Guide](https://www.synghub.com/enterprise-global-footer-help-guide) - Mega MenuNavigation made powerful - Filterable Portfolio GalleryShowcase your work - Multi-Purpose Hero BannerCaptivate at first sight - Multi-Purpose Content CardsFlexible card layouts - Enterprise Global FooterFlexible card layouts - PreheaderTop bar notifications & alerts - Pricing Plans ComparisonCompare tiers & features - Team CardsShowcase your crew - ![Mega Menu Demo](https://syngrid.com/wp-content/uploads/2026/02/mega-menu-thump-1-1.webp) Mega Menu Demo Live interactive preview of the Mega Menu component with all features and animations enabled. [Explore More](https://www.synghub.com/mega-menu-module?hsLang=en) - ![Mega Menu Help Guide](https://syngrid.com/wp-content/uploads/2026/02/mega-menu-thump-1-1.webp) Mega Menu Help Guide Step-by-step documentation to set up, customize, and integrate the Mega Menu into your project. [Explore More](https://www.synghub.com/mega-menu-help-guide?hsLang=en) - ![Portfolio Gallery Demo](https://syngrid.com/wp-content/uploads/2026/02/Filterable-Portfolio-Gallery-4.webp) Filterable Portfolio Gallery Interactive gallery demo with category filters, smooth transitions, and responsive grid layout. [Explore More](https://www.synghub.com/filterable-portfolio-gallery-module?hsLang=en) - ![Portfolio Gallery Help Guide](https://syngrid.com/wp-content/uploads/2026/02/Filterable-Portfolio-Gallery-4.webp) Filterable Portfolio Gallery Help Guide Complete guide on how to install, configure filters, add items, and style the portfolio gallery. [Explore More](https://www.synghub.com/filterable-portfolio-gallery-help-guide?hsLang=en) - ![Hero Banner Demo](https://syngrid.com/wp-content/uploads/2026/02/thumbbb-1.webp) Multi-Purpose Hero Banner Eye-catching hero section demo with dynamic text, CTA buttons, and full-width background options. [Explore More](https://www.synghub.com/multi-purpose-hero-banner?hsLang=en) - ![Hero Banner Help Guide](https://syngrid.com/wp-content/uploads/2026/02/thumbbb-1.webp) Multi-Purpose Hero Banner Help Guide Full documentation covering layout variants, animation settings, and content customization options. [Explore More](https://www.synghub.com/multi-purpose-hero-banner-help-guide?hsLang=en) - ![Content Cards Demo](https://syngrid.com/wp-content/uploads/2026/02/mega-menu-thump-1-1.webp) Multi-Purpose Content Cards Versatile card components for products, team members, blog posts, and more with multiple style variants. [Explore More](https://www.synghub.com/multipurpose-content-cards?hsLang=en) - ![Content Cards Guide](https://syngrid.com/wp-content/uploads/2026/02/mega-menu-thump-1-1.webp) Multi-Purpose Content Cards Help Guide Complete documentation for implementing and customizing content cards for your specific use case. [Explore More](https://www.synghub.com/multi-purpose-content-cards-help-guide?hsLang=en) - ![Enterprise Footer Demo](https://www.synghub.com/hubfs/480x360x1.png) Enterprise Global Footer The Enterprise Global Footer is a powerful and highly flexible HubSpot module designed to create fully dynamic. [Explore More](https://www.synghub.com/enterprise-global-footer?hsLang=en) - ![Footer Help Guide](https://www.synghub.com/hubfs/480x360x1.png) Enterprise Global Footer Help Guide The Enterprise Global Footer is a flexible and scalable HubSpot module designed layouts. [Explore More](https://www.synghub.com/enterprise-global-footer-help-guide?hsLang=en) - ![Preheader demo](https://www.synghub.com/hubfs/480x360x1-1.png) Smart Preheader Bar Customizable announcement bar, promo alerts, and global notifications with close button & CTA. [Explore More](https://www.synghub.com/preheader?hsLang=en) - ![Preheader guide](https://www.synghub.com/hubfs/480x360x1-1.png) Preheader Help Guide Step-by-step documentation: multiple styles, positioning, dismiss behavior, and analytics. [Explore More](https://www.synghub.com/preheader-help-guide?hsLang=en) - ![Preheader demo](https://www.synghub.com/hubfs/SyngHub-Pricing-Plans-Comparison-Table.webp) Pricing Comparison Table Fully responsive comparison matrix with feature highlights, annual billing toggle, and interactive rows. [Try Demo](https://www.synghub.com/pricing-plans-and-comparison-table?hsLang=en) - ![Pricing guide](https://www.synghub.com/hubfs/SyngHub-Pricing-Plans-Comparison-Table.webp) Pricing Help Guide Setup dynamic pricing tables, custom badges, tooltips, and integrate with subscription logic. [Documentation](https://www.synghub.com/pricing-plans-and-comparison-table-help-guide?hsLang=en) - ![Preheader demo](https://www.synghub.com/hubfs/480x-1.webp) Team Cards Grid Modern team member showcase with avatars, social links, hover effects, and responsive layout. [Meet the team](https://www.synghub.com/team-card?hsLang=en) - ![Team card guide](https://www.synghub.com/hubfs/480x-1.webp) Team Cards Help Guide Customize card styles, integrate dynamic data, add filters and team categories easily. [View guide](https://www.synghub.com/team-card-help-guide?hsLang=en) - [Contact](https://www.synghub.com/contact?hsLang=en) **[Get Modules](https://ecosystem.hubspot.com/marketplace/modules?eco_providers=Syngrid%20Technologies)** # SyngHub Smart Notice Bar  A dynamic header notification module for displaying announcements, promotions, alerts, countdown timers, CTA buttons, and social media links in a compact top-bar layout.  [Get Module](https://ecosystem-na2.hubspot.com/marketplace/modules/smart-notice-bar-module-by-syngrid-technologies) ### [Overview](https://www.synghub.com/smart-notice-bar-help-guide#Overview) → ### [Icon Type Selection](https://www.synghub.com/smart-notice-bar-help-guide#Icon-Type-Selection) → ### [Icon / Image Upload](https://www.synghub.com/smart-notice-bar-help-guide#Icon-Image-Upload) → ### [Alert Message Text](https://www.synghub.com/smart-notice-bar-help-guide#Alert-Message-Text) → ### [CTA Button Toggle](https://www.synghub.com/smart-notice-bar-help-guide#CTA-Button-Toggle) → ### [Button Configuration](https://www.synghub.com/smart-notice-bar-help-guide#Button-Configuration) → ### [Countdown Timer Setup](https://www.synghub.com/smart-notice-bar-help-guide#Countdown-Timer-Setup) → ### [Timer Unit Display Controls](https://www.synghub.com/smart-notice-bar-help-guide#Timer-Unit-Display-Controls) → ### [Social Icons Management](https://www.synghub.com/smart-notice-bar-help-guide#Social-Icons-Management) → ### [Style Customization](https://www.synghub.com/smart-notice-bar-help-guide#Style-Customization) → ### [Advanced Spacing & Layout](https://www.synghub.com/smart-notice-bar-help-guide#Advanced-Spacing-Layout) → [![480x360x1-2](https://www.synghub.com/hs-fs/hubfs/480x360x1-2.png?width=760&height=570&name=480x360x1-2.png "480x360x1-2")](https://www.synghub.com/smart-notice-bar-help-guide#overview) #### Overview  A versatile top-of-page notification bar module designed to display important announcements, promotions, alerts, and engagement elements across the website. This module supports rich content components including icons/images, notification text, CTA buttons, countdown timers, and social media icons—allowing businesses to create dynamic and interactive header messaging experiences.  [![480x1](https://www.synghub.com/hs-fs/hubfs/480x1.png?width=760&height=570&name=480x1.png "480x1")](https://www.synghub.com/smart-notice-bar-help-guide#Contact-Information-Display) #### Icon Type Selection  Choose whether to display an icon or image in the notice bar to visually support the alert or announcement content. ![480x2](https://www.synghub.com/hs-fs/hubfs/480x2.png?width=760&height=570&name=480x2.png "480x2") #### Icon / Image Upload Upload or select a custom icon/image to represent the notice message and improve visual engagement. ![480x3](https://www.synghub.com/hs-fs/hubfs/480x3.png?width=760&height=570&name=480x3.png "480x3") #### Alert Message Text Enter the main notification or promotional text to be displayed prominently in the notice bar. ![480x4](https://www.synghub.com/hs-fs/hubfs/480x4.png?width=760&height=570&name=480x4.png "480x4") #### CTA Button Toggle Enable or disable the call-to-action button based on campaign or announcement requirements. ![480x5](https://www.synghub.com/hs-fs/hubfs/480x5.png?width=760&height=571&name=480x5.png "480x5") #### Button Configuration Set custom button text, destination link, link type, and new tab behavior for user actions. ![480x6](https://www.synghub.com/hs-fs/hubfs/480x6.png?width=760&height=570&name=480x6.png "480x6") #### Countdown Timer Setup Configure target date and time for countdown campaigns such as promotions, launches, or events. ![480x7](https://www.synghub.com/hs-fs/hubfs/480x7.png?width=760&height=570&name=480x7.png "480x7") #### Timer Unit Display Controls Choose which countdown units to display: days, hours, minutes, and seconds. ![480x8](https://www.synghub.com/hs-fs/hubfs/480x8.png?width=760&height=570&name=480x8.png "480x8") #### Social Icons Management Add, remove, or reorder social media icons to provide quick access to brand social channels. ![480x9](https://www.synghub.com/hs-fs/hubfs/480x9.png?width=760&height=570&name=480x9.png "480x9") #### Style Customization Override default styling with custom background colors, gradients, icon colors, text colors, and close icon colors. ![480x10](https://www.synghub.com/hs-fs/hubfs/480x10.png?width=760&height=570&name=480x10.png "480x10") #### Advanced Spacing & Layout Adjust padding, margins, and spacing for the notice bar, countdown timer, and social icons to match design requirements. ![Icon (1)](https://www.synghub.com/hs-fs/hubfs/Icon%20(1).png?width=153&height=152&name=Icon%20(1).png) ### [Expert Assistance](https://wa.me/+6582067456) Get direct support from our experienced support team ![Icon (2)](https://www.synghub.com/hs-fs/hubfs/Icon%20(2).png?width=153&height=152&name=Icon%20(2).png) ### [Demo Link](https://www.synghub.com/smart-notice-bar?hsLang=en)  Explore a live demo to experience the product in action.  # SyngHub Smart Notice Bar  A dynamic header notification module for displaying announcements, promotions, alerts, countdown timers, CTA buttons, and social media links in a compact top-bar layout.  [Get Module](https://ecosystem-na2.hubspot.com/marketplace/modules/smart-notice-bar-module-by-syngrid-technologies) ![2-colm](https://www.synghub.com/hubfs/2-colm.png "2-colm") ![box](https://www.synghub.com/hs-fs/hubfs/box.png?width=177&height=191&name=box.png) Let's Discuss Your Ideas! ![Object-4 1](https://www.synghub.com/hubfs/Object-4%201.png "Object-4 1") [![Final-PNG-Logo (1) 2](https://www.synghub.com/hs-fs/hubfs/Final-PNG-Logo%20(1)%202.png?width=210&height=84&name=Final-PNG-Logo%20(1)%202.png)](https://www.synghub.com/?hsLang=en) SyngHub is a HubSpot-focused product line by Syngrid Technologies, built to simplify and accelerate website development on HubSpot CMS. #### QUICK LINKS - [Home](https://www.synghub.com/?hsLang=en) - [About](https://www.synghub.com/?hsLang=en) - [Services](https://www.synghub.com/?hsLang=en) - [Products](https://www.synghub.com/?hsLang=en) - [Contact Us](https://www.synghub.com/?hsLang=en) #### CONTACT US Singapore ![Isolation_Mode](https://www.synghub.com/hs-fs/hubfs/Isolation_Mode.png?width=32&height=32&name=Isolation_Mode.png) +65 8206 7456 ![Telephone](https://www.synghub.com/hubfs/Telephone.svg) +65 6508 5166 ![Isolation_Mode](https://www.synghub.com/hs-fs/hubfs/Icon%20(3).png?width=32&height=32&name=Icon%20(3).png) sales@syngrid.com ![Isolation_Mode](https://www.synghub.com/hs-fs/hubfs/Isolation_Mode%20(2).png?width=32&height=32&name=Isolation_Mode%20(2).png) Punggol Digital District, Tower 82 Punggol Way, #07-25 Singapore – 829910 India ![Isolation_Mode](https://www.synghub.com/hs-fs/hubfs/Isolation_Mode.png?width=32&height=32&name=Isolation_Mode.png) +91 89250 31568 ![Isolation_Mode](https://www.synghub.com/hs-fs/hubfs/Icon%20(3).png?width=32&height=32&name=Icon%20(3).png) sales@syngrid.com ![Isolation_Mode](https://www.synghub.com/hs-fs/hubfs/Isolation_Mode%20(2).png?width=32&height=32&name=Isolation_Mode%20(2).png) TBI@TCE, Thiruparankundaram, Madurai – 625 015 Copyright © 2026.  SyngHub (Powered by Syngrid Technologies)