WooCommerce: How to Show “Free Shipping” Text – An Easy Guide for Newbies
You’ve set up your WooCommerce store, you’re adding products, and everything is looking great. But you want to highlight that awesome free shipping you offer to encourage customers to complete their purchase. Showing “Free Shipping” text can be the tipping point for a hesitant buyer. This guide will walk you through the easiest ways to achieve this, even if you’re a total beginner!
Why Show “Free Shipping” Text?
Think about your own online shopping experiences. When faced with two similar products, and one offers free shipping while the other doesn’t, which one are you more likely to choose? Free shipping is a powerful motivator. Here’s why displaying it prominently is crucial:
- Reduced Cart Abandonment: High shipping costs are a leading cause of cart abandonment. Clearly stating “Free Shipping” can alleviate that concern.
- Increased Sales: Customers are more likely to make a purchase when they know they won’t face unexpected fees at checkout.
- Competitive Advantage: In a crowded marketplace, offering free shipping (and highlighting it) sets you apart from the competition.
- Improved Customer Experience: Transparency about shipping costs builds trust and improves customer satisfaction.
- “A valid free shipping coupon”: This requires customers to enter a coupon code to get free shipping.
- “A minimum order amount”: Free shipping will be applied when the cart total reaches a specific value (e.g., $50). This is the most common and effective approach.
- “A minimum order amount OR a coupon”: Free shipping is available with either a coupon or a minimum order amount.
- “A minimum order amount AND a coupon”: Free shipping is available with both a coupon and a minimum order amount.
- Child Theme (Recommended): If you’re using a custom theme, create a child theme first. This protects your changes from being overwritten when the parent theme updates.
- Theme Editor (Not Recommended for beginners): Go to Appearance > Theme Editor in your WordPress dashboard. Select your theme’s `functions.php` file. Be extremely careful editing this file. A single mistake can break your site. ALWAYS create a backup before making any changes.
Real-Life Example: Imagine you’re selling handmade soaps. A customer adds a few bars to their cart, but they’re unsure about the final cost. If they see “Free Shipping on orders over $30!” prominently displayed, they might add another bar to reach that threshold, increasing your average order value.
Method 1: WooCommerce’s Built-in Free Shipping
WooCommerce has a built-in free shipping method that you can easily configure. This is the simplest and recommended approach for most users.
1. Navigate to WooCommerce Settings: Go to your WordPress dashboard, then navigate to WooCommerce > Settings.
2. Click on the “Shipping” Tab: You’ll find a tab labeled “Shipping”. Click on it.
3. Choose Your Shipping Zone: WooCommerce uses shipping zones to define where you ship and the methods available in each area. Select the shipping zone you want to configure free shipping for.
4. Add Free Shipping: In your selected shipping zone, click “Add shipping method”. In the popup, choose “Free Shipping” and click “Add shipping method” again.
5. Configure Free Shipping: Now, click on the “Free Shipping” option you just added to configure it. Here you have a few options:
6. Set the Minimum Order Amount (If Applicable): If you chose “A minimum order amount” or one of the variations, enter the required amount. For example, if you want to offer free shipping on orders over $50, enter “50”.
7. Save Your Changes: Click the “Save changes” button.
Now, when a customer adds products to their cart and meets your free shipping criteria, WooCommerce will automatically display the “Free Shipping” option at checkout. However, you’ll likely still want to make it even clearer throughout your site. Let’s move on to how to display the free shipping message more prominently.
Method 2: Displaying Free Shipping Text on Product Pages
This method uses a little bit of PHP code, but don’t worry, it’s copy-and-paste easy! This will display the “Free Shipping” text on your product pages, reminding customers of the offer.
1. Access Your Theme’s `functions.php` File: You have two main options for adding the code:
2. Add the Following Code: Copy and paste the following PHP code into your `functions.php` file:
function display_free_shipping_text() { // Replace 50 with your actual minimum order amount for free shipping. $minimum_order_amount = 50;
global $product;
$product_price = $product->get_price();
if ( is_product() && $product_price < $minimum_order_amount ) {
$remaining_amount = $minimum_order_amount – $product_price;
echo ‘
Add $’ . number_format( $remaining_amount, 2 ) . ‘ more to your cart for FREE SHIPPING!
‘;
}
}
add_action( ‘woocommerce_single_product_summary’, ‘display_free_shipping_text’, 30 );
3. Customize the Code:
- `$minimum_order_amount = 50;`: Change `50` to your actual minimum order amount for free shipping.
- `echo ‘
…`
: You can customize the text within the `` tags and the CSS styling (e.g., `color: green;`) to match your site’s design.
4. Save Your Changes: Click the “Update File” button.
Explanation of the Code:
- `display_free_shipping_text()`: This is the name of our function.
- `$minimum_order_amount`: This variable stores your free shipping threshold.
- `is_product()`: This checks if we’re on a single product page.
- `$product_price`: This gets the price of the current product.
- `if ( is_product() && $product_price < $minimum_order_amount )`: This condition checks if we're on a product page and the product price is less than the free shipping threshold.
- `echo ‘
…`: This line displays the message if the condition is true. It uses HTML to format the message.
- `add_action( ‘woocommerce_single_product_summary’, ‘display_free_shipping_text’, 30 );`: This line tells WordPress to execute our function after the product excerpt (summary) on the single product page. The `30` determines the order of execution.
What this does: The code will display a message on each product page indicating how much more the customer needs to spend to qualify for free shipping. It looks something like this: “Add $25.00 more to your cart for FREE SHIPPING!”.
Method 3: Using Plugins
If you’re not comfortable adding code, several WooCommerce plugins can handle displaying free shipping text and notices. Some popular options include:
- Free Shipping Bar: This plugin displays a customizable bar at the top of your site that shows the customer how much more they need to spend to get free shipping.
- WooCommerce Notification: Creates eye-catching notifications that you can use to communicate shipping deals with your customers.
Search the WordPress plugin repository for “WooCommerce free shipping” to find more options. When choosing a plugin, consider its ratings, reviews, and compatibility with your version of WooCommerce.
Important Considerations
- Be Clear and Concise: The free shipping text should be easy to understand and highly visible.
- Match Your Branding: Use colors and fonts that align with your store’s brand identity.
- Test on Mobile: Ensure the free shipping text is responsive and looks good on mobile devices.
- Regularly Review Your Free Shipping Policy: Make sure your free shipping threshold is still profitable for your business.
By implementing these techniques, you can effectively communicate your free shipping offer and encourage more customers to complete their purchases. Good luck!