alexgodlewski

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.
<h4>Features</h4>
<ul>
<li>Smooth Animations: Clean transitions when showing and hiding the bar</li>
<li>Customizable Text: Set your own message to display</li>
<li>Color Picker: Choose any background color with the built-in WordPress color picker</li>
<li>Cookie Integration: Bar stays hidden for visitors who close it</li>
<li>Configurable Duration: Set how many hours the bar stays hidden after being closed</li>
<li>Admin Bar Compatible: Automatically adjusts position when WordPress admin bar is present</li>
<li>Content-Friendly: Adds padding to avoid covering your website content</li>
<li>Lightweight: Minimal impact on page load times and performance</li>
<li>Mobile-Friendly: Fully responsive design that works on all devices</li>
<li>No Dependencies: Doesn’t require any external libraries beyond jQuery (included with WordPress)</li>
<li>Countdown Timer: Display a countdown to a specific date and time</li>
<li>Cache-Compatible: Works with page caching plugins</li>
<li>Customizable Countdown: Position, colors, labels, and end actions</li>
</ul>
<h3>Technical Details</h3>
The sticky bar appears at the top of your website as the first element in the header. It includes:
<ul>
<li>Smart Positioning: Detects and adjusts for the WordPress admin bar when logged in</li>
<li>Body Padding: Automatically adds padding to prevent content from being hidden</li>
<li>Responsive Layout: Adapts to all screen sizes from mobile to desktop</li>
<li>Performance Optimized: JavaScript and CSS are minified and only loaded when needed</li>
<li>Cookie-Based Memory: Respects user preferences by remembering when they’ve dismissed the bar</li>
<li>Countdown Feature: Display days, hours, minutes, and seconds remaining until a target date</li>
<li>AJAX Updates: Ensures countdown accuracy even with cached pages</li>
</ul>
<h4>Configuration Options</h4>
<ul>
<li>Bar Text: The message displayed in the sticky bar</li>
<li>Background Color: Color picker for the bar background</li>
<li>Hide Duration: Hours the bar stays hidden after closing</li>
<li>Enable Bar: Toggle to activate/deactivate the bar</li>
<li>Enable Countdown: Toggle to enable the countdown timer</li>
<li>Target Date: The date and time that the countdown targets</li>
<li>After Countdown Ends: What happens when countdown reaches zero (Show Zeros, Remove Countdown, or Remove Bar)</li>
<li>Countdown Position: Where to display the countdown relative to text</li>
<li>Numbers Background: Background color for countdown digits</li>
<li>Numbers Font Color: Text color for countdown digits</li>
<li>Show Labels: Toggle to show/hide time unit labels (Days, Hours, etc.)</li>
<li>Labels Position: Display labels above or below the numbers</li>
<li>Custom Labels: Customize the text for each time unit label</li>
</ul>
<h3>Requirements</h3>
<ul>
<li>WordPress 5.0 or higher</li>
<li>PHP 7.4 or higher</li>
<li>JavaScript enabled in the browser</li>
<li>Cookies enabled for remembering user preferences</li>
</ul>
<h3>Requirements</h3>
<ul>
<li>WordPress 5.0 or higher</li>
<li>PHP 7.4 or higher</li>
<li>JavaScript enabled in the browser</li>
<li>Cookies enabled for remembering user preferences</li>
</ul>
<h3>License</h3>
This plugin is licensed under the GPLv2 or later.
<h3>Credits</h3>
Developed by Alex Godlewski, <a href="https://hyroes.com" rel="nofollow ugc">Hyroes.com</a>
<h3>Privacy</h3>
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.

Lightweight High Performance Sticky Bar

Add a customizable sticky notification bar with countdown functionality to your website with minimal performance impact.

VillaTheme

Andy Ha

