Référence des blocs de contenu d'e-mail

Référence pour chaque bloc que vous pouvez ajouter sur le canevas de l’éditeur glisser-déposer, et pour les types de liens disponibles sur les boutons et le texte. Pour contrôler quels destinataires voient un bloc, définissez une condition d’affichage.

Ajouter des blocs de contenu

Ouvrez l’onglet Blocs et faites glisser un bloc sur le canevas, ou cliquez sur un bloc pour l’ajouter à la fin de l’e-mail. Blocs disponibles :

En-tête : titres et courtes accroches dans l’e-mail
Texte : corps du texte et descriptions plus longues
Bouton : un appel à l’action cliquable
Image : images de la Médiathèque, téléchargement ou URL
Vidéo : une affiche vidéo cliquable qui renvoie vers une vidéo YouTube ou Vimeo
Carte : une image associée à un en-tête, un texte et un bouton dans une seule mise en page
Séparateur : une ligne qui sépare visuellement les sections
2 colonnes : deux colonnes égales côte à côte
3 colonnes : trois colonnes égales côte à côte
4 colonnes : quatre colonnes égales côte à côte
33 / 67 : deux colonnes où la gauche occupe environ 33 % de la largeur et la droite environ 67 %
67 / 33 : deux colonnes où la gauche occupe environ 67 % de la largeur et la droite environ 33 %
Minuteur : un compte à rebours pour les offres et les dates limites
Code-barres : un code 128, EAN-13, EAN-8, UPC-A ou QR code scannable généré à partir d’une valeur de personnalisation, comme un bon de réduction
Menu : une rangée ou une colonne de liens, comme la navigation ou les contacts
Réseaux sociaux : des icônes qui renvoient vers vos profils sociaux
HTML : du HTML personnalisé, comme un formulaire, un sondage ou une vidéo intégrée
Produits : une grille répétitive de fiches produits. Saisissez les produits manuellement ou extrayez-les de votre catalogue de produits, du panier abandonné d’un destinataire ou d’une stratégie de recommandation intégrée comme les meilleures ventes ou les produits de retour en stock.
Actualités : une grille répétitive de fiches d’articles. Choisissez-les manuellement à partir d’un flux RSS ou Atom, ou extrayez-les en direct d’un flux enregistré pour votre application.
Emplacement publicitaire : un emplacement payant qui affiche une campagne sponsorisée aux destinataires

En-tête et texte

Les blocs En-tête et Texte contiennent le contenu que les destinataires lisent dans l’e-mail. Utilisez En-tête pour les titres et les lignes courtes, Texte pour le corps du texte et les descriptions plus longues.

Cliquez sur un bloc sur le canevas pour commencer à le modifier. Sélectionnez du texte pour faire apparaître la barre d’outils de mise en forme.

Bloc En-tête sélectionné sur le canevas avec la barre d'outils de mise en forme du texte affichant les options de style et de formatage

Options de la barre d’outils

Style de texte : définir un style de paragraphe (Titre 1, Titre 2, Normal, etc.) pour l’ensemble du bloc
Taille de la police : redimensionner le texte sélectionné, ou appliquer une taille à l’ensemble du paragraphe
Gras / Italique / Souligné / Barré : mise en forme de caractères standard
Alignement : gauche, centré ou droit
Lien : envelopper le texte sélectionné dans un lien hypertexte
Liste à puces / Liste numérotée : transformer les lignes sélectionnées en une liste. Toute puce ou numéro avec lequel les lignes commencent déjà est supprimé, afin qu’il ne soit pas doublé avec le marqueur de la liste.

Sélectionnez le bloc (pas une plage de texte) pour ouvrir ses paramètres dans le panneau de droite, puis activez Espacement des lettres pour augmenter ou réduire l’espacement des caractères pour l’ensemble du bloc. Accepte les valeurs fractionnaires et négatives. Pour appliquer l’espacement des lettres à tous les blocs de texte en une seule fois, définissez-le comme une valeur par défaut pour l’ensemble de l’e-mail sous Typographie. Voir Configurer le style de l’e-mail.

Coller depuis d’autres documents

Coller du texte depuis Google Docs, Word ou une page web conserve le gras, l’italique, le souligné, le barré et les liens. La couleur, la taille de la police et la famille de police de la source ne sont pas conservées — la typographie propre au bloc l’emporte toujours. Pour ignorer complètement la mise en forme de la source et adopter le style du bloc, collez avec Ctrl+Shift+V (Cmd+Shift+V sur Mac).

Une liste à puces ou numérotée collée conserve sa puce ou son numéro sous forme de texte brut au début de chaque ligne, dans le même bloc. Sélectionnez ces lignes et cliquez sur Liste à puces / Liste numérotée pour les transformer en une véritable liste — le bouton supprime le marqueur restant pour vous.

Dans les champs d’une seule ligne, comme le libellé d’un Bouton, les sauts de ligne collés sont réduits en un seul espace.

Personnalisation avec les Merge Tags

Les Merge Tags sont des espaces réservés qui insèrent une valeur de Tag à partir du profil du destinataire, afin que chaque abonné voie un contenu personnalisé. Pour en ajouter un, sélectionnez le texte, cliquez sur Merge Tags dans la barre d’outils et choisissez un Tag de votre compte. Cliquez sur un Merge Tag inséré pour ouvrir un panneau avec les champs Défaut (la valeur affichée lorsque le tag est vide) et Format (capitalisation, nombre ou formatage de date à appliquer à la valeur).

Image

Un bloc Image affiche une image dans l’e-mail. Sélectionnez-le sur le canevas pour ouvrir les paramètres de l’Image dans le panneau de droite.

Ajout d’une image

Cliquez sur Ajouter une image lorsque le bloc est vide, ou sur Remplacer l’image lorsqu’une image est déjà définie. Cela ouvre la Galerie de médias avec trois onglets :

Bibliothèque : vos fichiers téléchargés, consultables par nom de fichier.
Photos de stock : recherchez des photos gratuites de Pexels sans quitter l’éditeur. Cliquez sur une photo pour la copier dans votre bibliothèque et l’insérer.
Générer avec l’IA : décrivez l’image que vous souhaitez et choisissez un format d’image. L’image générée est enregistrée dans votre bibliothèque.

