General

Tooltips and custom CSS — the settings that apply everywhere.

Settings → General holds the two storewide options. A live Preview on the right shows the effect, with an Image / Color toggle to preview either kind of swatch.

The Preview panel on the right shows the effect of every setting as you change it.

Show Tooltip on Hover

Displays the option name — "Red", "Large" — when a shopper hovers over a swatch. It's one switch for the whole store: product pages and collection pages follow the same setting.

Only some styles show the tooltip:

• Shown on: Color or custom image swatch, Variant image swatch, Button, Button without border and Pill button.

• Not shown on: Pill swatch, the three price styles (Variant image swatch with price, Color or custom swatch with price, Button with price) and the three dropdowns (Dropdown, Color or custom swatch dropdown, Variant image dropdown).

It's most useful on colour and image swatches, where the chip alone doesn't say what the value is called. On the button styles it repeats the label that's already on the button.

On collection pages, tooltips are hidden while swatches are in carousel mode — see Carousel in Customize a swatch style. Product groups have their own switch, Show Tooltip for Product Group, in Product groups settings.

Enable Custom CSS

Turn this on to reveal a CSS editor for changes the Appearance settings can't make — see Custom CSS.

Save

Click Save at the top of the page. A Settings saved message confirms it.

Related pages

• Swatch on product page

• Swatch on collection page

• Custom CSS