> For the complete documentation index, see [llms.txt](https://docs.openspaces.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.openspaces.design/plain-jane-docs-v2-fr/readme-1/advanced/setting-up-color-swatches.md).

# Configuration des échantillons de couleur

**Ce que vous apprendrez**

* Comment attribuer une catégorie de produit
* Comment appliquer des nuanciers de couleur en utilisant les métachamps de catégorie de Shopify
* Comment connecter un métachamp de couleur aux variantes de produit de votre thème

<figure><img src="/files/06368359b42ae816a523d38ab3460b58cdbe058e" alt=""><figcaption></figcaption></figure>

### 1. Ouvrez la page produit dans l'éditeur de thème

* Dans l'administration Shopify, allez à **Boutique en ligne > Thèmes**, puis cliquez **Personnaliser** sur votre thème en ligne.
* Naviguez jusqu'à une page produit.
* Cliquez sur la **Variantes produit** bloc à l'intérieur du **Section produit**.
* Sous **Style de variante**, sélectionnez **Nuanciers de couleurs**.

> 💡 Astuce : Utilisez le sélecteur d'aperçu pour charger un produit qui possède plusieurs variantes de couleur.

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

### 2. Attribuez une catégorie dans l'administration Shopify

* Aller à **Produits** dans l'administration Shopify.
* Cliquez sur le produit que vous souhaitez modifier.
* Faites défiler jusqu'à **Catégorie** section et affectez-la à une option pertinente (par ex. **Vêtements & Accessoires**).

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

### 3. Ajoutez des valeurs de couleur aux métachamps de catégorie

* Après avoir attribué une catégorie, faites défiler jusqu'à **Métachamps de catégorie**.
* Vous verrez maintenant des options spécifiques à cette catégorie (comme « Couleur »).
* Cliquez dans le **Couleur** champ et sélectionnez soit dans la liste soit choisissez **Ajouter une nouvelle entrée** pour saisir une couleur personnalisée.

<figure><img src="/files/5ec21669c839264de876205040769942c84676ee" alt=""><figcaption></figcaption></figure>

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

<figure><img src="/files/0218f93ce9923456467b4dce74c873a2b53e281b" alt=""><figcaption></figcaption></figure>

### 4. Liez le métachamp de couleur au bloc de variante

* Retournez à l'éditeur de thème et cliquez de nouveau sur le **Variantes produit** bloc.
* Localisez le **variante de couleur** et cliquez sur le **icône de source dynamique** (icône de cercles empilés).
* Sélectionnez le métachamp de couleur que vous avez ajouté dans le menu déroulant.

<figure><img src="/files/2b11c8220af502ab36654b6316b32e19f0b74236" alt=""><figcaption></figcaption></figure>

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

<figure><img src="/files/0544f8cb7dc8141eb3ef9984efb8cbf2856182ab" alt=""><figcaption></figcaption></figure>

### 5. Enregistrez vos modifications

* Cliquer sur **Terminé** puis **Enregistrer** en haut à droite de l'éditeur de thème.

***

✅ Votre produit devrait maintenant afficher des nuanciers de couleur cliquables basés sur les valeurs de métachamp que vous avez ajoutées.

> ⚠️ Avertissement : Les nuanciers de couleur n'apparaissent que si votre produit possède une **option de variante nommée « Couleur »** et qu'elle est associée au métachamp correspondant.

<figure><img src="/files/06368359b42ae816a523d38ab3460b58cdbe058e" alt=""><figcaption></figcaption></figure>

### **Besoin d’aide ?**

* 💬 **Rejoignez notre communauté sur Discord :** <https://discord.gg/hcc2GvgZc6>
* 📧 **Envoyez-nous un e-mail à :** <support@openspaces.design>
* 💻 **Discutez en direct avec nous :** Disponible du lundi au vendredi, de 10h à 18h EST, directement sur notre site web


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.openspaces.design/plain-jane-docs-v2-fr/readme-1/advanced/setting-up-color-swatches.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.