Have you heard of the phrase “WooCommerce free shipping over amount”? This term refers to a feature that can display the amount of free shipping left on the front end of a WooCommerce store. Use free shipping notifications on your website to attract customers’ purchases to gain free shipping, increase sales of shop owners.
So how did you do to display the free shipping for orders over a certain amount on your website? Let’s take a look at our plugin to see how it can assist you in displaying a free shipping bar on your WooCommerce website.
What is the WooCommerce Free Shipping Bar? Can it help to offer WooCommerce free shipping over amount?
The increase in sales and traffic to the website is very important for a website or an online store. Customers making a purchase usually enjoy the free shipping method. Woocommerce Free Shipping Bar – WooCommerce Free shipping plugin allows:
<ul>
<li>
Display Free shipping bar and progress bar
</li>
<li>
Variety of Free shipping bar and progress bar positions
</li>
<li>
Design: You can design the shipping bar in order to match your theme or site’s style.
</li>
<li>
Flexible custom messages on the shipping bar.
</li>
</ul>
Effect: Settings to let the shipping bar appear or hide after a certain time, or close the shipping bar button.
<blockquote>
<a href="https://new2new.com/?item=woocommerce-free-shipping-bar" title="Demo Free Shipping Bar for WooCommerce" rel="nofollow ugc">Try the Demo</a> | <a href="http://docs.villatheme.com/?item=woocommerce-free-shipping-bar" title="Documents" rel="nofollow ugc">Documents</a> | <a href="https://1.envato.market/N3mPV" title="Pro Version" rel="nofollow ugc">Pro Version</a> | <a href="https://www.facebook.com/groups/villatheme" title="VillaTheme" rel="nofollow ugc">Facebook group</a>
</blockquote>
Preview WooCommerce Free Shipping 
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/bjvflHXXBCU?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
You can learn how to use the plugin by this video guide:
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/25nsSu5j9Q8?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
<h3>Important Notice:</h3>
<ul>
<li>
Plugin works based on WooCommerce plugin.
</li>
<li>
The plugin is released on WordPress.org and you can use plugin as free to build themes for sale.
</li>
</ul>
<h3>FEATURES</h3>
► Display Free shipping bar and progress bar to offer WooCommerce free shipping over amount
<ul>
<li>
Free shipping bar: Free shipping bar with various messages to reach to free shipping. You can select to display 
the free shipping bar on the top header or bottom.
</li>
<li>
Progress bar: There is a progress bar that shows how much more by percentage a customer should purchase to qualify 
for free shipping. This progress bar will display along with the free shipping bar
</li>
<li>
Small progress bar: A small progress bar indicates how much more a customer should purchase to qualify for free 
shipping. A small progress bar can display on the menu cart, sidebar cart, cart page, and checkout page.
</li>
</ul>
► Variety of Free shipping bar and progress bar positions to display WooCommerce free shipping over amount
<ul>
<li>
Shipping bar positions: There are 2 positions that you can select to show the shipping bar: on the top header or 
at the bottom
</li>
<li>
Progress bar positions: There are 2 main positions of the progress bar in comparison with the shipping bar: inside 
or under.
</li>
</ul>
► Design: You can design to display WooCommerce Free Shipping over amount in order to match your theme or site’s style.
<ul>
<li>
Shipping bar: You can set the background color, text color, link color, font family, font size, text-align of the 
shipping bar.
</li>
<li>
Progress bar: You can set the background color, text color, font size, bar effect (Plain, loading, border) of the 
progress bar.
</li>
<li>
Custom CSS: Design shipping bar and progress bar as you want.
</li>
</ul>
► Other outstanding features
<ul>
<li>
Announce system: Content is shown in the main progress bar when users access the website. Use the available shortcode to add in this form. For example, we are having a Free Shipping system for customers when you buy greater than or equal to {min_amount}
</li>
<li>
Message after purchasing: Content notification is shown in the main progress bar when the user adds a product to the cart. Use some available shortcodes to add in this form.Example: You have purchased {total_amounts} of {min_amount} Free Shipping system.
</li>
<li>
Message if reach to free shipping: Content notification is shown in main progress bar when users total amount greater than or equal with a minimum order amount of Free Shipping zone and then users can directly go to checkout page with available shortcodes. For example Congratulation! You have achieved enough to be able to get free shipping. Go to {checkout_page}
</li>
<li>
Message if not reach to free shipping: Content is shown in main progress bar of checkout page when users missing amounts to receive Free Shipping. This total missing can be added with the available shortcodes. Example: You are missing {missing_amount} achieved enough to be able to get Free Shipping. Continue {shopping}
</li>
</ul>
► Flexible custom messages on shipping bar to offer WooCommerce free shipping over amount
<ul>
<li>
Free shipping zone: Select a shipping zone from WooCommerce that allows free shipping to display the progress.
</li>
<li>
Shortcodes: 6 shortcodes are available for you to customize your free shipping bar front-end message
<ul>
<li>{min_amount} – Minimum order amount Free Shipping</li>
<li>{total_amounts} – The total amount of your purchases</li>
<li>{cart_amount} – Total current cart amount</li>
<li>{missing_amount} – The outstanding amount of free shipping</li>
<li>{checkout_page} – Link to checkout page</li>
<li>{shopping} – Link to the shop page</li>
</ul>
</li>
<li>
Works on mobile!: The bar will be displayed normally on mobile devices. Almost purchase has now come from mobile devices so working on responsive devices is now a very important feature for all plugins.
</li>
<li>
Initial delay: The delay time to display the bar after page loaded.
</li>
<li>
You can design to display WooCommerce Free Shipping over amount in order to match your theme or site’s style.: Design your free shipping bar with 3 font-end styles, 2 positions (top and bottom), Background Color, Text Color, Link Color, Font-Size, Text Align, Enable/Disable free shipping progress,
</li>
<li>
Giftbox: Enable or disable the free shipping gift box on the corner of the screen. If this option is disabled, the bar will automatically appear and disappear
</li>
<li>
Easy to use: The plugin does have a nice design and friendly user interface.
</li>
</ul>
<h3>PRO VERSION</h3>
<ul>
<li>
All features from free version.
</li>
<li>
6 months premium support from VillaTheme: We will help you if you have any problem with the plugin Free Shipping Bar for WooCommerce.
</li>
<li>
Detect country and select shipping zone: Free shipping bar will automatically detect customer’s location base on 
their IP address. Then automatically select shipping zone. Example**: You have a store located in America. You provide 
free shipping for order above 100 USD with customers from US. But if a customers from Canada, his order will need to be above 200USD to claim free shipping. That is when this option works for you, it will automatically select shipping zone (US or Canada) to display free shipping progress.
</li>
<li>
Enable/Disable the bar on mobile devices.
</li>
<li>
Small progress bar: A small progress bar indicates how much more a customer should purchase to qualify for free shipping. A small progress bar can display on the menu cart, sidebar cart, cart page, and checkout page.
</li>
<li>
Design: More design options with the pro version Font-Family, Progress Background Color, Current Progress Background Color, Progress Text Color, Font-Size Progress Bar, Progress Bar Effect.
</li>
<li>
Gift icon: The icon to call out the WooCommerce Free Shipping over amount bar when it is hidden.
</li>
<li>
Custom CSS: Unlimited your free shipping bar with the Custom CSS option.
</li>
<li>
Initial delay: Select a delay time for the bar to appear after site fully loaded. The bar will make no effect on your site loading time.
</li>
<li>
Close message: Allow customers to close the bar.
</li>
<li>
Time to disappear: Select a time for the bar to automatically disappear. Customer can make it reappear by click on the free delivery icon.
</li>
<li>
Conditional tags: Select which page where the bar should appear. Normally, you will want the bar to appear on WooCommerce pages only. This option will help you to configure where the bar appear by using WordPress conditional tags.
</li>
<li>
Assign pages: Choose to hide the bar on common page like Homepage, Blog page, Cart page, Checkout page…
</li>
<li>
GET PRO VERSION <a href="https://1.envato.market/N3mPV" rel="nofollow ugc">https://codecanyon.net/item/woo-free-shipping-bar/19536343</a>
</li>
</ul>
<h3>MAY BE YOU NEED</h3>
<a href="https://wordpress.org/plugins/9mail-wp-email-templates-designer/" rel="ugc">9MAIL – WordPress Email Templates Designer</a>
<a href="https://wordpress.org/plugins/9map-map-multi-locations/" rel="ugc">9Map – Map Multi Locations</a>
<a href="https://wordpress.org/plugins/woo-abandoned-cart-recovery/" rel="ugc">Abandoned Cart Recovery for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-advanced-product-information/" rel="ugc">Advanced Product Information for WooCommerce</a>
<a href="https://wordpress.org/plugins/affi-affiliate-marketing-for-woo/" rel="ugc">AFFI – Affiliate Marketing for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-alidropship/" rel="ugc">ALD – Dropshipping and Fulfillment for AliExpress and WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-boost-sales/" rel="ugc">Boost Sales for WooCommerce – Set up Up-Sells & Cross-Sells Popups & Auto Apply Coupon</a>
<a href="https://wordpress.org/plugins/bopo-woo-product-bundle-builder/" rel="ugc">Bopo – WooCommerce Product Bundle Builder</a>
<a href="https://wordpress.org/plugins/bulky-bulk-edit-products-for-woo/" rel="ugc">Bulky – Bulk Edit Products for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-cart-all-in-one/" rel="ugc">Cart All In One For WooCommerce</a>
<a href="https://wordpress.org/plugins/catna-woo-name-your-price-and-offers/" rel="ugc">Catna – Woo Name Your Price and Offers</a>
<a href="https://wordpress.org/plugins/checkout-upsell-funnel-for-woo/" rel="ugc">Checkout Upsell Funnel for WooCommerce</a>
<a href="https://wordpress.org/plugins/chinads-dropshipping-taobao-woocommerce/" rel="ugc">ChinaDS – Tmall-Taobao Dropshipping for WooCommerce</a>
<a href="https://wordpress.org/plugins/clear-autoptimize-cache-automatically/" rel="ugc">Clear Autoptimize Cache Automatically</a>
<a href="https://wordpress.org/plugins/compe-woo-compare-products/" rel="ugc">COMPE – WooCommerce Compare Products</a>
<a href="https://wordpress.org/plugins/woo-coupon-reminder/" rel="ugc">Coreem – Coupon Reminder for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-coupon-box/" rel="ugc">Coupon Box for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-multi-currency/" rel="ugc">CURCY – Multi Currency for WooCommerce – Smoothly on WooCommerce 9.x</a>
<a href="https://wordpress.org/plugins/woo-customer-coupons/" rel="ugc">Customer Coupons for WooCommerce</a>
<a href="https://wordpress.org/plugins/depart-deposit-and-part-payment-for-woo/" rel="ugc">DEPART – Deposit and Part payment for Woo</a>
<a href="https://wordpress.org/plugins/email-template-customizer-for-woo/" rel="ugc">Email Template Customizer for WooCommerce</a>
<a href="https://wordpress.org/plugins/epoi-wp-points-and-rewards/" rel="ugc">EPOI – WP Points and Rewards</a>
<a href="https://wordpress.org/plugins/epow-custom-product-options-for-woocommerce/" rel="ugc">EPOW – Custom Product Options for WooCommerce</a>
<a href="https://wordpress.org/plugins/eu-cookies-bar/" rel="ugc">EU Cookies Bar for WordPress</a>
<a href="https://wordpress.org/plugins/exmage-wp-image-links/" rel="ugc">EXMAGE – WordPress Image Links</a>
<a href="https://wordpress.org/plugins/woo-virtual-reviews/" rel="ugc">Faview – Virtual Reviews for WooCommerce</a>
<a href="https://wordpress.org/plugins/fewc-extra-checkout-fields-for-woocommerce/" rel="ugc">FEWC – Extra Checkout Fields For WooCommerce</a>
<a href="https://wordpress.org/plugins/gift4u-gift-cards-all-in-one-for-woo/" rel="ugc">GIFT4U – Gift Cards All in One for Woo</a>
<a href="https://wordpress.org/plugins/handmade-dropshipping-for-etsy-and-woo/" rel="ugc">HANDMADE – Dropshipping for Etsy and WooCommerce</a>
<a href="https://wordpress.org/plugins/happy-helpdesk-support-ticket-system/" rel="ugc">HAPPY – Helpdesk Support Ticket System</a>
<a href="https://wordpress.org/plugins/jagif-woo-free-gift/" rel="ugc">Jagif – WooCommerce Free Gift</a>
<a href="https://wordpress.org/plugins/woo-lookbook/" rel="ugc">LookBook for WooCommerce – Shoppable with Product Tags</a>
<a href="https://wordpress.org/plugins/woo-lucky-wheel/" rel="ugc">Lucky Wheel for WooCommerce – Spin a Sale</a>
<a href="https://wordpress.org/plugins/wp-lucky-wheel/" rel="ugc">Lucky Wheel Giveaway</a>
<a href="https://wordpress.org/plugins/woo-notification/" rel="ugc">Notification for WooCommerce | Boost Your Sales – Recent Sales Popup – Live Feed Sales – Upsells</a>
<a href="https://wordpress.org/plugins/woo-orders-tracking/" rel="ugc">Orders Tracking for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-photo-reviews/" rel="ugc">Photo Reviews for WooCommerce</a>
<a href="https://wordpress.org/plugins/pofily-woo-product-filters/" rel="ugc">Pofily – WooCommerce Product Filters</a>
<a href="https://wordpress.org/plugins/product-pre-orders-for-woo/" rel="ugc">PRENA – Product Pre-Orders for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-product-builder/" rel="ugc">Product Builder for WooCommerce – Custom PC Builder</a>
<a href="https://wordpress.org/plugins/product-size-chart-for-woo/" rel="ugc">Product Size Chart For WooCommerce</a>
<a href="https://wordpress.org/plugins/product-variations-swatches-for-woocommerce/" rel="ugc">Product Variations Swatches for WooCommerce</a>
<a href="https://wordpress.org/plugins/redis-woo-dynamic-pricing-and-discounts/" rel="ugc">REDIS – WooCommerce Dynamic Pricing and Discounts</a>
<a href="https://wordpress.org/plugins/rees-real-estate-for-woo/" rel="ugc">REES – Real Estate for Woo</a>
<a href="https://wordpress.org/plugins/import-shopify-to-woocommerce/" rel="ugc">S2W – Import Shopify to WooCommerce</a>
<a href="https://wordpress.org/plugins/sales-countdown-timer/" rel="ugc">Sales Countdown Timer</a>
<a href="https://wordpress.org/plugins/subre-product-subscription-for-woo/" rel="ugc">SUBRE – Product Subscription for WooCommerce – Recurring Payments</a>
<a href="https://wordpress.org/plugins/woo-suggestion-engine/" rel="ugc">Suggestion Engine for WooCommerce</a>
<a href="https://wordpress.org/plugins/woo-thank-you-page-customizer/" rel="ugc">Thank You Page Customizer for WooCommerce – Increase Your Sales</a>
<a href="https://wordpress.org/plugins/tmds-dropshipping-for-temu-and-woo/" rel="ugc">TMDS – Dropshipping for TEMU and Woo</a>
<a href="https://wordpress.org/plugins/vargal-additional-variation-gallery-for-woo/" rel="ugc">VARGAL – Additional Variation Gallery for WooCommerce</a>
<a href="https://wordpress.org/plugins/villatheme-core/" rel="ugc">VillaTheme Core</a>
<a href="https://wordpress.org/plugins/vima-multi-customer-addresses-for-woo/" rel="ugc">VIMA – Multi Customer Addresses for Woo</a>
<a href="https://wordpress.org/plugins/viseek-easy-custom-search/" rel="ugc">VISeek – Easy Custom Search</a>
<a href="https://wordpress.org/plugins/w2s-migrate-woo-to-shopify/" rel="ugc">W2S – Migrate WooCommerce to Shopify</a>
<a href="https://wordpress.org/plugins/webpos-point-of-sale-for-woocommerce/" rel="ugc">WebPOS – Point of Sale for WooCommerce</a>
<a href="https://wordpress.org/plugins/wpbulky-wp-bulk-edit-post-types/" rel="ugc">WPBulky – WordPress Bulk Edit Post Types</a>
<h3>3rd party services</h3>
<ul>
<li>Using Google Fonts to Enhance Typography 
► <a href="https://fonts.google.com/" rel="nofollow ugc">Google Fonts</a> 
► <a href="https://developers.google.com/fonts/terms" rel="nofollow ugc">Google Fonts Terms of Services</a></li>
</ul>
<h3>Documentation</h3>
<ul>
<li><a href="https://docs.villatheme.com/?item=woocommerce-free-shipping-bar" rel="nofollow ugc">Getting Started</a></li>
</ul>
<h3>Plugin Links</h3>
<ul>
<li><a href="https://villatheme.com/extensions/woocommerce-free-shipping-bar/" rel="nofollow ugc">Project Page</a></li>
<li><a href="https://docs.villatheme.com/?item=woocommerce-free-shipping-bar" rel="nofollow ugc">Documentation</a></li>
<li><a href="https://villatheme.com/knowledge-base/security-is-our-priority/" rel="nofollow ugc">Report Bugs/Issues</a></li>
</ul>

Free Shipping Bar for WooCommerce

Motivate customers to reach the free shipping threshold with a visual free shipping bar, dynamic messages and progress tracker.

Lightweight High Performance Sticky Bar vs Free Shipping Bar for WooCommerce