Settings reference
The plugin’s settings are at C4D Swatches. You need a user who can manage WooCommerce (a shop manager or administrator). Version 2.0.0 and later don’t need C4D Plugin Manager or Redux Framework.
The settings are grouped in seven tabs: General, Shop page, Product page, Gallery & zoom, Colours, Compatibility and Custom CSS. Each tab has its own Save Changes button and saves only its own fields, so saving one tab never changes another.
Settings with a Yes/No choice are drop-down menus. The defaults below are what you get on a fresh install.
General
| Setting | What it does | Default |
|---|---|---|
| Colour attribute name | The name of your colour attribute, for example color, without the pa_ prefix. The Colours tab lists the options of this attribute. |
color |
Shop page
Swatches under products in the shop, category pages and related products. See Swatches on the shop page.
| Setting | What it does | Default |
|---|---|---|
| Show swatches on shop pages | Turns the shop page swatches on or off. | Yes |
| Flip thumbnail | Shows the product’s second gallery photo when a customer hovers over it. | Yes |
| Swatch alignment | Left, Center or Right. | Left |
| Show image instead of colour | For colour attributes, shows the option’s first photo instead of a colour dot. | Yes |
| Show “View more” link | Collapses swatches beyond the number below into a link to the product. | No |
| Swatches before “View more” | How many swatches show before the link. | 5 |
| “View more” text | The link text. | View More |
| Tooltip on mobile | Shows the option name tooltip on screens narrower than 1024 px. | No |
Product page
Swatches and the variation gallery on the single product page. See A photo gallery for each colour.
| Setting | What it does | Default |
|---|---|---|
| Use the plugin gallery | Uses the plugin’s own gallery instead of the theme’s. | No |
| Variation gallery | Shows the gallery of the picked option when the variation changes. | Yes |
| Main gallery selector | CSS selector of the theme gallery that the plugin gallery replaces. | .woocommerce-product-gallery |
| Sort alphabetically | Sorts the options of an attribute alphabetically. | No |
| Render position | Shows the swatches Before or After the theme’s default attribute drop-downs. | Before |
| Out of stock options | Show or Hide sold-out options. Shown options get an “Out Of Stock” label. | Show |
| Hide clear button | Hides the “Clear” link that resets the selection. | No |
| Small screens | Keeps the Plugin swatches on small screens, or goes back to the Theme select box. | Plugin swatches |
| Image popup on hover | Shows a larger photo when a customer hovers over a swatch. | No |
| Variation image in cart | Shows the option’s photo in the cart. | No |
| Product item selector | Selector of the product wrapper in related-product lists, where swatches are inserted. | li.product |
Gallery & zoom
The plugin gallery’s thumbnails and zoom, and the swatch shape.
| Setting | What it does | Default |
|---|---|---|
| Hide gallery arrows | Hides the left and right arrows on the main photo. | No |
| Thumbnail navigation | Shows thumbnails as a Slider or a Grid. | Slider |
| Show thumbnail navigation | Shows the row of thumbnails. | Yes |
| Hide thumbnail arrows | Hides the arrows on the thumbnails. | No |
| Navigation direction | Horizontal or Vertical. | Horizontal |
| Thumbnails shown at once | How many thumbnails are visible at the same time: 1 to 6. | 3 |
| Load the WooCommerce zoom library | Turn on if your theme doesn’t load WooCommerce’s zoom script. | No |
| Zoom button text | The text of the zoom button. | + |
| Zoom and pan | Opens the image full screen with a pan and zoom effect. | No |
| Zoom outside the box | Shows the zoomed image in a box outside the gallery. | No |
| Swatch shape | Circle or Rectangle, for colour and image swatches on the product page. | Circle |
Colours
One colour picker for each option of your colour attribute, saved per option. Leave a field empty to use no set colour. See Setting colours for colour swatches.
If the tab says no colour attribute with terms was found, create the attribute under Products › Attributes, add its options, and set its name in Colour attribute name on the General tab if it isn’t color.
Compatibility
For themes and plugins that load products or scripts in their own way. See Troubleshooting.
| Setting | What it does | Default |
|---|---|---|
| Run after Ajax requests | Runs the swatches again after Ajax product loading, such as filters and infinite scroll. | Yes |
| Ajax URL pattern | Requests whose URL contains this text trigger the re-run. | admin-ajax.php |
| Load Slick | Loads the Slick slider. Turn it off if your theme already loads Slick. | Yes |
Custom CSS
A text box for your own CSS. It’s printed on every front-end page, after the theme’s styles. Only users who can edit unfiltered HTML (administrators on a normal site) can change it. Others see the saved CSS read-only. See Style swatches with CSS.
Per product: the Variation Swatches tab
Two settings are not on this page but in the product editor, under Product data › Variation Swatches:
- Custom Attribute Setting: the swatch type for attributes you typed into a single product. See Choosing a swatch type.
- Multi Orders Settings: lets customers buy several values of one attribute at once. See Multi Orders.