[WordPress] 外掛分享： Free Shipping Bar for WooCommerce – Progress Indicator, Popup & Alerts

內容簡介

Free Shipping Bar for WooCommerce 是一款免運費提示通知列外掛，可在網站上顯示免運門檻進度條，當顧客將商品加入購物車時即時更新剩餘金額，有效提升客單價與結帳轉換率。

【主要功能】
• 即時顯示免運費門檻與剩餘金額進度條
• 支援線性與圓形兩種進度條樣式
• 可自訂通知列背景色、文字色與顯示位置
• 依頁面類型控制通知列顯示範圍
• 支援彈出視窗（Popup）形式顯示免運通知
• 達到免運門檻後可自動隱藏非免運的運送方式

外掛標籤

開發者團隊

原文外掛簡介

Free shipping notification bar plugin for WooCommerce will show a notification bar on your site that will inform your users that you have free shipping available when shopping for X amount. It will also show a live counter as they shop, so the buyer will know as they become eligible for free shipping
Here are a few of the options that you get with the plugin

You can set one shipping zone as default, so you can show the message even when the user has not selected the address
Set custom messages for the shipping bar when the user just enter the site, when he adds some product to cart message changes and when he crosses 50% needed for free shipping message changes and then he reaches the required amount for free shipping, message changes completely

Change design of the bar from within the option:
Change background color
Change text color
Change bar position

In the Pro version, you can add a bar to your desired location using the shortcode [free_shipping_notification]

There is a circular progress bar shown at the bottom so the user can see their progress even when they close the bar
Change the image that is shown inside the circular progress
Set timing for the bar, like when it should appear, whether it should be persistent or hidden after some time
Allows you to set a custom message when the user has purchased a certain amount of product
It also allows you to show how much more they have to purchase to qualify for free shipping
It gives you the option to translate the custom message in different languages on a multilingual site
Instead of showing the notification on all the pages of the site, you can control where to show the free shipping bar, such as showing it only on the product pages, cart page, or checkout page
Show linear progress towards free shipping, as the user adds more products to the cart
Show circular progress toward free shipping, as the user adds more products to the cart
Disable notification bar for mobile devices
Set a custom breakpoint for mobile devices in pixels (device width)
Change the position of the circular progress, as per your theme; there are 4 position options: bottom left, bottom right, top left, top right
Add a free shipping icon in the notification bar
Show “Free shipping” notification when free shipping is available without any restrictions on purchase amount as well
Show “Free shipping” notification when free shipping is available with a minimum amount restriction and coupon code (you can specify different wording when a coupon code is required to get free shipping)
Smooth linear animation on the progress line
Control the color of the progress line to match your website color
Fully compatible with Price Based on Country for WooCommerce
Show free shipping message as a popup
Free shipping popup will show when a product is added or deleted in the cart
You can customize the popup width, background color, font color and have different widths for mobile and desktop
Option to hide all non-free shipping methods when free shipping is available
Option to hide all non-free shipping methods and only show Free shipping and Local pickup methods
When you have free shipping available with “Minimum order amount AND Coupon” then you can hide the notification message when the user adds the coupon to the site
Ignore virtual product cost from minimum amount needed for free shipping (this even changes the behavior of the free shipping method of WooCommerce to ignore the virtual product)
Disable free shipping bar on specific pages, by adding their page IDs, e.g., 22, 33, 45

Try Pro version Admin Demo
The bar is hiding my menu at the top
body.pisol-bar-open{ padding-top:40px; }

When the bar is visible, it adds a class name pisol-bar-open to the body of the page so you can leave some extra spacing at the top so your menu shifts down when the bar is visible. Example: you can add this CSS to add 40px padding from the top when the bar is visible. Add the below CSS in your site Appearance > Customizer > Additional CSS
body.pisol-bar-open{ padding-top:40px; }
So this padding of 40px will be applied when the bar is visible, and it will be removed when the bar is hidden
FEATURES:

Free shipping progress bar

Privacy
If you choose to opt in from the plugin settings, or submit optional feedback during deactivation, this plugin may collect basic technical information, including:

Plugin version
WordPress version
WooCommerce version
Site URL
Deactivation reason (if submitted)

This data is used solely to improve plugin quality, compatibility, and features. No personal or user-specific data is collected without consent.