# Produits, coupons et panier

> Ajoutez des grilles de produits et des recommandations, des codes de réduction uniques, le panier du contact et ses données d’achat aux e-mails de campagne et d’automatisation. Alpha : réservé à l’équipe Emailit.

Une fois les produits et les commandes de votre boutique dans Emailit (consultez [Commerce](/fr/docs/commerce/)), les e-mails de campagne et d’automatisation peuvent afficher des produits, donner à chaque destinataire son propre code de réduction, lister le contenu de son panier et utiliser son historique d’achat. Toutes les balises de cette page fonctionnent dans l’objet, le HTML et la version en texte brut, et sont remplies pour chaque destinataire à la création de l’e-mail.

> **Commerce est en alpha:** Commerce est réservé à l’équipe Emailit pendant que nous le testons. Consultez [Qui peut utiliser Commerce](/fr/docs/commerce/#who-can-use-commerce).

## Ajouter un bloc dans l’éditeur

À l’étape **Content** de l’assistant de campagne, sélectionnez **Products & coupons**. Choisissez des produits, un coupon, le panier ou des données client, ajustez les options, sélectionnez **Copy** et collez la balise dans votre contenu. Dans l’éditeur de texte enrichi et dans Dragit, le menu des variables liste aussi des balises Commerce prêtes à l’emploi.

La suite de cette page décrit les balises elles-mêmes, pour l’éditeur HTML, l’API et les modèles d’automatisation.

## Grilles de produits

`{{products}}` insère une grille de fiches produit avec une image, le titre, le prix (avec l’ancien prix barré quand le produit est en promotion) et un bouton :

```handlebars
{{products source="best_sellers" limit="3"}}
{{products source="recently_viewed" limit="4" fallback="best_sellers" button="View"}}
{{products "on_sale"}}
```

Un premier mot entre guillemets est une forme courte de `source`.

| Attribut | Par défaut | Signification |
| --- | --- | --- |
| `source` | `best_sellers` | La provenance des produits, voir ci-dessous. |
| `limit` | `4` | Le nombre de produits, 12 au maximum. |
| `category` | | Avec `source="category"`, la catégorie. Avec `best_sellers` ou `newest`, limite les produits à cette catégorie. |
| `ids` | | Avec `source="ids"`, vos ID de produit séparés par des virgules, dans l’ordre d’affichage. |
| `days` | `30` | Période prise en compte pour `best_sellers` et `recently_viewed`, 365 au maximum. |
| `fallback` | | Une source valable pour tout l’espace de travail, utilisée quand une source personnelle ne trouve rien pour un destinataire. |
| `columns` | 3, ou moins s’il y a moins de produits | Fiches par ligne, de 1 à 4. |
| `button` | `Shop now` | Texte du bouton. `button=""` masque le bouton. |
| `button_color` | `#111111` | Couleur du bouton en code hexadécimal. |
| `show_price` | `true` | `false` masque les prix. |
| `show_description` | `false` | `true` ajoute la description du produit. |

Les flux ignorent les produits archivés et ceux dont le stock est à 0, sauf `last_order`.

### Sources

| Source | Identique pour tous | Produits |
| --- | --- | --- |
| `best_sellers` | Oui | Les produits les plus vendus en unités sur les `days` derniers jours. Complétés par les produits les plus récents quand les ventes ne suffisent pas. |
| `newest` | Oui | Les produits ajoutés le plus récemment à votre catalogue. |
| `on_sale` | Oui | Les produits dont le prix avant réduction est supérieur au prix. |
| `category` | Oui | Les meilleures ventes d’une `category`, puis ses produits les plus récents. |
| `ids` | Oui | Les produits que vous listez dans `ids`. |
| `recently_viewed` | Non | Les produits que le destinataire a consultés sur votre site sur les `days` derniers jours, du plus récent au plus ancien. Nécessite le [script de suivi](/fr/docs/commerce/connect-your-shop/#the-tracking-script). |
| `recommended` | Non | Les meilleures ventes des catégories que le destinataire a consultées ou achetées, sans ce qu’il a déjà acheté. À défaut, les meilleures ventes. |
| `bought_together` | Non | Les produits souvent achetés avec ce que le destinataire a acheté. |
| `last_order` | Non | Les articles de la commande la plus récente du destinataire. |

### Votre propre mise en page

Pour concevoir vous-même les fiches, parcourez un flux avec `{{#each}}`. Dans la boucle, utilisez les champs du produit :

```handlebars
{{#each products.recommended limit="3" fallback="best_sellers"}}
  <a href="{{url}}"><img src="{{image_url}}" alt="{{title}}" width="180"></a>
  <p>{{title}}: {{price_formatted}}{{#if on_sale}} <s>{{compare_at_price_formatted}}</s>{{/if}}</p>
{{/each}}
```

| Champ | Valeur |
| --- | --- |
| `id`, `sku` | Votre ID de produit et votre SKU. |
| `title`, `description`, `brand` | Les textes du produit. |
| `url`, `image_url` | Les liens vers la page du produit et vers l’image. |
| `price`, `price_formatted` | Le prix sous forme de nombre et formaté avec sa devise, par exemple `€139.00`. |
| `compare_at_price`, `compare_at_price_formatted` | L’ancien prix. |
| `on_sale` | `true` quand le prix avant réduction est supérieur au prix. |
| `currency`, `categories` | Le code de devise et la liste des catégories. |
| `index`, `number` | La position dans la boucle, à partir de 0 et à partir de 1. |

Utilisez `{{#if products.recently_viewed}}...{{/if}}` pour n’afficher une section que si un destinataire a des produits dans un flux. Les données produit sont échappées en HTML : un titre de produit ne peut donc pas casser votre e-mail.

## Codes de réduction

`{{coupon "key"}}` insère un code du [coupon](/fr/docs/commerce/coupons/) qui porte cette clé :

```handlebars
<p>Here's 10% off your next order: <strong>{{coupon "welcome10"}}</strong></p>
```

- Un coupon de type **Unique codes** donne à chaque destinataire son propre code, tiré de sa réserve. Un destinataire garde le même code dans tous les e-mails d’une même campagne ou automatisation, y compris la version web.
- Un coupon de type **One code for everyone** insère son code pour tout le monde.
- Quand la réserve d’un coupon à codes uniques est vide ou que le coupon a expiré, les destinataires reçoivent son code de secours, ou rien s’il n’en a pas.
- Les aperçus et les envois de test affichent un code d’exemple comme `WELCOME10-PREVIEW` et ne consomment pas de codes.
- Une clé inconnue n’affiche rien.

`{{coupon.welcome10}}` est le même code sous forme de variable, par exemple dans `{{#if coupon.welcome10}}`.

## Le panier

`{{cart}}` insère le panier ouvert du destinataire : chaque article avec son image, sa quantité et son prix, le total et un bouton **Return to your cart** qui renvoie vers l’URL de paiement du panier. Définissez `button` et `button_color` comme pour les grilles de produits. Quand le destinataire n’a pas de panier ouvert, la balise n’affiche rien.

Pour votre propre mise en page, utilisez les variables du panier :

```handlebars
{{#if cart}}
  <p>You left {{cart.item_count}} items ({{cart.total_formatted}}) in your cart.</p>
  {{#each cart.items}}<p>{{quantity}} × {{title}}: {{line_total_formatted}}</p>{{/each}}
  <a href="{{cart.checkout_url}}">Complete your order</a>
{{/if}}
```

`cart` contient `id`, `total`, `total_formatted`, `currency`, `checkout_url`, `item_count` et `items`. Chaque article a les champs de produit ci-dessus, plus `quantity`, `line_total` et `line_total_formatted`. Le panier est le panier actif ou abandonné le plus récent du contact : dans une [automatisation de panier abandonné](/fr/docs/automations/recipes/#abandoned-cart-reminder), c’est donc le panier qui a été abandonné.

## Données client

| Balise | Valeur |
| --- | --- |
| `{{customer.orders_count}}` | Nombre de commandes. |
| `{{customer.total_spent}}`, `{{customer.total_spent_formatted}}` | Montant total dépensé, sous forme de nombre et formaté. |
| `{{customer.average_order_value}}`, `{{customer.average_order_value_formatted}}` | Valeur moyenne des commandes. |
| `{{customer.first_order_at}}`, `{{customer.last_order_at}}` | Dates de la première et de la dernière commande, au format `YYYY-MM-DD`. |
| `{{customer.expected_next_order_at}}` | La date prévue de la prochaine commande, à partir de la deuxième commande. |
| `{{customer.churn_risk}}` | `low`, `medium` ou `high`, ou vide sans commande. |
| `{{customer.is_customer}}` | `true` quand le contact a déjà commandé. |

```handlebars
{{#if customer.is_customer}}Thanks for being a customer since {{customer.first_order_at}}.{{else}}Your first order ships free.{{/if}}
```

## Version web

`{{webview_url}}` renvoie vers une version web de l’e-mail, rendue pour ce destinataire avec les mêmes produits, le même panier et le même code de réduction. Utilisez-la pour un lien « Voir dans le navigateur ».

## Voir aussi

  - [Commerce](/fr/docs/commerce/): Connectez votre boutique et mesurez le chiffre d’affaires généré par vos e-mails.
  - [Temple](/fr/docs/templates/temple/): Variables, valeurs de repli et conditions.

---
Source: https://emailit.com/fr/docs/campaigns/products-and-coupons/