Lightweight High Performance Sticky Bar
by alexgodlewski on WordPress.org
Add a customizable sticky notification bar with countdown functionality to your website with minimal performance impact.
The Lightweight High Performance Sticky Bar is perfect for announcements, promotions, or important messages that need visibility without disrupting the user experience. It adds a customizable sticky bar to the top of your website with options for a countdown timer.
Features
- Smooth Animations: Clean transitions when showing and hiding the bar
- Customizable Text: Set your own message to display
- Color Picker: Choose any background color with the built-in WordPress color picker
- Cookie Integration: Bar stays hidden for visitors who close it
- Configurable Duration: Set how many hours the bar stays hidden after being closed
- Admin Bar Compatible: Automatically adjusts position when WordPress admin bar is present
- Content-Friendly: Adds padding to avoid covering your website content
- Lightweight: Minimal impact on page load times and performance
- Mobile-Friendly: Fully responsive design that works on all devices
- No Dependencies: Doesn’t require any external libraries beyond jQuery (included with WordPress)
- Countdown Timer: Display a countdown to a specific date and time
- Cache-Compatible: Works with page caching plugins
- Customizable Countdown: Position, colors, labels, and end actions
Technical Details
The sticky bar appears at the top of your website as the first element in the header. It includes:
- Smart Positioning: Detects and adjusts for the WordPress admin bar when logged in
- Body Padding: Automatically adds padding to prevent content from being hidden
- Responsive Layout: Adapts to all screen sizes from mobile to desktop
- Performance Optimized: JavaScript and CSS are minified and only loaded when needed
- Cookie-Based Memory: Respects user preferences by remembering when they’ve dismissed the bar
- Countdown Feature: Display days, hours, minutes, and seconds remaining until a target date
- AJAX Updates: Ensures countdown accuracy even with cached pages
Configuration Options
- Bar Text: The message displayed in the sticky bar
- Background Color: Color picker for the bar background
- Hide Duration: Hours the bar stays hidden after closing
- Enable Bar: Toggle to activate/deactivate the bar
- Enable Countdown: Toggle to enable the countdown timer
- Target Date: The date and time that the countdown targets
- After Countdown Ends: What happens when countdown reaches zero (Show Zeros, Remove Countdown, or Remove Bar)
- Countdown Position: Where to display the countdown relative to text
- Numbers Background: Background color for countdown digits
- Numbers Font Color: Text color for countdown digits
- Show Labels: Toggle to show/hide time unit labels (Days, Hours, etc.)
- Labels Position: Display labels above or below the numbers
- Custom Labels: Customize the text for each time unit label
Requirements
- WordPress 5.0 or higher
- PHP 7.4 or higher
- JavaScript enabled in the browser
- Cookies enabled for remembering user preferences
Requirements
- WordPress 5.0 or higher
- PHP 7.4 or higher
- JavaScript enabled in the browser
- Cookies enabled for remembering user preferences
License
This plugin is licensed under the GPLv2 or later.
Credits
Developed by Alex Godlewski, Hyroes.com
Privacy
This plugin sets a cookie (HyroesStickyBarClosed) in the visitor’s browser when they close the sticky bar. This cookie only stores a simple “closed” status and does not collect any personal information or track users.
The cookie expires after the configured number of hours (default: 24 hours). No data is sent to external servers except for the AJAX requests used to update the countdown timer, which do not contain any personal information.
