Search code examples
phpwordpresswoocommercecustom-fields

Set price range on WooCommerce products without setting up variables


IN woocommerce I would like to be able to put a price range on my simple products without setting a variable product as I don't need that.

See the link below: https://www.tnbloom.com.au/product/memorial-wreath/

For example, instead of the actual price of $45, I would like to replace it by $45 - $120 (without setting variable product).

Any help would be much appreciated.


Solution

  • The following code will add a custom price field in the product options pricing settings, to set the max price for your displayed price range. So you will have to set that max price for each product.

    Then it will display on front end a price range, on shop, archives and single product pages, only if the max range field has a price set for it.

    The code:

    // Add a custom field for price range to product in backend
    add_action( 'woocommerce_product_options_pricing', 'add_field_product_options_pricing' );
    function add_field_product_options_pricing() {
        global $post;
    
        echo '<div class="options_group show_if_simple">';
    
        woocommerce_wp_text_input( array(
            'id'            => '_max_price_for_range',
            'label'         => __('Max price for range', 'woocommerce').' ('.get_woocommerce_currency_symbol().')',
            'placeholder'   => __('Set the max price for range', 'woocommerce'),
            'description'   => __('Set the max price for range, to activate it…', 'woocommerce'),
            'desc_tip'      => 'true',
        ));
    
        echo '</div>';
    }
    
    // Save product custom field to database when submitted in Backend
    add_action( 'woocommerce_process_product_meta', 'save_product_options_custom_fields', 30, 1 );
    function save_product_options_custom_fields( $post_id ){
        // Saving custom field value
        if( isset( $_POST['_max_price_for_range'] ) ){
            update_post_meta( $post_id, '_max_price_for_range', sanitize_text_field( $_POST['_max_price_for_range'] ) );
        }
    }
    
    // Frontend: display a price range when the max price is set for the product
    add_filter( 'woocommerce_get_price_html', 'custom_range_price_format', 10, 2 );
    function custom_range_price_format( $price, $product ) {
    
        // Only for simple product type
        if( $product->is_type('simple') ){
            // Get the max price for range
            $max_price = get_post_meta( $product->get_id(), '_max_price_for_range', true );
    
            if( empty($max_price) )
                return $price; // exit
    
            $active_price = wc_get_price_to_display( $product, array( 'price' => $product->get_price() ) );
    
            $price = sprintf( '%s &ndash; %s', wc_price($active_price), wc_price($max_price) );
        }
        return $price;
    }
    

    Code goes in function.php file of your active child theme (or active theme). Tested and works.

    In backend product option settings:

    enter image description here

    Frontend products:

    enter image description here