---
url: "/fr/emailify/design/figma-mcp.md"
description: "Le contrat exact de frames, composants et métadonnées que les agents doivent suivre pour créer ou modifier des emails Emailify directement dans Figma."
---

# Utiliser Emailify avec Figma MCP

> Le contrat exact de frames, composants et métadonnées que les agents doivent suivre pour créer ou modifier des emails Emailify directement dans Figma.

Cette page est le contrat de référence pour les agents qui créent ou modifient des emails Emailify directement via Figma MCP. Respectez exactement les noms et la structure pour qu’Emailify reconnaisse le résultat, tout en gardant chaque composant lié à son composant principal d’origine.

Les agents peuvent lire la [version Markdown compacte de ce contrat](/fr/emailify/design/figma-mcp.md) sans charger l’interface de la documentation qui l’entoure.

> **Note:** Ce workflow direct vers Figma fait partie d’AI Designer (BETA). Le contrat peut évoluer pendant l’amélioration de la fonctionnalité : les agents doivent donc lire cette page avant chaque workflow MCP.

## Instruction pour l’agent {#agent-instruction}

Collez ceci dans Codex, Claude Code ou un autre agent disposant d’un accès en écriture à Figma :

```text
Read and follow the current Emailify Figma MCP contract at https://docs.hypermatic.com/emailify/design/figma-mcp.md before writing to Figma. Create or edit the email using only linked Emailify component instances. Preserve protected content, component links, and existing instance overrides. For a new email, create a vertical auto-layout frame on the page or inside Figma sections named exactly "✉️ Emailify MCP: [email name]" and include at least one linked Emailify section, wrapper, hero, or code-only custom-code instance. Ordinary images and frame layers may also be direct children and export as images. Never detach Emailify instances. Create a separate sibling frame in the same page or section named exactly "✉️ Emailify MCP Metadata: [same email name]" with TEXT layers named exactly "Subject Line" and "Preheader Text", containing only their corresponding values. Replace the bracketed placeholders with the actual email name. When finished, tell me to open or refresh Emailify.
```

## Contrat du frame d’email {#email-frame-contract}

Pour chaque nouvel email, créez un frame qui respecte toutes les règles ci-dessous :

| Propriété | Valeur requise |
| --- | --- |
| Nom | `✉️ Emailify MCP: [email name]` |
| Position | Directement sur la page Figma ou dans des sections Figma ; jamais dans un frame ou un groupe ordinaire |
| Mise en page | Auto Layout vertical |
| Enfants directs | Instances liées de composants Emailify, éventuellement mêlées à des calques visuels ordinaires exportables |
| Racines Emailify autorisées | `mj-section`, `mj-wrapper` ou `mj-hero` ; instances de code personnalisé ne contenant que des calques de texte Custom Code d’Emailify |
| Contenu | Au moins une instance valide de composant Emailify |

Remplacez `[email name]` par le nom réel. Le texte qui suit `✉️ Emailify MCP:` devient le nom de l’email dans Emailify et ne doit pas être vide.

Ne détachez pas les instances Emailify et ne recréez pas leur contenu sous forme de calques bruts. Modifiez le contenu des composants via des remplacements d’instance (overrides), pour que les mises à jour du design system se propagent encore à chaque email assemblé. Les images, frames, groupes et autres calques visuels ordinaires peuvent être placés directement dans le frame d’email ; Emailify les exporte en images plutôt qu’en contenu d’email modifiable.

## Objet et texte d’aperçu (preheader) {#subject-line-and-preheader}

Créez un frame distinct, au même niveau, dans la même page ou section, pour les métadonnées de l’email. Son nom d’email doit correspondre exactement à celui du frame d’email :

| Propriété | Valeur requise |
| --- | --- |
| Nom du frame | `✉️ Emailify MCP Metadata: [same email name]` |
| Calque d’objet | Un calque TEXT nommé `Subject Line` contenant uniquement l’objet |
| Calque de preheader | Un calque TEXT nommé `Preheader Text` contenant uniquement le preheader |

