June 6, 2023

Show ‘Free’ instead of ‘0.00’ as WooCommerce product price

Play Video

What is the tutorial about?

Learning how to show ‘Free’ instead of ‘0.00’ as WooCommerce product price using Code Snippets is the focus of this tutorial by Web Squadron. Discover how to modify WooCommerce’s default behavior of displaying “£0.00” or “$0.00” for free products to show the word “Free” instead. This is useful when you want to highlight free products in your WooCommerce store.

Tutorial Steps

  1. Installing the Code Snippets Plugin:
    Navigate to your WordPress dashboard and go to the Plugins section. Click on “Add New” and search for “Code Snippets”. Install and activate the plugin.
  2. Creating a New Snippet:
    Once the plugin is activated, go to the Snippets section in your WordPress dashboard and click on “Add New”. Give your new snippet a title.
  3. Adding the Code:
    Copy the provided code. Paste this code into your new snippet in WordPress.

    /**
     * Snippet Name:	WooCommerce Change "$0.00" to "Free"
     * Snippet Author:	ecommercehints.com
     */
    
    add_filter( 'woocommerce_get_price_html', 'ecommercehints_change_zero_price_display', 10, 2 );
    function ecommercehints_change_zero_price_display( $price, $product ) {
    if (empty($product->get_price()) || $product->get_price() == 0) { // If price is not entered or set to 0
    $price = __( 'Free', 'woocommerce' );
    }
    return $price;
    }

    Source: Code Snippets

  4. Saving and Activating the Snippet:
    Click on “Save Changes and Activate”. This will activate the snippet and apply the changes to your WooCommerce store.
  5. Checking the Result:
    Go to your WooCommerce store and view a product that is free of charge. Instead of “£0.00” or “$0.00”, it should now display the word “Free”.

Applying the Change to Specific Products

While the tutorial shows you how to change the price display for all free products, there might be instances where you want to apply this change to specific products only. For example, you might want to display “Free” for promotional items but keep the default price display for other products. Here’s how you can modify the code snippet to target specific products:

  1. Identify the Product IDs:
    First, you need to identify the IDs of the products you want to target. You can find the product ID by going to the Products section in your WooCommerce dashboard and hovering over the product name. The ID will be displayed in the URL.
  2. Modify the Code Snippet:
    In the code snippet, you need to add a condition that checks if the product ID matches one of the IDs you want to target. Here’s an example of how you can modify the code:

    /** Helwp.com **/
    
    add_filter( 'woocommerce_get_price_html', 'change_free_price_notice', 10, 2 );
    function change_free_price_notice( $price, $product ) {
        // List of product IDs you want to target
        $target_product_ids = array( 123, 456, 789 );
    
        if ( in_array( $product->get_id(), $target_product_ids ) && '0' === $product->get_price() ) {
            $price = '<span class="woocommerce-Price-amount amount">Free</span>';
        }
    
        return $price;
    }
    

    In this code, “123”, “456”, and “789” should be replaced with the IDs of the products you want to target.

  3. Save and Activate the Snippet:
    After modifying the code, save the changes and activate the snippet. The change will now be applied to the specific products you’ve targeted.

Benefits ‘Free’ instead of ‘0.00’ as WooCommerce product price

This tutorial provides a simple yet effective method for enhancing the display of free products in your WooCommerce store. Here are some of the key benefits:

Improved Customer Perception

By changing the price display from “£0.00” or “$0.00” to “Free”, you can significantly improve customer perception. The word “Free” is much more appealing and can immediately grab a customer’s attention. It gives a clear message that the customer will not have to pay anything for the product, which can be a strong incentive for them to add the product to their cart.

Increased Conversions

Highlighting free products can potentially increase conversions in your WooCommerce store. Customers are more likely to make a purchase when they see they’re getting something for free. This can be particularly effective for promotional items or samples that you want to give away to attract new customers or reward loyal ones.

Enhanced Store Appearance

This change can also enhance the overall appearance of your store. It can make your store look more customer-friendly and professional, which can help build trust with your customers.

Ease of Implementation

One of the biggest benefits of this tutorial is the ease of implementation. With the help of the Code Snippets plugin, you can make this change without any coding knowledge. This makes it a great solution for WooCommerce store owners who are not comfortable with editing code.

By implementing this change, you can make your WooCommerce store more appealing to customers and potentially boost your sales.

Use Cases for this Tutorial

  • Highlighting free products in your WooCommerce store.
  • Enhancing the customer experience by clearly indicating free products.
  • Differentiating free products from low-cost products.

Required Resources

WooCommerce Logo
Free Options
Code Snippets Logo
Free Options
Credit to Web Squadron
Web Squadron is a popular YouTube channel dedicated to providing informative tutorials, tips, and insights on web development and design. With a strong focus on WordPress and website builders like Bricks Builder, the channel aims to help users of all skill levels, from beginners to advanced developers, create and optimize their websites. By offering easy-to-understand, step-by-step guidance, Web Squadron provides practical and valuable content.
Visit
Show ‘Free’ instead of ‘0.00’ as WooCommerce product price
Welcome back!
Enter your Helwp credentials to sign in.

No Account yet? Sign Up

My Account
Menu
Give Feedback
Describe your feedback *
Rate Helwp
Share
Facebook
Twitter
LinkedIn
Reddit
Email
WhatsApp
Telegram
Pocket
Report
Problem *
Describe the problem
Want us to reply?
Your E-Mail
Affiliate Disclosure

At Helwp, we’re committed to transparency and honesty. Therefore, we want to inform you that some of the links on our website are affiliate links. This means that, at no additional cost to you, we may earn a small commission if you click through and make a purchase.

We only promote products or services that we genuinely believe in. These affiliate commissions help us to maintain the website and continue to provide you with free, high-quality WordPress content.

If you are interested in how you can support us even further, check out our support page.