Galerie de médias avec les onglets Bibliothèque, Photos de stock et Générer avec l'IA, et un champ de recherche par nom de fichier

Vous pouvez également coller un lien hébergé directement dans URL de l’image pour ignorer la galerie.

Suppression d’images de la Bibliothèque

Supprimez des images sans quitter l’éditeur : survolez un fichier et cliquez sur Supprimer, ou sélectionnez-en plusieurs et cliquez sur Supprimer la sélection, puis confirmez dans la boîte de dialogue.

Texte alternatif

Décrivez l’image dans Texte alternatif pour l’accessibilité, ou cliquez sur Générer un texte alternatif avec l’IA pour que l’IA l’écrive à partir de l’image dans votre langue d’édition actuelle. Les images ajoutées depuis les photos de stock ou générées avec l’IA obtiennent automatiquement un texte alternatif.

Taille et ajustement

Largeur : définissez la largeur de l’image en px, ou en pourcentage de l’espace disponible pour qu’elle reste fluide. Laissez la valeur par défaut pour utiliser la largeur naturelle de l’image.
Hauteur (px) : définissez une hauteur de rendu fixe. Laissez vide pour une mise à l’échelle automatique — à partir du ratio de recadrage s’il en est défini un, sinon à partir des proportions naturelles de l’image.
Recadrage : choisissez Original pour conserver les proportions naturelles de l’image, ou un ratio (Carré (1:1), 4:3, 3:2, 16:9) pour recadrer l’image dans cette boîte.
Ajustement : choisissez Couvrir pour remplir la boîte et recadrer l’image. Définissez le point de recadrage avec Point focal. Ou choisissez Contenir pour mettre à l’échelle toute l’image à l’intérieur de la boîte sans recadrage. Positionnez-la avec Définir la position.
Rayon d’angle (px) : arrondissez les coins de l’image. Activez Plus d’options pour définir chaque coin séparément, ou laissez désactivé pour appliquer le même rayon aux quatre.

Passez le canevas en mode Mobile (voir Modifier la vue mobile) pour définir l’un de ces paramètres séparément pour les écrans de téléphone. Cochez Largeur (mobile), Hauteur (mobile), Recadrage (mobile) ou Ajustement (mobile) pour remplacer ce paramètre, en partant de sa valeur de bureau ; laissez une case décochée pour continuer à hériter du paramètre de bureau. Recadrage (mobile) n’apparaît que lorsque Recadrage est défini sur un ratio sur le bureau, et le retour de Recadrage à Original sur le bureau annule toute substitution de Recadrage (mobile).

Paramètres de taille et d'ajustement pour un bloc Image en vue mobile, montrant les cases à cocher de substitution mobile pour Largeur, Hauteur, Recadrage et Ajustement, toutes réglées pour hériter de la valeur de bureau

Liens et espacement

Pour ouvrir un lien lorsque l’image est cliquée, saisissez-le dans URL du lien et définissez Cible du lien pour l’ouvrir dans le même onglet ou un nouvel onglet. Voir Ajouter des liens pour les types de liens disponibles.

Dans Espacement, activez Marge intérieure pour ajouter de l’espace autour de l’image. Utilisez Tous les côtés pour une marge intérieure uniforme, ou activez Plus d’options pour définir chaque côté séparément.

Panneau des paramètres de l'image avec Remplacer l'image, URL de l'image, Texte alternatif, URL du lien, Cible du lien et Marge intérieure

Vidéo

Un bloc Vidéo ajoute une vidéo YouTube ou Vimeo à l’e-mail sous forme de vignette cliquable. Les clients de messagerie ne peuvent pas lire de vidéo à l’intérieur du message, donc le bloc affiche une image fixe avec une superposition ▶. Lorsque le destinataire la touche, la vidéo s’ouvre sur YouTube ou Vimeo. Cela fonctionne dans tous les principaux clients, y compris Outlook.

Sélectionnez le bloc Vidéo sur le canevas pour ouvrir ses paramètres dans le panneau de droite.

URL de la vidéo : collez un lien YouTube ou Vimeo. L’éditeur récupère automatiquement une vignette.
Texte alternatif : décrivez la vidéo pour l’accessibilité.
URL de la vignette : conservez la vignette récupérée automatiquement, ou cliquez sur Ajouter une vignette / Remplacer la vignette pour en choisir une dans la Galerie de médias, ou collez directement un lien hébergé.
Superposition du bouton de lecture : activée par défaut. Désactivez pour afficher la vignette simple sans la superposition ▶. La superposition n’est pas disponible pour les vignettes sur certains hébergeurs externes. L’éditeur vous avertit lorsque c’est le cas, et l’e-mail affiche alors la vignette simple.
Largeur (px), Rayon d’angle (px) et Alignement : contrôlez l’apparence de la vignette et sa position dans la mise en page. Vous pouvez définir l’alignement séparément pour le mobile.

Paramètres du bloc Vidéo avec URL de la vidéo, Texte alternatif, URL de la vignette, Superposition du bouton de lecture, Largeur, Rayon d'angle et Alignement

Carte

Un bloc Carte associe une image à un en-tête, un texte et un bouton dans une seule mise en page prête à l’emploi. Sélectionnez-le sur le canevas pour ouvrir ses paramètres dans le panneau de droite.