Gardez ce frame de métadonnées en dehors du frame d’email. N’ajoutez ni libellés, ni préfixes, ni notes, ni texte alternatif aux valeurs de texte.

Emailify importe chaque champ indépendamment à l’ouverture ou à l’actualisation du plugin. Des métadonnées inchangées sur le canevas n’écrasent pas les modifications manuelles faites ensuite dans Emailify. Si l’agent modifie une valeur de métadonnées sur le canevas, Emailify importe ce champ modifié à l’actualisation suivante.

## Modifier un email existant {#editing-an-existing-email}

Lorsque vous mettez à jour un email qui respecte déjà ce contrat :

- Modifiez les instances liées existantes sur place chaque fois que possible.
- Gardez les composants Emailify liés lorsque vous en ajoutez ou les réordonnez. Des calques visuels ordinaires peuvent coexister avec eux et s’exportent en images.
- Conservez le nom du frame d’email et sa structure en Auto Layout vertical.
- Conservez les liens de composants et les remplacements d’instance existants, sauf si le brief demande explicitement de les modifier.
- Ne modifiez, ne masquez ni ne supprimez jamais un calque verrouillé ou un calque dont le nom commence par `🔒`.
- Conservez les liens existants, sauf si le brief fournit une URL de remplacement exacte.
- Mettez à jour le frame de métadonnées correspondant lorsque l’objet ou le preheader change.

## Adoption et validation {#adoption-and-validation}

Une fois l’agent terminé, ouvrez ou actualisez Emailify. Emailify valide le frame candidat avant d’appliquer ses métadonnées `mj-body` habituelles et d’importer l’objet et le preheader correspondants.

Emailify rejette le frame s’il est imbriqué dans un frame ou un groupe ordinaire, s’il est vide, s’il n’est pas disposé verticalement, s’il contient un calque impossible à exporter ou s’il ne contient aucun composant Emailify lié de type section, wrapper, hero ou code personnalisé seul. Ce rejet est voulu : des mises en page Figma ordinaires ne doivent jamais être converties par accident en emails Emailify.

## Dépannage {#troubleshooting}

| Problème | Vérification |
| --- | --- |
| L’email n’est pas reconnu | Vérifiez le nom exact `✉️ Emailify MCP:`, la position sur la page ou dans une section, l’Auto Layout vertical et la présence d’au moins une instance Emailify liée en enfant direct. |
| L’objet ou le preheader manque | Vérifiez que le frame de métadonnées utilise le même nom d’email et que les calques de texte sont nommés exactement `Subject Line` et `Preheader Text`. |
| Un composant n’est plus lié | Remplacez les calques détachés ou reconstruits par une instance du composant principal Emailify d’origine. |
| Un contenu légal ou fixe a changé | Verrouillez le calque ou préfixez son nom par `🔒`, puis restaurez le contenu validé dans le composant principal. |
| Une valeur saisie manuellement dans Emailify n’a pas changé | Modifiez le texte de métadonnées correspondant sur le canevas, puis actualisez de nouveau Emailify. |

Lorsque les outils d’écriture Figma ne sont pas disponibles, utilisez le workflow d’import JSON validé décrit dans [Créer des emails avec AI Designer](/fr/emailify/design/ai-designer).

Les composants de code personnalisé peuvent se placer directement entre les sections de l’email, par exemple pour ouvrir et fermer une logique conditionnelle de modèle. Le composant principal comme son instance doivent contenir uniquement un ou plusieurs calques de texte Custom Code. Les composants vides, les frames imbriqués, le texte ordinaire et le contenu visuel mixte ne sont pas admis. Gardez ces composants liés à leurs composants principaux.

Les sections Figma peuvent contenir vos frames d’email, y compris des sections imbriquées. Dans la mesure du possible, gardez chaque frame de métadonnées à côté de son email, dans la même section. Emailify privilégie les métadonnées correspondantes situées dans le même conteneur ; des métadonnées correspondantes placées ailleurs sur la page restent prises en charge. Les frames et groupes ordinaires ne sont pas des conteneurs d’email.