---
url: "/fr/copydoc/sync/variants.md"
description: "Avec Sync Content de CopyDoc, changez automatiquement les variantes Figma des calques de composant nommés en synchronisant votre tableur."
---

# Synchroniser des variantes de composants depuis le tableur

> Avec Sync Content de CopyDoc, changez automatiquement les variantes Figma des calques de composant nommés en synchronisant votre tableur.

### Tutoriel vidéo : synchroniser des variantes de composants dans Figma à l’aide d’un tableur

Cette vidéo montre comment synchroniser des variantes de composants dans Figma à l’aide d’un tableur et du plugin CopyDoc.
[Embedded media](https://www.youtube-nocookie.com/embed/pytew54ZZ_g)

## Étape 1 : configurer les variantes de votre calque de composant dans Figma {#step-1-setting-up-your-component-layer-variants-in-figma}

[Video](/assets/videos/copydoc/sync/create-variants.mp4)

Avant de synchroniser votre tableur pour changer de variantes de composant, vous devez d’abord configurer dans Figma un ensemble de composants avec des variantes, en suivant les quelques étapes ci-dessous (illustrées dans la vidéo ci-dessus).

1. Créez un nouveau calque de composant Figma et donnez-lui le même nom que l’en-tête de votre tableur (par exemple **#Tag**)
2. Faites un clic droit sur le calque de composant Figma, survolez **Main component** et cliquez sur **Add variant** pour [créer un nouvel ensemble de composants Figma](https://help.figma.com/hc/en-us/articles/360056440594-Create-and-use-variants).
3. Ajoutez autant de variantes que nécessaire en **cliquant sur le bouton + (icône)** en bas du calque de l’ensemble de composants Figma (lorsqu’il est sélectionné), puis modifiez le style de chaque nouvelle variante (par exemple en changeant les arrière-plans ou les couleurs).
4. Une fois vos variantes de composant créées, vous pouvez **personnaliser le nom des propriétés et des variantes** en renommant les noms par défaut de Figma pour les identifier et les utiliser plus facilement dans votre tableur (par exemple, renommer « Property 1 » en « Genre » et « Variant 1 » en « Synthwave »).
5. Ouvrez le panneau **Assets** de Figma, puis faites glisser votre nouveau composant Figma (par exemple #Tag) dans votre fichier Figma et placez-le dans le ou les frames Figma que vous souhaitez synchroniser depuis un tableur.
6. Suivez les **instructions de l’étape 2 ci-dessous** pour changer automatiquement l’option de _variante_ de votre composant en synchronisant les lignes d’un tableur avec vos frames Figma.

## Étape 2 : changer de variantes en synchronisant votre tableur {#step-2-swapping-out-variants-by-syncing-your-spreadsheet}

[Video](/assets/videos/copydoc/sync/sync-variants.mp4)

Comme pour la synchronisation de texte classique, pour changer de variantes depuis un tableur, vous devez d’abord ajouter le nom de votre calque de composant (par exemple **Tag**) comme nouvelle valeur de _colonne d’en-tête_ dans la première ligne de votre tableur.

Ensuite, copiez-collez le nom de la propriété et de la variante, visible lorsque vous double-cliquez sur votre calque de variante Figma dans la barre latérale : il contient un signe égal **=** (par exemple **Genre=Synthwave**) qui sépare le nom de la propriété et celui de la variante. Collez-le dans les lignes suivantes de la même colonne du tableur, comme dans l’exemple ci-dessous (et dans la vidéo ci-dessus).

|**#Tag** |
|-------|
|Genre=Synthwave|
|Genre=Outrun|
|Genre=Vaporwave|
|Genre=Darksynth|

Lorsque vous synchronisez le tableur avec Figma, la valeur de _variante_ de tous les calques de composant Figma portant le nom correspondant (par exemple **#Tag**) est automatiquement changée selon la valeur de variante indiquée dans les lignes de votre tableur.

> **Tip:** Vous pouvez toujours synchroniser normalement du texte ou des images pour d’autres calques dans le même tableur, en créant aussi des colonnes supplémentaires pour ceux-ci.
