Hide Price Range when variance selected

Hey Dan,

This is possible to do with some customization. You’ll likely need to write some javascript for this so you can conditionally hide the price range.

If you aren’t comfortable writing code, then you may need to consider hiring a developer:

– https://jobs.wordpress.net/
– https://codeable.io/

I’m happy to code ?? – I just prefer plugins otherwise code often needs re-doing after an upgrade! Having said that though, I am after whatever works!
Any ideas as to where the code can be modified? I have a look and all I could find was in \woocommerce\includes\wc-formatting-functions.php:
$return = '<span class="woocommerce-Price-amount amount">' . $formatted_price . '</span>';

This line (426) seems to pull up the variance range of prices and the variance price itself…. – This is where I got stuck….

Many Thanks

Ah, so in brief, just to simplify; I have added my own class which is nowhere else in any of the stylesheets. So I have now set it up so all I need is:
If <div class=”woocommerce-variation-price”> then hide <div class=”HBDRange”>
For those following this, I added my own class to the range area by adding a class to Line 26 of \woocommerce\templates\single-product\price.php, it looks like this:
<div itemprop="offers" itemscope itemtype="https://schema.org/Offer">
So I made it this:
<div itemprop="offers" itemscope itemtype="https://schema.org/Offer" class="HBDRange">
I hope this helps, next bit I need to do is to do is as explained above, get one to hide when the other is visible.

You won’t need to hook into anywhere specific to do this. Can just use jQuery’s .hide() function if the second price is showing, or if a variation is selected, etc. You can use your own custom javascript file for this.

I know, it’s just getting the code to work!
I have modified added CSS to display: none; on both DIVs but the script doesn’t seem to kick in as, you’ve guessed it, it hides both prices….
My js is:

$(document).ready(function() {

    if($("woocommerce-variation-price").hasClass("woocommerce-variation-price")) {
        $("HBDRange").fadeIn("fast");
    }

    else if($("HBDRange").hasClass("HBDRange")) {
        $("woocommerce-variation-price").fadeIn("fast");
    }

});

Don’t think you are correctly targeting things in your code. Missing a period for the class. See https://api.jquery.com/class-selector/

Again though, this is a bit outside the scope of support in the forums here. You’ll need to hire another developer with more experience if you need further help with custom code.