Utiliser les composants de contenu content-components

Lorsque vous créez le contenu de votre e-mail, les composants de contenu vous permettent de personnaliser votre e-mail à l’aide des composants bruts et vides que vous pouvez utiliser une fois placés dans un e-mail.

Vous pouvez ajouter autant de contenus que nécessaire dans une structure, ce qui permet de définir la disposition de votre e-mail.

Ajouter des composants de contenu add-content-components

Pour ajouter des composants de contenu à votre e-mail et les ajuster selon vos besoins, suivez les étapes ci-dessous.

  1. Dans le concepteur d’e-mail, utilisez un contenu existant ou faites glisser et déposez une structure dans votre contenu vide pour définir la disposition de votre e-mail. Voici comment procéder

  2. Faites glisser et déposez le contenu de votre choix dans les structures appropriées.

    Capture d’écran montrant comment faire glisser et déposer des composants de contenu dans des structures dans le concepteur d’e-mail. {modal="regular"}

    note
    NOTE
    Vous pouvez ajouter plusieurs composants dans une seule structure et dans chaque colonne d’une structure.
  3. Ajustez les options de chaque composant en utilisant l’onglet Paramètres contextuels. Par exemple, choisissez de ne l’afficher que sur les ordinateurs de bureau ou les appareils mobiles, ou les deux. Vous pouvez également gérer les options de lien à partir de cet onglet. En savoir plus sur la gestion des liens

  4. Ajustez les attributs de style de chaque composant à l’aide de l’onglet Style. Par exemple, vous pouvez changer le style de texte, la marge intérieure ou la marge de chaque composant. En savoir plus sur l’alignement et la marge intérieure.

    Capture d’écran montrant l’onglet Paramètres pour les composants de contenu dans le concepteur d’e-mail. {modal="regular"}

  5. Dans le menu avancé de votre Contenu dans le volet de droite, supprimez ou dupliquez facilement n’importe quel composant de contenu, si nécessaire.

Conteneur container

Vous pouvez ajouter un conteneur simple à l’intérieur duquel vous ajouterez un autre composant de contenu. Vous pouvez ainsi appliquer un style spécifique au conteneur, qui est différent du composant utilisé à l’intérieur.

Par exemple, ajoutez un composant Conteneur, puis ajoutez un composant Bouton à l’intérieur de ce conteneur. Utilisez un arrière-plan spécifique pour le conteneur et un autre pour le bouton.

Capture d’écran montrant comment ajouter un composant de conteneur dans le concepteur d’e-mail. {modal="regular"}

Bouton buttons

Utilisez le composant Bouton pour insérer un ou plusieurs boutons dans votre e-mail et rediriger votre audience d’e-mail vers une autre page.

  1. À partir de la liste Contenu, faites glisser et déposez le composant de bouton dans un composant de structure.

    Capture d’écran montrant comment faire glisser et déposer un composant Bouton dans le concepteur d’e-mail. {modal="regular"}

  2. Cliquez sur le bouton que vous venez d’ajouter pour personnaliser le texte et accéder aux onglets Paramètres et Styles.

    Capture d’écran montrant l’onglet Paramètres pour les composants Bouton dans le concepteur d’e-mail. {modal="regular"}

  3. Depuis l’onglet Paramètres, dans le champ URL, ajoutez l’URL vers laquelle vous souhaitez rediriger lors d’un clic sur le bouton.

  4. Choisissez l’affichage du contenu à l’aide de la liste déroulante Cible :

    • Aucune : ouvre le lien dans le même cadre que celui sur lequel l’utilisateur ou l’utilisatricea cliqué (par défaut).
    • Vierge : ouvre le lien dans une nouvelle fenêtre ou un nouvel onglet.
    • Auto : ouvre le lien dans le même cadre que celui sur lequel l’utilisateur ou l’utilisatrice a cliqué.
    • Parent : ouvre le lien dans le cadre parent.
    • Haut : ouvre le lien dans le corps complet de la fenêtre.

    Capture d’écran montrant les options cibles des composants Bouton dans le concepteur d’e-mail. {modal="regular"}

  5. Personnalisez davantage votre bouton en modifiant les attributs de style, tels que Bordure, Taille, Marge, etc., à partir de l’onglet Styles.

