Hide product prices
You can hide all of your product prices and reveal them again in the future by editing your currency formats.
Confirm you are in the General section, or click General if you are not already there.
In the Store currency section, click Change formatting.
Wrap the first two formats in a
span
element with a class set tohidden
. Don't use quotes. For example, below is the HTML with currency format for a store that uses USD as its currency:<span class=hidden>${{ amount }} USD</span>
Below is the HTML without currency format:
<span class=hidden>${{ amount }}</span>
This should hide all the prices on your storefront. If prices are still showing, then you need to add some code to the bottom of your theme's stylesheet. Continue to follow the next steps.
In the Assets directory, click to open your
theme.scss.liquid
file.The name of the stylesheet can vary theme to theme, so if you cannot find
theme.scss.liquid
, look for one of the following:style.scss.liquid
styles.scss.liquid
theme.css.liquid
timber.scss.liquid
At the very bottom of the file, add the following code:
.hidden { display: none; }
Click Save.
When you are ready to show your prices again, change your shop's currency to any other one, then change it back to your own currency. This reverts your settings to the default money formats for your shop's currency and shows the prices in your storefront again.