# Configure on Product & Collections Page

* On the product page, by default, the Button swatch is enabled.
* On the collections page, you need to activate the toggle to enable the swatch functionality.

<figure><img src="/files/taYYrswCIXQ4FVT5uFHa" alt=""><figcaption></figcaption></figure>

## 1. Swatch Configurations - Product & Collections

* Product - Click on default and choose a swatch style (Circular, Square, etc.)
* Collections - Click on default and choose a swatch style (Circular, Square, etc.)

<figure><img src="/files/65KQfcZ8ZU4C9kUdsFoS" alt=""><figcaption></figcaption></figure>

## [2. Select Swatch Type](/evs-easy-variation-swatches/options-configuration/types-of-swatch-configuration.md)

Select the Type - Variant Image or Custom Color, or Image (available for both Product and Collection options)

{% hint style="info" %}

* Select the [**Variant Image**](https://help.spicegems.com/evs-easy-variation-swatches/options-configuration/pages/GAm9KXZesdoNfQgxUZSj#id-1.-variant-image) option to display the default Variant image on swatches.
* Select [**Custom Color/Image**](https://help.spicegems.com/evs-easy-variation-swatches/options-configuration/pages/GAm9KXZesdoNfQgxUZSj#id-2.-custom-color-or-image) to display custom color/image on swatches.
  {% endhint %}

<figure><img src="/files/AoXyiNrMF4hzvyfne5SK" alt=""><figcaption></figcaption></figure>

## 3. Preview option

You can open the product directly from the app to check the implemented configurations.

<figure><img src="/files/0pppjk8ugLJuETGytmzT" alt=""><figcaption></figcaption></figure>

## 4. Visibility

* Product Page

<figure><img src="/files/kuLuFXtlnLoLkePTZ6Ev" alt=""><figcaption></figcaption></figure>

* Collection Page

<figure><img src="/files/6bHuwOzj7aZJD1ctxkYo" alt=""><figcaption></figcaption></figure>

To customize the Product or Collection swatches, go to [Swatch Styles](/evs-easy-variation-swatches/add-new-swatch-styles-and-configure.md) and customize the styles according to your requirements.

{% content-ref url="/pages/VbUQ2EuVQB846uVKRHT9" %}
[Swatch styles](/evs-easy-variation-swatches/add-new-swatch-styles-and-configure.md)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.spicegems.com/evs-easy-variation-swatches/options-configuration/configure-on-product-and-collections-page.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.