Texte text

Utilisez le composant Texte pour insérer du texte dans votre e-mail et ajuster le style (bordure, taille, marge intérieure, etc.) à l’aide des onglets Paramètres et Styles.

  1. Dans le menu Contenu, faites glisser et déposez du texte dans un composant de structure.

    Capture d’écran montrant comment faire glisser et déposer un composant de texte dans le concepteur d’e-mail. {modal="regular"}

  2. Cliquez sur le composant que vous venez d’ajouter pour personnaliser le texte et accéder aux onglets Paramètres et Styles.

  3. Modifiez votre texte avec les options suivantes disponibles dans la barre d’outils contextuelle :

    Capture d’écran affichant la barre d’outils d’édition de texte dans le Concepteur d’e-mail. {modal="regular"}

    • Modifier le style de texte : appliquez le style gras, italique, souligné ou barré à votre texte.
    • Modifier l’alignement : sélectionnez l’alignement gauche, droite, centré ou justifié pour votre texte.
    • Créer une liste : ajoutez une liste à puces ou à nombres à votre texte.
    • Définir un titre : ajoutez jusqu’à six niveaux de titre à votre texte.
    • Taille de police : sélectionnez la taille de police de votre texte en pixels.
    • Modifier l’image : ajoutez une image à votre composant de texte à partir de votre bibliothèque Adobe Experience Manager Assets ou de votre ordinateur, ou réutilisez une image disponible sur votre instance Adobe Campaign. En savoir plus
    • Afficher le code source : affichez le code source de votre texte. Impossible d’effectuer une modification.
    • Dupliquer : ajoutez une copie de votre composant de texte.
    • Supprimer : supprimez le composant de texte sélectionné de votre e-mail.
    • Ajouter une personnalisation : ajoutez des champs de personnalisation pour personnaliser le contenu des données de vos profils.
    • Activer le contenu conditionnel : ajoutez du contenu conditionnel pour adapter le contenu du composant aux profils ciblés.
  4. Ajustez les autres attributs de style, tels que la couleur du texte, la famille de polices, la bordure, la marge intérieure, la marge, et d’autres éléments à partir de l’onglet Styles.

    Capture d’écran affichant l’onglet des styles pour les composants de texte dans le Concepteur d’e-mail. {modal="regular"}

Diviseur divider

Utilisez le composant Diviseur pour insérer une ligne de séparation afin d’organiser la disposition et le contenu de l’e-mail.

Vous pouvez ajuster les attributs de style, tels que la couleur, le style et la hauteur des lignes depuis l’onglet Styles.

Capture d’écran affichant comment ajouter un composant diviseur dans le Concepteur d’e-mail. {modal="regular"}

HTML HTML

Utilisez le composant HTML pour copier-coller les différentes parties de votre code HTML existant. Vous pouvez ainsi créer des composants HTML modulaires autonomes afin de réutiliser du contenu externe.

  1. À partir des Composants, faites glisser et déposez le composant HTML dans une structure.

    Capture d’écran affichant la manière de faire glisser et déposer un composant HTML dans le Concepteur d’e-mail. {modal="regular"}

  2. Cliquez sur le composant que vous venez d’ajouter, puis sélectionnez Afficher le code source dans la barre d’outils contextuelle pour ajouter votre code HTML.

    Capture d’écran affichant l’option de code source pour les composants HTML dans le Concepteur d’e-mail. {modal="regular"}

NOTE
Pour rendre un contenu externe compatible avec le Concepteur d’e-mail, Adobe recommande de créer un message en partant de zéro et de copier le contenu de l’e-mail existant dans des composants.

Image image

