Floating Bars
A floating bar is a thin horizontal bar that sticks to the top or bottom of the browser window. It stays visible as the visitor scrolls, making it effective for announcements, deadlines, discount codes, and simple opt-ins.
---
Creating a Floating Bar
- Go to Widgets and click Create Widget.
- Open the Template Library and browse the floating bar templates.
Available template categories include:
- End-Page
- Deadline
- Personalized Return Visitor
- Welcome Discounts
- Segmentation Survey
- Gamification
- Simple Subscription
You can also choose Blank Canvas to build from scratch.
---
Customization
Open Widget Settings to adjust appearance:
- Bar size — control the height of the bar.
- Animation — choose how the bar enters the screen (slide down, fade in, etc.).
- Background color or image — set a solid color or upload a background.
- Overlay — add a color overlay on top of the background image.
Hyperlink the Entire Bar
You can make the entire floating bar clickable as a single link. Enable this option in Widget Settings and set the destination URL — useful for simple announcement bars that direct visitors to a sale page or event.
---
Display Rules Example
A common setup for floating bars:
- Show immediately on page load.
- Don't show again if the visitor closed the bar in the last 7 days.
This keeps the bar visible for new visitors without annoying returning ones who already dismissed it.
---
Removing the Close Button
If you want the floating bar to stay visible with no option to dismiss it (e.g., a permanent site-wide notice), add this custom CSS:
.conv-closer {display:none!important;}
This hides the close button entirely. Use sparingly — visitors generally appreciate the ability to dismiss persistent UI elements.
---
Need more help?
If you've worked through this and still need a hand, contact support — we'll dig in with you.