Announcement Bar
Connect Announcement Bar by Smartarget with Webflow to display promotional notifications, shipping thresholds, and time-sensitive offers across your site through JavaScript embedding.
How to integrate Announcement Bar with Webflow
The easiest way to set up Announcement Bar is by installing the Announcement Bar app from the Webflow Marketplace. You can also embed the JavaScript code directly in your site's custom code settings.
Requirement: You need a paid Webflow site plan to add custom code. Free plans do not support custom code integration.
Use the Announcement Bar app
Install Announcement Bar from the Webflow Marketplace for centralized management through your Webflow dashboard's Apps section. The marketplace app eliminates manual code copying while delivering the same core functionality.
After installation, configure your announcement content in the Smartarget dashboard. Message updates take effect immediately on your published site without requiring republishing through Webflow.
Embed the announcement bar code
Configure your messages, colors, and CTA buttons in the Smartarget dashboard, then copy the generated JavaScript code and paste it into Webflow.
Setup process:
- Create an account at smartarget.online
- Configure your announcement content (text, styling, CTAs, visibility rules)
- Copy the JavaScript embed code
- In Webflow, navigate to Site Settings → Custom Code
- Paste the code in the Footer Code section (before
</body>tag) - Publish your site
Performance note: Place JavaScript in the Footer Code section to allow page content to load first and prevent render-blocking.
Important: Scripts only execute on published sites. They won't appear in the Webflow Designer preview. Test on your published or staging site.
The widget supports multiple message rotation, custom color schemes, CTA button integration, and responsive design across desktop and mobile.
What you can build
Integrate Announcement Bar with Webflow to display promotional messaging across your site.
- Flash sale promotions: Display time-limited offers with urgency messaging. Show "24-Hour Flash Sale: 40% Off Winter Collection — Shop Now" with a CTA button linking to the sale category page.
- Shipping threshold messaging: Display static messages like "Free shipping on orders over $50" to encourage higher cart values. Note: This is static text configured in the dashboard — the widget doesn't integrate with cart data for real-time dynamic messaging.
- Product launch announcements: Broadcast new product availability site-wide. Show "New Feature Live: Advanced Analytics Dashboard — Learn More" with a link to product documentation.
- Seasonal campaign messages: Configure multiple messages that rotate automatically during browsing sessions. Note: Message content is configured manually in the Smartarget dashboard — to change seasonal messaging, update the dashboard directly.
Frequently asked questions
Custom code embedding requires a paid Webflow site plan. Free plans do not support custom code integration.
This is expected behavior. The announcement bar uses JavaScript that only executes on published sites, not in Designer preview mode. Publish your site to a staging domain or production URL to test functionality.
Yes. Once you embed the JavaScript snippet, all content updates happen through the Smartarget dashboard. Change message text, adjust styling, or modify CTA buttons — changes appear immediately on your published site without republishing.
Webflow allows up to 50,000 characters total across all custom code areas combined (site settings, page settings, Code Embed elements, and CMS fields). This is a combined limit, not per-section. The Announcement Bar JavaScript snippet is small, but monitor your total character usage if combining with other custom code.
Verify your Webflow plan supports custom code, confirm you published your site (not just saved in Designer), and check that you pasted the code in the Footer Code section. Use browser developer tools (F12) to check the Console tab for JavaScript errors. Clear browser cache or test in incognito mode to rule out caching issues.
Description
Announcement Bar (also called Message Bar) is a Smartarget widget that displays site-wide promotional notifications in a persistent header. It offers customizable messages, call-to-action buttons, brand-aligned colors, and responsive design. Configuration happens through the Smartarget dashboard.
This integration page is provided for informational and convenience purposes only.
Chatbot
Connect ChatBot with Webflow to add automated chat support, capture leads, and automate customer interactions.
HelpDesk
Connect HelpDesk with Webflow to automatically convert form submissions into support tickets and manage customer communications from a single system.
Gift Up
Connect Gift Up with Webflow to sell digital and physical gift cards through HTML embeds.
Google Reviews
Connect Google Reviews to Webflow using simple iframe embeds from Google Maps, third-party widgets like Elfsight, automation tools like Zapier, or direct API integration.
ClickFunnels
Connect ClickFunnels' sales funnel builder and email automation with Webflow's design capabilities through third-party automation platforms.
Pensil
Embed Pensil community forums, live sessions, and discussion boards directly in your Webflow site.
Twilio Segment
Integrate Segment with Webflow to track visitor behavior, collect customer data, and send analytics events to hundreds of marketing and analytics tools through a single implementation.
Webflow's static hosting architecture doesn't support server-side webhook processing or secure token storage that WhatsApp's real-time messaging requires. You'll need external infrastructure or services to bridge this gap.
FullContext
FullContext provides an embeddable JavaScript solution that handles conversational interfaces through a single code snippet, eliminating the need to build chat infrastructure or maintain form validation logic.
Related integrations
Get started for free
Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.