Utilisez le composant Image pour insérer une image dans votre e-mail.

  1. Dans le menu Contenu, faites glisser et déposez Image dans un composant de structure.

    Capture d’écran affichant la façon de faire glisser et déposer un composant d’image dans le Concepteur d’e-mail. {modal="regular"}

  2. Sélectionnez l’une des options suivantes pour ajouter votre image :

    Capture d’écran montrant les options des composants d’image dans le Designer d’e-mail. {modal="regular"}

    accordion
    Parcourir

    Sélectionnez cette option pour sélectionner une image dans votre bibliothèque Adobe Experience Manager Assets.

    note important
    IMPORTANT
    Cette option nécessite une licence Adobe Experience Manager as a Cloud Service active.

    Parcourez vos dossiers pour localiser la ressource spécifique dont vous avez besoin ou utilisez la barre de recherche pour la chercher efficacement. Une fois la ressource trouvée, cliquez sur Sélectionner.

    Capture d’écran affichant le processus de sélection de ressources dans le Concepteur d’e-mail. {modal="regular"}

    Pour en savoir plus sur le chargement et l’ajout de ressources dans Adobe Experience Manager, reportez-vous à la documentation d’Adobe Experience Manager as a Cloud Service.

    accordion
    Importer
    Sélectionnez cette option pour charger une nouvelle image à partir de votre ordinateur. Le fichier est chargé en tant que ressource publique sur votre instance Adobe Campaign.
    accordion
    Importer ressource publique

    Sélectionnez cette option pour sélectionner une image déjà disponible sur votre instance Adobe Campaign, telle qu’un fichier précédemment importé dans le Designer de messagerie ou en tant que ressource publique à partir de la console cliente.

    Capture d’écran montrant le processus de sélection des ressources publiques dans le Designer d’e-mail. {modal="regular"}

    Recherchez la ressource par nom. Vous pouvez également utiliser des filtres et réorganiser les colonnes.

    note
    NOTE
    Les contraintes de sécurité sont les mêmes que dans la console cliente : vous pouvez uniquement sélectionner les ressources auxquelles vous avez accès en fonction de vos droits d’utilisateur.

    Sélectionnez la ressource, puis cliquez sur Confirmer.

  3. Cliquez sur le composant que vous venez d’ajouter et configurez les propriétés de l’image à l’aide de l’onglet Paramètres :

    • Le Titre de l’image permet de définir un titre pour l’image.
    • Texte alternatif permet de définir la légende associée à votre image. Cela correspond à l’attribut HTML alternatif.

    Capture d’écran affichant l’onglet Paramètres pour les composants d’image dans le Concepteur d’e-mail. {modal="regular"}

  4. Ajoutez un lien pour rediriger votre audience vers un autre contenu. En savoir plus

  5. Ajustez d’autres attributs de style, tels que la marge, la bordure et autres à l’aide de l’onglet Styles.

Social social

Utilisez le composant Social pour insérer des liens vers des pages de réseaux sociaux dans le contenu de l’e-mail.

  1. À partir du menu Composants, faites glisser et déposez le composant Social dans un composant de structure.

  2. Cliquez sur le composant que vous venez d’ajouter.

  3. Dans le champ Social de l’onglet Paramètres, sélectionnez les médias sociaux à ajouter ou à supprimer.

    Capture d’écran affichant l’onglet Paramètres pour les composants sociaux dans le Concepteur d’e-mail. {modal="regular"}

  4. Sélectionnez la taille des icônes dans le champ Taille des images.

  5. Cliquez sur chaque icône de réseau social pour configurer l’URL vers laquelle votre audience est redirigée.

    Capture d’écran affichant la configuration de l’URL pour les icônes de médias sociaux dans le Concepteur d’e-mail. {modal="regular"}

  6. Modifiez les icônes de chaque média social si nécessaire dans le champ Source.

  7. Ajustez d’autres attributs de style, tels que le style, la marge, la bordure et d’autres depuis l’onglet Styles.

recommendation-more-help
campaign-web-help-v8