In WooCommerce, you might notice that variable products show a price range, like “$10 – $20”. This can sometimes confuse customers, especially if you want to display a single price for all variations.
In this tutorial, I’ll show you how to disable the price range or display the price in more appropriate formats like From [$min_price] or Up to [$max_price].
Let’s dive in.
Table of Contents
Code Snippet to Disable Price Range for Variable Products
Format One: From [$min_price]
To display the price range in the format “From [min_price]”, add the following code snippet to your theme’s functions.php
file.
If you want to change the prefix “From” to something else, you can modify this line:
$price = 'From ' . wc_price( $min_price );
Simply replace ‘From’ with your preferred text.
The code will display the lowest price set (including the sale price) for the product.
/*
* Snippet: Disable Price Range for Variable Products in WooCommerce (Show "From [min price]")
* Author: Toufique Alahi
* URL: https://wpblogr.com
* Tested with WooCommerce 9.3.3
*/
add_filter('woocommerce_variable_sale_price_html', 'wpb_show_from_min_price', 10, 2);
add_filter('woocommerce_variable_price_html', 'wpb_show_from_min_price', 10, 2);
function wpb_show_from_min_price( $price, $product ) {
$min_price = $product->get_variation_price();
$max_price = $product->get_variation_price( 'max' );
// If min and max prices are the same, just show the price
if ( $min_price === $max_price ) {
$price = wc_price( $min_price );
} else {
// Show the price like "From [min price]"
$price = 'From ' . wc_price( $min_price );
}
return $price;
}
Format Two: Up to [$max_price]
Similarly, to display the price range in the format ‘Up to [max_price]’, add the following code snippet to your theme’s functions.php
file.
If you want to change the prefix “Up to” to something else, you can modify this line:
$price = 'Up to ' . wc_price( $max_price );
Simply replace ‘Up to’ with your desired text.
/*
* Snippet: Disable Price Range for Variable Products in WooCommerce (Show "Up to [max price]")
* Author: Toufique Alahi
* URL: https://wpblogr.com
* Tested with WooCommerce 9.3.3
*/
add_filter('woocommerce_variable_sale_price_html', 'wpb_show_up_to_max_price', 10, 2);
add_filter('woocommerce_variable_price_html', 'wpb_show_up_to_max_price', 10, 2);
function wpb_show_up_to_max_price( $price, $product ) {
$min_price = $product->get_variation_price();
$max_price = $product->get_variation_price( 'max' );
// If min and max prices are the same, just show the price
if ( $min_price === $max_price ) {
$price = wc_price( $min_price );
} else {
// Show the price like "Up to [max price]"
$price = 'Up to ' . wc_price( $max_price );
}
return $price;
}
If all the variation prices are the same, the prefix won’t be added. Also, the code changes the price format on the Shop page product grids.
Completely Remove the Price Range
You can also hide the price range completely. This means the price will only show after a user selects a variation.
It will not display any price range before that. Here’s a code snippet to do this:
/*
* Snippet: Hide Price Range Until Variation is Selected in WooCommerce
* Author: Toufique Alahi
* URL: https://wpblogr.com
* Tested with WooCommerce 9.3.3
*/
add_filter('woocommerce_variable_sale_price_html', 'wpb_hide_variable_price_range', 10, 2);
add_filter('woocommerce_variable_price_html', 'wpb_hide_variable_price_range', 10, 2);
function wpb_hide_variable_price_range( $price, $product ) {
// Only show price when a variation is selected
if ( is_product() && $product->is_type('variable') ) {
$price = '';
}
return $price;
}
How to Add the Code Snippet
You should add the code snippet to the functions.php
file in your child theme. If you don’t have a child theme, read this guide on How to Create a Child Theme.
Once you have the child theme, follow these steps:
- Go to your WordPress dashboard.
- Hover over Appearance and click on Theme File Editor.
- On the right side, find
functions.php
andstyle.css
- Click on file names to add the code.
Paste the code and click on Update File.
If you have any questions, feel free to leave a comment below. I will try my best to answer.
Change the Price Format Using the Plugin
You can use the Variation Price Display Range for WooCommerce plugin if you don’t want to edit code. It’s a free plugin.
This plugin offers similar options to change how prices are displayed. However, I did not find an option to completely disable the price range. If you need that feature, you will have to use the code.
Cheers!