Mise en page : choisissez de quel côté l’image se trouve par rapport au contenu.
Image : remplacez l’image, définissez un texte alternatif ou modifiez le prompt pour une image que vous avez créée avec Générer avec l’IA.
Taille et ajustement : les champs de taille dépendent de la Mise en page. Recadrage est disponible pour toutes les mises en page. Ajustement s’applique à chaque mise en page :
- Haut : Hauteur définit la hauteur de l’image en px ou en pourcentage de la largeur de la carte. Largeur (px) réduit l’image à une largeur fixe en pixels et la centre.
- Arrière-plan : Hauteur définit la hauteur de la carte en px ou en pourcentage de sa largeur. Il n’y a pas de champ Largeur (px). L’image est l’arrière-plan de la carte. Ajustement fonctionne également ici : Couvrir recadre l’image sur la carte — définissez le point de recadrage avec Point focal — et Contenir met à l’échelle toute l’image à l’intérieur, placée avec Définir la position. Outlook Desktop approxime Contenir et ignore les deux.
- Gauche ou Droite : Largeur définit la largeur de la colonne de l’image en px ou en pourcentage de la carte. Hauteur (px) fixe l’image à une hauteur en pixels. Définir une hauteur en pixels efface le ratio de recadrage ci-dessous. Choisir un ratio de recadrage efface la hauteur en pixels. Vous ne pouvez pas utiliser les deux en même temps.
- Pour toutes les mises en page :
  - Recadrage : choisissez Original pour conserver les proportions naturelles de l’image, ou un ratio (Carré (1:1), 4:3, 3:2, 16:9) pour recadrer l’image dans cette boîte.
  - Ajustement : choisissez Couvrir pour remplir la boîte et recadrer l’image. Définissez le point de recadrage avec Point focal. Ou choisissez Contenir pour mettre à l’échelle toute l’image à l’intérieur de la boîte sans recadrage. Positionnez-la avec Définir la position.
  - Rayon d’angle (px) : arrondissez les coins de l’image. Activez Plus d’options pour définir chaque coin séparément, ou laissez désactivé pour appliquer le même rayon aux quatre. Gmail et Apple Mail le rendent ; Outlook Desktop l’ignore, comme pour le bloc Image.
Espacement : définissez la marge intérieure autour du contenu de la carte.

Bouton

Un Bouton est un appel à l’action cliquable dans l’e-mail.

Cliquez sur un bloc Bouton pour modifier son libellé sur le canevas. Utilisez la barre d’outils pour changer la taille de la police, la couleur du texte, le gras, l’italique, le souligné, le barré et l’alignement. Le libellé est sur une seule ligne : les sauts de ligne collés sont réduits en un espace. Voir Coller depuis d’autres documents pour ce qu’un collage conserve et supprime.

Pour définir ce qui se passe lorsque le destinataire clique sur le bouton :

Cliquez sur l’icône de lien dans la barre d’outils pour ouvrir Insérer/Modifier un lien.
Ou utilisez Type d’action et URL dans la section Lien du panneau de droite.

Bloc Bouton sur le canevas avec une barre d'outils de mise en forme et les paramètres de lien dans le panneau de droite

Voir Ajouter des liens pour les types d’action disponibles.

Dans le panneau de droite, sous Styles :

Alignement : gauche, centré ou droit.
Arrière-plan : activez pour remplacer l’apparence par défaut, puis choisissez Uni pour une couleur unie ou Dégradé pour un dégradé linéaire à deux arrêts (une couleur de départ, une couleur de fin et un angle en degrés, par défaut 90°). Avec Dégradé sélectionné, le bouton affiche toujours un remplissage uni dans les clients de messagerie qui ne prennent pas en charge les arrière-plans en dégradé, comme Outlook sur Windows. Les boutons qui avaient déjà un arrière-plan uni le conservent et s’ouvrent avec Uni sélectionné.
Couleur du texte, Taille de la police et Famille de police : activez chaque option pour remplacer l’apparence par défaut.
Rayon d’angle, Couleur de la bordure et Largeur de la bordure : forme et contour du bouton. Gmail et Apple Mail rendent le rayon d’angle du bouton ; Outlook Desktop l’ignore et affiche des coins carrés, comme il le fait pour les images.
Largeur : définissez une largeur de bouton fixe ou laissez-la automatique.
Marge intérieure : ajoutez de l’espace à l’intérieur du bouton. Utilisez Tous les côtés pour une marge intérieure uniforme, ou activez Plus d’options pour définir chaque côté séparément.

Paramètres des styles de bouton dans le panneau de droite avec Alignement, Arrière-plan, Couleur du texte, Taille de la police, Rayon d'angle et Marge intérieure

Séparateur

Un Séparateur est une ligne horizontale entre les blocs de contenu. Utilisez-le pour séparer visuellement les sections de l’e-mail.

Configurez le style de ligne (Uni, Tirets, Points), la couleur, l’épaisseur et la largeur dans le panneau des paramètres.

Paramètres du bloc Séparateur avec les options de style de ligne, couleur, épaisseur et largeur dans le panneau de droite

HTML

Le bloc HTML vous permet de coller du HTML personnalisé dans votre e-mail. Utilisez-le pour un formulaire personnalisé, un sondage ou une vidéo intégrée.

Au-dessus du champ de code, cliquez sur Merge tag pour rechercher les Tags de votre compte et insérer un Merge Tag à la position du curseur — la même fonctionnalité de personnalisation décrite ci-dessus — ou cliquez sur l’icône emoji pour insérer un emoji de la même manière. Cliquez sur un Merge Tag inséré pour ouvrir le même panneau Défaut / Format que dans un bloc En-tête ou Texte.

Exemples

Ce formulaire de prospect collecte une adresse e-mail pour envoyer un code promo pour les soldes du Nouvel An.

Formulaire de prospect HTML dans l'éditeur d'e-mail avec un champ e-mail et un bouton Obtenir mon code

