Shipping Calculator adds a shipping calculator to your product pages, so shoppers can check what delivery to their address costs before they add anything to the cart. It shows the options and prices from your own WooCommerce shipping zones and methods.
Shipping Calculator doesn’t create shipping rates. Every option and price it shows comes from WooCommerce » Settings » Shipping, including methods added by other shipping plugins, so set up your shipping there first.
When you’d use this
- Answer "do you ship to me, and what does it cost?" on the product page instead of at checkout.
- Let shoppers compare delivery options and costs while they’re still deciding what to buy.
- Show international shoppers whether you deliver to their country.
- Put the calculator in its own Shipping tab next to the product description.
Requirements
- WordPress 6.3 or later, WooCommerce 9.9 or later, and PHP 7.4 or later. WooCommerce must be active.
- Compatible with WooCommerce’s cart and checkout blocks and High-Performance Order Storage.
- Shipping turned on in WooCommerce, with at least one shipping method in a shipping zone.
- Enable the shipping calculator on the cart page ticked under WooCommerce » Settings » Shipping » Shipping settings (it’s on by default). The product page calculator uses WooCommerce’s own address form, which follows that setting.
- The calculator shows on products that need shipping. Virtual products don’t get one.
Install and activate
Shipping Calculator is sold on kestrelwp.com. Download the plugin from the Licensed downloads tab of your kestrelwp.com account and install it. Then go to Settings » Shipping Calculator for WooCommerce activation and activate the key from your License keys tab to receive updates. See using sites against your activation limit for how activations count.
For upload, FTP and update steps, follow how to install and update WooCommerce extensions.
If you’re updating from an earlier version and the activation page shows the plugin as not activated, replace any key in the field with the license key from the License keys tab of your kestrelwp.com account, and click Save changes.
Set up Shipping Calculator
1. Check your shipping setup
Go to WooCommerce » Settings » Shipping and make sure the zones you deliver to each have at least one shipping method. If shipping is turned off or no method exists, the WooCommerce settings screens show a warning (see Common issues).
2. Choose where the calculator appears
Go to WooCommerce » Settings » Shipping » Shipping calculator. Pick a Position, change the Label if you like, and click Save changes. The default puts the calculator in a Shipping tab after the product description.
3. Check it on a product
Open a product that needs shipping in a private browser window. Find the calculator where you placed it, enter an address in a zone you ship to, and click Update. The calculator lists the shipping options for that address with their prices.
How the estimate works
The calculator asks WooCommerce what shipping would cost if the shopper bought this product. It works out the price the same way your cart does:
- On a simple product, the estimate covers the product at the quantity in its quantity box, plus anything already in the shopper’s cart. With an empty cart, that’s the product alone.
- Every option WooCommerce offers for the address is listed with its price, including options from other shipping plugins. An option with no cost shows "FREE".
- Shoppers don’t choose an option in the calculator. They pick one in the cart or at checkout as usual.
- If a flat rate cost uses
[qty],[cost]or[fee percent="…"], the estimate updates as soon as the shopper changes the quantity. - WooCommerce remembers the address for the shopper’s visit, so their cart and checkout start with it. While their cart is empty, the plugin also keeps it in a
wsc_locationcookie.
Settings
Go to WooCommerce » Settings » Shipping » Shipping calculator. The settings apply to every product.
Label
The calculator’s heading, and the name of its tab when the calculator is in a tab. Default "Shipping". Something like "Do we ship to you?" works well.
Position
Where the calculator appears on product pages:
- Don’t display the shipping calculator automatically: no automatic placement. Use this when you add the calculator yourself with the shortcode.
- Above the add to cart button, Above the product meta data and Below the product meta data: in the product summary, next to the price and add to cart button. The product meta data is the SKU, categories and tags.
- As an extra tab before the product description, As an extra tab after the product description (the default), As an extra tab after the additional information and As an extra tab after the reviews: in its own product tab, named after the Label. If the tab it’s placed next to doesn’t exist on a product, the calculator tab goes at the end.
These positions rely on WooCommerce’s standard product page layout. Shipping Calculator adjusts them for the Astra, OceanWP, Porto, Shoptimizer and Woodmart themes. If your theme or page builder lays out product pages its own way, use the shortcode instead.
Expand
Only shown when Position is in the product summary.
- Add a link to expand and show the shipping calculator (the default): shows the Label as a link, and the calculator opens when the shopper clicks it.
- The shipping calculator is always visible: the calculator is open from the start.
A calculator in a tab is always open. The shortcode follows this setting too, but the setting is hidden while Position is Don’t display the shipping calculator automatically. To change it for the shortcode, pick one of the summary positions, choose an Expand option and save, then set Position back and save again. The setting keeps your choice.
What customers see
On the product page, shoppers see the calculator with the options and prices for the address WooCommerce already has for them, if any, and "Shipping to" with that address. They click Calculate shipping or Change address, fill in their Country / region, State / County, City and Postcode / ZIP, and click Update.
If no shipping method covers their address, they see "No shipping options were found for" followed by the address, and an Enter a different address link. If nothing can be worked out yet, the calculator says "Shipping costs are calculated during checkout."
The calculator refreshes itself after the page loads, so it shows current options even when your product pages are cached.
If you use Quick View for WooCommerce, the calculator also shows in the quick view pop-up when Position is one of the product summary positions. Pop-ups have no tabs, so a calculator in a tab doesn’t appear there.
Add the calculator anywhere with the shortcode
Add [shipping_calculator] with a Shortcode block (or your page builder’s shortcode element) to place the calculator yourself. Set Position to Don’t display the shipping calculator automatically so it doesn’t appear twice.
- On a product page, including a block theme’s single product template or a page builder’s product layout, it shows the calculator for that product.
- On other pages, it works when the shortcode is in the page’s own content, and quotes shipping for what’s in the shopper’s cart.
To add more than the calculator to a Shipping tab, such as a table of your delivery times, create the tab with a tab manager plugin and put the shortcode inside it along with your content. Set Position to Don’t display the shipping calculator automatically.
Developers can also call wsc_display_shipping_calculator() from a child theme template. See the Shipping Calculator developer reference.
Common issues
The calculator doesn’t appear on product pages
Work through these in order:
- The product needs shipping. Virtual products don’t show the calculator.
- Position isn’t Don’t display the shipping calculator automatically, or you’ve added the shortcode.
- Shipping is set up. The WooCommerce settings screens warn you if it isn’t (see the next two issues).
- Your theme uses WooCommerce’s standard product page layout. If it doesn’t, use the shortcode.
"Shipping is disabled in WooCommerce, so the shipping calculator will not appear on your product pages."
Shipping is turned off for your store. Go to WooCommerce » Settings » General, set Shipping location(s) to an option other than Disable shipping & shipping calculations, and click Save changes.
"No shipping methods are set up, so the shipping calculator will not appear on your product pages."
None of your shipping zones has a method. Go to WooCommerce » Settings » Shipping, open a zone (or add one), and add at least one shipping method.
The calculator lists options but there’s no address form
WooCommerce’s cart calculator is turned off. Go to WooCommerce » Settings » Shipping » Shipping settings, tick Enable the shipping calculator on the cart page, and click Save changes.
Shoppers see "No shipping options were found for" their address
None of your shipping zones covers that address with a method. Add a method to a zone that matches it, or to the Rest of the world zone for addresses outside your other zones.
The calculator is in the wrong place, or shows twice
Your theme moves WooCommerce’s product page sections, or you’ve added the shortcode as well as a Position. Pick a different Position, or set it to Don’t display the shipping calculator automatically and place the shortcode where you want it. In a block theme, the summary positions all appear in the same spot, so use the shortcode for a precise position.
The shortcode calculator is always collapsed (or always open)
The shortcode follows the Expand setting, which is hidden while Position is Don’t display the shipping calculator automatically. Set it as described under Expand.
The calculator doesn’t show in the quick view pop-up
Quick view pop-ups have no tabs. Choose one of the product summary positions to show the calculator there.
The estimate is higher than shoppers expect
The estimate includes what’s already in their cart as well as this product, at the quantity in the quantity box. Shipping costs per item or per order total grow with the cart.
Keep learning
- Shipping Calculator developer reference (filters, actions and placing the calculator in code)
- How to install and update WooCommerce extensions
- Using sites against your activation limit
- How to add custom CSS to your site (restyling the calculator)
- Changing text in a plugin (changing the calculator’s wording)