Code HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; }
  h2 { font-size: 18px; margin-bottom: 8px; color: #222; }
  p { font-size: 14px; color: #666; margin-bottom: 20px; }
  input {
    width: 100%;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    box-sizing: border-box;
  }
  button {
    width: 100%;
    padding: 14px;
    background: #CC0000;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
  }
</style>
</head>
<body>

<h2>Get your New Year Sale code</h2>
<p>Enter your email and we'll send you an exclusive promo code for up to 50% off.</p>

<div id="form">
  <input type="email" placeholder="Your email address" />
  <button type="button">Get my code</button>
</div>

</body>
</html>

Ce sondage demande pour quelle catégorie le destinataire fait ses achats et lie chaque option à la page de soldes correspondante.

Sondage HTML dans l'éditeur d'e-mail demandant ce que l'utilisateur recherche avec quatre options de catégorie

Code HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; text-align: center; }
  h2 { font-size: 18px; margin-bottom: 6px; color: #222; }
  p { font-size: 13px; color: #888; margin-bottom: 20px; }
  .option {
    display: block;
    width: 100%;
    padding: 14px;
    margin-bottom: 10px;
    background: #f5f5f5;
    border: 2px solid transparent;
    border-radius: 10px;
    font-size: 15px;
    cursor: pointer;
    box-sizing: border-box;
    text-decoration: none;
    color: #222;
  }
  .option:hover { border-color: #CC0000; background: #fff5f5; }
</style>
</head>
<body>

<h2>What are you shopping for?</h2>
<p>Pick a category and go straight to your deals</p>

<a class="option" href="https://example.com/sale/clothing">👗 Clothing</a>
<a class="option" href="https://example.com/sale/electronics">📱 Electronics</a>
<a class="option" href="https://example.com/sale/beauty">💄 Beauty</a>
<a class="option" href="https://example.com/sale/home">🏠 Home & Living</a>

</body>
</html>

Cet exemple intègre une vidéo promotionnelle des soldes du Nouvel An dans l’e-mail.

Code HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 20px;
    text-align: center;
  }
  .video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
  }
  .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
</style>
</head>
<body>

<h1>New Year Sale — Up to 50% Off</h1>

<div class="video-container">
  <iframe src="https://www.youtube.com/embed/YOUR_VIDEO_ID"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen></iframe>
</div>

</body>
</html>

Vous pouvez également ajouter un lien de désabonnement directement dans le bloc HTML :

<a href=%%PW_EMAIL_UNSUBSCRIBE%%>Se désabonner</a>

L’espace réservé %%PW_EMAIL_UNSUBSCRIBE%% est remplacé par l’URL de désabonnement de Pushwoosh lors de l’envoi de l’e-mail.

Le bloc Menu place plusieurs éléments cliquables dans une rangée ou une colonne. Utilisez-le pour une barre de navigation ou une liste de contacts d’entreprise.

Pour chaque élément de menu, définissez :

Libellé : le texte que les destinataires voient
URL : où l’élément s’ouvre
Cible : même onglet ou un nouvel onglet

Dans les paramètres du bloc, vous pouvez également définir :

Direction : Horizontale ou Verticale
Alignement : Gauche, Centre ou Droite
Séparateur : un séparateur optionnel entre les éléments
Police, taille, graisse, espacement des lettres et couleurs du lien/texte

Paramètres du bloc Menu avec les libellés des éléments, les URL, la direction, l'alignement et les options de séparateur

Réseaux sociaux

Le bloc Réseaux sociaux affiche une rangée d’icônes de médias sociaux qui renvoient vers vos profils. Utilisez-le pour envoyer les destinataires vers Facebook, Instagram, X et d’autres plateformes depuis l’e-mail.

Ajoutez des entrées de plateforme, puis définissez l’alignement, la taille des icônes et l’écart entre les icônes.

Paramètres du bloc Réseaux sociaux avec les liens des plateformes plus Alignement, Taille de l'icône et Écart

Compte à rebours

Le bloc Minuteur est un compte à rebours dans l’e-mail. Utilisez-le pour les offres à durée limitée, les ventes flash et les rappels d’événements.

Pour le configurer :

Dans Compte à rebours, définissez la Date de fin et l’Heure de fin, puis choisissez le Fuseau horaire et la Langue pour les libellés du minuteur.
Activez Libellés pour afficher les légendes “jours / heures / minutes / secondes” sous les chiffres, ou désactivez pour n’afficher que les chiffres.
Dans Apparence, définissez l’Arrière-plan, la Couleur des chiffres, la Couleur des libellés et la taille de la police pour les chiffres (par défaut 40px) et les libellés (par défaut 16px).
Ajustez l’Espacement (marge intérieure) si nécessaire.

Paramètres du bloc Minuteur avec les options de date et heure de fin du compte à rebours, Libellés, Apparence et Espacement

Le minuteur est rendu comme une image nette dans n’importe quelle langue ou taille, avec un arrière-plan qui s’étend sur toute la largeur de la rangée de l’e-mail, et une version rendue nativement pour la largeur mobile plutôt qu’une image de bureau réduite.

Code-barres

Le bloc Code-barres génère un code-barres ou un QR code scannable à partir d’une valeur de personnalisation, le plus souvent un bon de réduction.

Pour le configurer :

Dans Code, conservez {{voucher}} lorsque l’e-mail est envoyé avec un pool de bons de réduction ou cliquez sur Merge tag et choisissez le tag qui stocke le code de chaque destinataire. L’e-mail résout le tag au moment de l’envoi afin que chaque personne reçoive sa propre valeur scannable.

Champ Code du code-barres avec {{voucher}} et le bouton Merge tag

Choisissez la Symbologie :
- QR : un code 2D carré que les téléphones peuvent scanner. Accepte tout texte, y compris les codes alphanumériques comme WELCOME2025-A1
- Code 128 : un code-barres linéaire pour tout texte, y compris les mêmes codes alphanumériques
- EAN-13 : le code-barres de détail courant en Europe et dans de nombreuses autres régions. Chiffres uniquement, 12–13 caractères
- EAN-8 : un code-barres de détail plus court pour les petits emballages. Chiffres uniquement, 7–8 caractères
- UPC-A : le code-barres de détail courant en Amérique du Nord. Chiffres uniquement, 11–12 caractères
Si vous avez choisi QR, définissez la Correction d’erreur. Cela ajoute des données redondantes pour que le code puisse toujours être scanné même si une partie est couverte, usée ou difficile à voir. Choisissez L, M, Q ou H (par défaut M). Les niveaux plus élevés survivent à plus de dommages mais rendent le motif plus dense, ce qui peut être plus difficile à lire à de petites tailles. Ignorez ce champ pour les autres symbologies.
Activez éventuellement Imprimer le code en chiffres pour afficher la valeur sous le code.

Symbologie du code-barres définie sur QR, Correction d'erreur M, et Imprimer le code en chiffres coché

Dans Apparence, définissez la Couleur des barres, l’Arrière-plan, la Largeur (px) et la Hauteur (px). Laissez Zone de silence, modules sur Auto pour la marge par défaut.

Paramètres d'apparence du code-barres avec Couleur des barres, Arrière-plan, Largeur, Hauteur et Zone de silence

Colonnes

Les Colonnes divisent le canevas en sections côte à côte pour que vous puissiez placer du contenu les uns à côté des autres dans une même rangée.

Faites glisser l’un de ces blocs sur le canevas :

2 colonnes : deux colonnes égales
3 colonnes : trois colonnes égales
4 colonnes : quatre colonnes égales
33 / 67 : colonne de gauche d’environ 33 % de large, colonne de droite d’environ 67 %
67 / 33 : colonne de gauche d’environ 67 % de large, colonne de droite d’environ 33 %

Ajoutez ensuite du contenu à chaque colonne. Pour modifier l’espacement de toutes les colonnes de l’e-mail, ouvrez Paramètres → Valeurs par défaut des colonnes et ajustez la marge extérieure, la marge intérieure des colonnes et l’écart entre les colonnes.

Pour l’image propre à la colonne (celle que vous ajoutez avec Ajouter une image dans les paramètres de la colonne), les paramètres affichent une section Taille et ajustement. C’est le même contrôle que la mise en page Gauche / Droite du bloc Carte. Un bloc Image glissé dans une colonne est un élément de contenu distinct et conserve ses propres champs de dimensionnement simples — voir Image.

Vous pouvez également coller un lien hébergé directement dans URL de l’image pour ignorer la galerie.

Largeur : définissez la largeur de l’image en px ou en pourcentage de la colonne. Laissez non défini pour remplir la colonne.
Hauteur (px) : fixez l’image à une hauteur en pixels. Définir une hauteur en pixels efface le ratio de recadrage ci-dessous. Choisir un ratio de recadrage efface la hauteur en pixels. Vous ne pouvez pas utiliser les deux en même temps.
Recadrage : choisissez Original pour conserver les proportions naturelles de l’image, ou un ratio (Carré (1:1), 4:3, 3:2, 16:9) pour recadrer l’image dans cette boîte.
Ajustement : choisissez Couvrir pour remplir la boîte et recadrer l’image. Définissez le point de recadrage avec Point focal. Ou choisissez Contenir pour mettre à l’échelle toute l’image à l’intérieur de la boîte sans recadrage. Positionnez-la avec Définir la position.
Rayon d’angle (px) : arrondissez les coins de l’image. Activez Plus d’options pour définir chaque coin séparément, ou laissez désactivé pour appliquer le même rayon aux quatre. Gmail et Apple Mail le rendent ; Outlook Desktop l’ignore, comme pour le bloc Image.

Produits

Un bloc Produits affiche une grille de fiches produits à partir d’un modèle partagé. Chaque fiche peut inclure une image, un titre, une description, un prix et un bouton d’achat. Le modèle se répète pour chaque produit.

Cliquez sur une fiche sur le canevas pour la rendre active et la modifier :

Changez le titre, la description, le prix, l’image ou le lien par produit pour ne mettre à jour que cette fiche.
Changez la mise en page du modèle, les couleurs, la marge intérieure ou les éléments qu’il contient pour mettre à jour chaque fiche.

Dans le panneau des paramètres, sous Source, choisissez d’où proviennent les produits :

Manuel : saisissez les produits manuellement, choisissez-les dans votre catalogue de produits par ID, ou mélangez les deux.
Règle de catalogue : extrayez automatiquement les produits par catégorie et ordre de tri, résolus à nouveau à partir du catalogue au moment de l’envoi.
Panier : affichez les articles du panier abandonné actuel de chaque destinataire.
Recommandations : extrayez les produits classés selon une stratégie intégrée — meilleures ventes, nouveautés, de retour en stock ou baisse de prix — résolus à partir de votre catalogue au moment de l’envoi.

Ajouter des produits manuellement

Remplissez la grille vous-même, soit en saisissant les produits manuellement, soit en choisissant des articles spécifiques de votre catalogue de produits par ID. Vous pouvez mélanger les deux dans le même bloc.

Nombre de produits : définissez le nombre de fiches à afficher (1–24).
Ajouter un produit : ajoutez une fiche et remplissez vous-même son titre, sa description, son prix, son image et son lien.
Choisir dans le catalogue… : sélectionnez des produits spécifiques de votre catalogue de produits au lieu de les saisir.
Actualiser depuis le catalogue : extrayez les derniers titre, description, prix et image pour les produits que vous avez choisis dans le catalogue, au cas où ils auraient changé depuis que vous les avez ajoutés. N’affecte pas les produits saisis manuellement.
Images des produits : cliquez sur une vignette pour remplacer l’image de ce produit.
Liens des produits : saisissez ou modifiez l’URL de chaque produit.

Paramètres de la source manuelle pour le bloc Produits avec Ajouter un produit, Choisir dans le catalogue, Actualiser depuis le catalogue, Images des produits et Liens des produits

Extraire des produits avec une règle de catalogue

Extrayez automatiquement les produits par catégorie et ordre de tri, sans sélection manuelle.

Catégorie : limitez à une catégorie de catalogue spécifique, ou Toutes les catégories.
Trier : choisissez l’ordre dans lequel les produits sont extraits : Les plus récents d’abord, Prix : du plus bas au plus élevé, Prix : du plus élevé au plus bas ou Titre A-Z.
Nombre de produits : définissez une limite sur le nombre de fiches à afficher (1–12).
Actualiser l’aperçu : recalculez l’aperçu du canevas par rapport au catalogue actuel.

Paramètres de la source de la règle de catalogue pour le bloc Produits avec Catégorie, Trier, Nombre de produits et Actualiser l'aperçu

Afficher les articles du panier

Affichez les articles actuels du panier abandonné d’un destinataire.

Max de produits affichés : définissez une limite sur le nombre de fiches à afficher (1–12).
Prévisualiser le panier d’un utilisateur : saisissez un ID utilisateur ou un e-mail et cliquez sur Prévisualiser le panier pour voir comment le bloc s’affiche pour ce destinataire spécifique.

Paramètres de la source du panier pour le bloc Produits avec Max de produits affichés et Prévisualiser le panier d'un utilisateur

Obtenir des produits recommandés

Extrayez des produits classés selon une stratégie intégrée au lieu de les choisir vous-même ou d’écrire une règle de catalogue.

Paramètres du bloc Produits avec la Source définie sur Recommandations, un sélecteur de Stratégie défini sur Meilleures ventes (30 jours), Catégorie, Nombre de produits et Actualiser l'aperçu

Stratégie : choisissez comment les produits sont classés — Meilleures ventes (7 jours), Meilleures ventes (30 jours), Nouveautés, De retour en stock, Baisse de prix, Achetés ensemble ou Basé sur ce qu’ils ont vu. La sélection de Recommandations remplace le contrôle Trier de la Règle de catalogue par ce sélecteur de Stratégie. Meilleures ventes, Achetés ensemble et Basé sur ce qu’ils ont vu nécessitent des événements de votre backend. Voir Comment configurer les recommandations de produits par e-mail.

Sélecteur de stratégie développé montrant Meilleures ventes (7 jours), Meilleures ventes (30 jours), Nouveautés, De retour en stock, Baisse de prix, Achetés ensemble et Basé sur ce qu'ils ont vu

Catégorie : limitez à une catégorie de catalogue spécifique, ou Toutes les catégories.
Nombre de produits : définissez une limite sur le nombre de fiches à afficher (1–12).
Actualiser l’aperçu : recalculez l’aperçu du canevas par rapport au catalogue actuel.

Styliser la grille

Une fois que vous avez choisi une source, ces paramètres contrôlent l’apparence de la grille et de ses fiches. Ils restent les mêmes quelle que soit la source que vous utilisez :

Colonnes : choisissez 1, 2 ou 3 fiches par rangée. Sur mobile, les fiches s’empilent toujours en une seule colonne.
Écart : activez pour définir l’espace entre les fiches. Désactivé utilise la valeur par défaut (16px).
Limite de description : la limite de caractères à laquelle le texte de la description est coupé, afin que les fiches conservent une taille cohérente.
Modèle de fiche : choisissez une mise en page, puis définissez l’Arrière-plan de la fiche, le Rayon d’angle de la fiche et la Marge intérieure du contenu pour chaque fiche.
Taille et ajustement : affiché pour chaque mise en page qui a une image. Mêmes contrôles de Largeur, Hauteur, Recadrage et Ajustement que le dimensionnement de l’image par mise en page du bloc Carte, dimensionné par rapport à la largeur de la fiche au lieu de l’e-mail entier.

Les paramètres de Style de bloc ci-dessous stylisent le bloc dans son ensemble, séparément des fiches qu’il contient :

Arrière-plan et Image d’arrière-plan : définissez une couleur ou une image d’arrière-plan derrière toute la grille. Avec une image définie, Ajustement choisit comment elle se positionne dans le bloc — Couvrir la recadre sur le bloc, Contenir ajuste toute l’image à l’intérieur — et Point focal / Définir la position la place. Outlook Desktop n’affiche que la couleur d’arrière-plan et ignore l’image, alors gardez une couleur lisible derrière elle.
Couleur de la bordure, Largeur de la bordure et Rayon d’angle : ajoutez un contour et des coins arrondis autour de toute la grille. Activez Plus d’options dans Rayon d’angle pour définir chaque coin séparément, ou laissez désactivé pour appliquer le même rayon aux quatre. Gmail et Apple Mail le rendent ; Outlook Desktop l’ignore et affiche des coins carrés, comme il le fait pour les images.
Masquer sur mobile et Masquer sur ordinateur : masquez l’ensemble du bloc sur un appareil. Voir Afficher ou masquer le contenu par appareil.

Actualités

Un bloc Actualités affiche une grille de fiches d’articles. Chaque fiche peut inclure une image, une date, un titre, un résumé et un lien “Lire la suite”. Le modèle se répète pour chaque article, de la même manière que pour le bloc Produits. Un nouveau bloc Actualités commence avec 2 exemples de fiches.

Dans le panneau des paramètres, sous Source, choisissez d’où proviennent les articles :

Choisis : chargez des articles à partir d’un flux RSS ou Atom une fois, ou choisissez manuellement des articles spécifiques. Ils sont copiés dans l’e-mail et ne changent plus.
Flux en direct : extrayez des articles d’un flux enregistré pour votre application, résolus à nouveau au moment de l’envoi pour que chaque destinataire reçoive les plus récents.

Choisir des articles d’un flux

Cliquez sur une fiche sur le canevas pour la rendre active et la modifier :

Changez la date, le titre, le résumé, l’image ou le lien par article pour ne mettre à jour que cette fiche.
Changez la mise en page du modèle, les couleurs, la marge intérieure ou les éléments qu’il contient pour mettre à jour chaque fiche.

Les articles sont copiés dans le contenu de l’e-mail une fois que vous les chargez ; rien n’est récupéré à nouveau au moment de l’envoi. Les images des articles sont copiées dans votre Médiathèque et converties de WebP en JPEG si nécessaire, car Outlook ne peut pas rendre le WebP.

Collez une URL de flux RSS 2.0 ou Atom, puis :

Charger les derniers articles : remplacez les fiches actuelles par les articles les plus récents du flux, avec le même nombre de fiches que vous avez déjà (2 par défaut).
Choisir des articles… : ouvrez un tiroir listant jusqu’à 12 des derniers articles du flux, avec vignette, titre, date, catégorie et auteur, et choisissez ceux à ajouter. Les articles choisis sont ajoutés aux fiches existantes, jusqu’à 12 au total ; les articles déjà sur le canevas ne peuvent pas être choisis deux fois.

Panneau des paramètres des Actualités avec la Source définie sur Choisis, un champ URL de flux, et les boutons Charger les derniers articles et Choisir des articles

Le tiroir vous permet de choisir manuellement des articles spécifiques au lieu de toujours prendre les plus récents.

Tiroir Choisir des articles listant les articles du flux avec des vignettes, des titres, des dates et des cases à cocher pour sélectionner

Images des articles : cliquez sur une vignette pour remplacer l’image de cet article.
Liens des articles : affiché lorsque le modèle de fiche a un lien lié à l’article (le bouton par défaut “Lire la suite”). Liste chaque article par titre pour que vous puissiez modifier ou remplacer son URL de destination, initialement extraite du flux.

Extraire des articles d’un flux en direct

Les articles sont récupérés lorsque l’e-mail est envoyé, afin que chaque destinataire reçoive les plus récents. Au lieu de choisir vous-même les articles, choisissez un flux et une limite :

Panneau des paramètres des Actualités avec la Source définie sur Flux en direct, un sélecteur de flux enregistré, un filtre de catégorie, un nombre d'articles et un bouton Actualiser l'aperçu

Flux enregistré : choisissez un flux déjà enregistré pour votre application, ou Tous les flux de l’application pour extraire de tous. Ce panneau ne fait que choisir un flux, il n’en enregistre pas ; s’il n’en existe pas encore, ajoutez-en un sur la page Flux d’actualités en utilisant Ajouter un flux.
Filtre de catégorie : un filtre textuel optionnel comparé à la catégorie de l’article du flux (par défaut : toute catégorie).
Articles : combien de fiches afficher (1–12, 3 par défaut).
Actualiser l’aperçu : recalculez l’aperçu du canevas par rapport au flux actuel. Si le flux ne renvoie aucun article, Pushwoosh laisse les fiches actuelles inchangées ; si le flux ne peut pas être atteint, Pushwoosh affiche une erreur à la place.

Styliser la grille

Une fois que vous avez choisi une source, ces paramètres contrôlent l’apparence de la grille et de ses fiches. Ils restent les mêmes quelle que soit la source que vous utilisez :

Colonnes : choisissez 1, 2 ou 3 fiches par rangée. Sur mobile, les fiches s’empilent toujours en une seule colonne.
Écart : activez pour définir l’espace entre les fiches. Désactivé utilise la valeur par défaut (16px).
Limite de résumé : la limite de caractères à laquelle le résumé de l’article est coupé, afin que les fiches conservent une taille cohérente.
Modèle de fiche : choisissez une mise en page, puis définissez l’Arrière-plan de la fiche, le Rayon d’angle de la fiche et la Marge intérieure du contenu pour chaque fiche. Pour la mise en page Gauche ou Droite, activez Habiller le texte autour de l’image pour faire couler le titre et le résumé autour de l’image au lieu de les garder dans une colonne fixe. Taille et ajustement (Largeur, Hauteur, Recadrage, Ajustement) fonctionne de la même manière que le dimensionnement de l’image par mise en page du bloc Carte, dimensionné par rapport à la largeur de la fiche.

Les paramètres de Style de bloc ci-dessous stylisent le bloc dans son ensemble, séparément des fiches qu’il contient :

Arrière-plan et Image d’arrière-plan : définissez une couleur ou une image d’arrière-plan derrière toute la grille. Avec une image définie, Ajustement choisit comment elle se positionne dans le bloc — Couvrir la recadre sur le bloc, Contenir ajuste toute l’image à l’intérieur — et Point focal / Définir la position la place. Outlook Desktop n’affiche que la couleur d’arrière-plan et ignore l’image, alors gardez une couleur lisible derrière elle.
Couleur de la bordure, Largeur de la bordure et Rayon d’angle : ajoutez un contour et des coins arrondis autour de toute la grille. Activez Plus d’options dans Rayon d’angle pour définir chaque coin séparément, ou laissez désactivé pour appliquer le même rayon aux quatre. Gmail et Apple Mail le rendent ; Outlook Desktop l’ignore et affiche des coins carrés, comme il le fait pour les images.
Masquer sur mobile et Masquer sur ordinateur : masquez l’ensemble du bloc sur un appareil. Voir Afficher ou masquer le contenu par appareil.

Emplacement publicitaire

Un bloc Emplacement publicitaire affiche une campagne sponsorisée aux destinataires de l’e-mail. C’est un emplacement payant que votre gestionnaire de compte vend, pas un bloc que vous remplissez avec votre propre création.

Sélectionnez le bloc sur le canevas pour ouvrir ses paramètres dans le panneau de droite.

Panneau des paramètres de l'emplacement publicitaire avec ID de campagne, Catégorie, Libellé au-dessus de la création, et un interrupteur Quand rien n'est vendu réglé sur Masquer l'emplacement

ID de campagne : l’ID numérique de la campagne publicitaire à afficher. Laissez-le à 0 pour correspondre à n’importe quelle campagne active à la place. La liste de l’inventaire publicitaire n’affiche pas d’ID pour une campagne — copiez le numéro de la barre d’adresse du navigateur sur la page de la campagne après l’avoir enregistrée.
Catégorie : limitez la correspondance aux campagnes étiquetées avec cette catégorie. Définissez-le avec l’ID de campagne pour exiger les deux — la publicité ne s’affiche que si cette campagne exacte porte également cette catégorie. Laissez l’ID de campagne à 0 pour correspondre à n’importe quelle campagne active dans la catégorie à la place.
Libellé au-dessus de la création : une courte ligne affichée au-dessus de la publicité, par exemple “Sponsorisé”. Laissez vide pour n’afficher aucun libellé.
Quand rien n’est vendu : choisissez ce que le bloc affiche si aucune campagne ne correspond. Masquer l’emplacement (par défaut) ne laisse rien à sa place. Afficher mon propre contenu ajoute une deuxième section à l’intérieur du même bloc, marquée “Affiché si aucune campagne n’est en cours”, où vous écrivez votre propre texte de remplacement et ajoutez une image. Cette section est envoyée dans l’e-mail à la place d’une publicité chaque fois qu’aucune campagne ne correspond. La laisser vide enregistre comme Masquer l’emplacement — un remplacement vide n’est jamais envoyé comme un bloc vide.

Bloc d'emplacement publicitaire sur le canevas avec Quand rien n'est vendu réglé sur Afficher mon propre contenu, montrant l'espace réservé de la publicité au-dessus d'un séparateur en pointillés et le contenu de remplacement Votre propre promo ici en dessous

Le canevas affiche l’ID, la catégorie ou le libellé que vous avez défini comme espace réservé — pas la création publicitaire réelle. Pushwoosh choisit la campagne correspondante une fois, lorsque l’e-mail commence à être envoyé, afin que chaque destinataire de cet envoi voie la même publicité — il n’y a pas de ciblage par destinataire pour la campagne affichée, et pas de limitation de fréquence dans cette version.

Enregistrer et réutiliser des blocs

Enregistrez un bloc pour le réutiliser dans cet e-mail ou d’autres au lieu de le reconstruire à chaque fois.

Cliquez sur un bloc (son cadre ou son arrière-plan, pas le texte ou le bouton à l’intérieur) pour le sélectionner. Carte, Colonnes et Réseaux sociaux sont des exemples de blocs qui fonctionnent de cette manière.

Cliquez sur l’icône de signet dans la barre d’outils du bloc et donnez-lui un nom.

Icône de signet dans la barre d'outils d'un bloc Carte ouvrant une boîte de dialogue pour nommer et enregistrer le bloc

Les blocs enregistrés apparaissent sous Blocs enregistrés en bas de l’onglet Blocs.

Section Blocs enregistrés en bas de l'onglet Blocs avec des tuiles de blocs enregistrés et des icônes de suppression

Faites glisser un bloc enregistré sur le canevas, ou cliquez dessus pour l’ajouter à la fin de l’e-mail.
Cliquez sur le × sur la tuile d’un bloc enregistré pour le supprimer.

Garder les copies synchronisées

Lorsque vous enregistrez un bloc, activez Garder les copies synchronisées pour lier chaque copie insérée à la même source. Modifiez la source une fois, et le changement s’applique partout où ce bloc est utilisé, y compris les e-mails déjà programmés pour l’envoi.

L’enregistrement d’une plage de blocs fonctionne de la même manière. Modifiez n’importe quel bloc à l’intérieur, puis appliquez le changement pour mettre à jour chaque copie où qu’elle soit utilisée.

Boîte de dialogue d'enregistrement pour une plage de 3 blocs avec Garder les copies synchronisées activé

Une copie synchronisée est verrouillée sur le canevas. Vous ne pouvez pas la modifier directement. Sélectionnez la copie pour ouvrir ses paramètres :

Modifier le bloc synchronisé : déverrouillez cette copie pour pouvoir la modifier. une bannière apparaît en haut. Cliquez sur Appliquer à tous pour enregistrer vos modifications sur la source et toutes les autres copies, ou sur Annuler pour les annuler. Vous ne pouvez déverrouiller qu’un seul bloc synchronisé à la fois.
Mettre à jour depuis la source : remplacez cette copie par la dernière version de la source.
Détacher de la source : déliez cette copie de la source pour pouvoir la modifier seule.

Pendant qu’un bloc synchronisé est déverrouillé pour modification, le reste de l’e-mail est verrouillé : vous ne pouvez rien sélectionner, modifier ou supprimer d’autre, et Enregistrer est désactivé jusqu’à ce que vous ayez terminé. Cliquez sur Appliquer à tous pour enregistrer vos modifications partout, ou sur Annuler pour les annuler et déverrouiller à nouveau le reste de l’e-mail.

Ajouter des liens

Utilisez la boîte de dialogue Insérer/Modifier un lien pour définir ce qui se passe lorsqu’un destinataire clique sur un bouton ou un texte sélectionné. Choisissez un Type d’action, puis remplissez les champs pour cette action.

Ouvrir un site web

Ouvre un lien lorsque le destinataire clique. Saisissez l’adresse dans URL.

Lien de gestion des préférences

Ajoute un lien vers le centre de préférences d’abonnement où les destinataires peuvent choisir les catégories d’e-mails qu’ils reçoivent. Le lien est inséré automatiquement.

Lien de désabonnement

Permet aux destinataires de se désabonner conformément à la réglementation et à leurs préférences.

Vous pouvez également ajouter un lien de désabonnement dans un bloc HTML :

<a href=%%PW_EMAIL_UNSUBSCRIBE%%>Se désabonner</a>

L’espace réservé %%PW_EMAIL_UNSUBSCRIBE%% est remplacé par l’URL de désabonnement de Pushwoosh lors de l’envoi de l’e-mail.

Que se passe-t-il lorsque le destinataire clique sur le lien de désabonnement

Si le centre de préférences d’abonnement est activé

Le destinataire est désabonné uniquement de la catégorie assignée à cet e-mail (par exemple, Newsletter). Le nom de la catégorie est supprimé de son tag Catégories d’e-mails abonnées.

Un écran de confirmation apparaît avec les options Se réabonner et Gérer les préférences. En savoir plus.

Si le centre de préférences d’abonnement n’est pas activé

Le destinataire est désabonné de tous les e-mails marketing et le tag E-mails désabonnés est défini sur true. Les e-mails transactionnels ne sont pas affectés et continueront d’être livrés. En savoir plus sur les types de messages.

Les clics sont comptabilisés dans le taux de désabonnement dans l’Historique des messages.

Lien de la version web

Donne aux destinataires l’accès à une version web de l’e-mail, utile s’ils ont des difficultés à le visualiser dans leur boîte de réception.

Ne pas suivre les statistiques

Ouvre un lien lorsque le destinataire clique, sans compter le clic dans les statistiques de clics de votre e-mail. Saisissez l’adresse dans URL.

Lien de confirmation de formulaire d’abonnement

Insère un lien de confirmation pour la soumission d’un formulaire d’abonnement (par exemple, pour confirmer un double opt-in). En savoir plus sur le double opt-in.