Show Menu
SUJETS×

Concevoir une landing page

A propos de la conception du contenu d'une landing page

Les landing pages sont créées de la même façon que toute autre activité marketing .
Lors de la conception d'une landing page, vous devez définir le contenu de la page, de la page de confirmation et de la page d'erreur. Utilisez le sélecteur situé sous la barre d'actions pour afficher et configurer chacune de ces pages.
Le contenu des landing pages est conçu dans l'éditeur de contenu de Campaign.
Si votre instance a été installée avant la version 19.0 d'Adobe Campaign Standard, vous avez toujours accès à l'ancien éditeur de contenu d'email. L'interface, les principes d'utilisation et la configuration sont pratiquement les mêmes que ceux décrits ci-dessous pour les landing pages. Cependant, toutes les fonctionnalités peuvent ne pas être disponibles ou gérées dans l'ancien éditeur de contenu d'email qui est obsolète à compter de la version 19.0. Pour modifier rapidement votre contenu de courrier électronique via une interface par glisser-déposer avec des fonctionnalités étendues, utilisez Email Designer .
Cette page décrit les spécificités de l'éditeur de contenu de landing page. Pour plus d'informations sur les actions communes à une ou plusieurs activités marketing, reportez-vous aux sections suivantes du guide Concevoir un contenu d'email  :
Si vous disposez d'une landing page déjà prédéfinie au format HTML, vous pouvez l'importer directement via le bouton Changer de contenu .
Avant d'importer une page HTML dans Adobe Campaign, assurez-vous qu'elle s'ouvre et s'affiche correctement dans les différents navigateurs. Si la page HTML contient des scripts en langage JavaScript, ils doivent s'exécuter sans erreur hors de l'éditeur. En général, évitez d’utiliser des scripts dans le contenu des messages pour vous assurer qu’ils sont correctement traités par les clients de messagerie.

Interface de l'éditeur de contenu de landing page

L'éditeur de contenu de landing page permet de définir, modifier et personnaliser facilement du contenu dans Adobe Campaign. Pour y accéder, cliquez sur le bloc Contenu dans le tableau de bord des landing pages.
L’éditeur de contenu est organisé en trois sections différentes. Ces sections vous permettent d’afficher et de modifier le contenu.
  1. La palette située à gauche de l’écran vous permet de modifier les options générales liées à un bloc sélectionné. Les options pouvant être modifiées sont les suivantes : couleur de fond, bordure, alignement du texte, condition de visibilité, etc. See Inserting a personalization field .
  2. La barre d’ actions contient les options générales de la page. Vous pouvez sélectionner un modèle et changer le mode d'affichage.
  3. La zone d'édition principale permet d'interagir directement avec le contenu, grâce à la barre d'outils contextuelle : insérer un lien sur une image, modifier la police de caractères, supprimer un champ, etc.
La barre d'actions contient différents boutons permettant d'agir sur le contenu en cours de création.
Icône Nom du bouton Canal Description
Charger du contenu Page d’entrée et courrier électronique Permet de sélectionner du contenu prêt à l’emploi ou d’importer votre propre contenu HTML. Reportez-vous à Chargement d’un contenu existant.
Annuler Tous Annule la dernière action effectuée.
Rétablir Tous Rétablit la dernière action annulée.
Afficher les blocs Page d’entrée et courrier électronique Permet d’afficher les zones entourant les blocs de contenu (correspond à la balise <div> HTML).
Afficher la source Page d’entrée et courrier électronique Permet d’afficher le code source HTML de la page.
La barre d'outils est un élément contextuel de l'interface de l'éditeur qui présente des fonctionnalités différentes selon la zone sélectionnée. Il contient des boutons d’action et des boutons qui vous permettent de modifier le style du texte. Les modifications effectuées s'appliquent toujours à la zone sélectionnée. Une fois que vous avez sélectionné un bloc, vous pouvez le supprimer ou le dupliquer, par exemple. Après avoir sélectionné le texte dans un bloc, vous pouvez le transformer en lien ou le mettre en gras.
Certaines fonctions de la barre d’outils vous permettent de formater le contenu HTML. Toutefois, si la page contient une feuille de style CSS, les instructions de la feuille de style peuvent prendre la priorité sur les instructions spécifiées dans la barre d’outils.
Icône Nom du bouton Contexte Description
Lien vers une URL externe Tout élément Permet d’ajouter un lien à une URL. Les détails de la configuration d’un lien sont présentés dans la section Insertion d’un lien .
Lien vers une page d’entrée Tout élément Permet d’accéder à une page d’entrée Adobe Campaign. Les détails de la configuration d’un lien sont présentés dans la section Insertion d’un lien .
Lien d'abonnement Tout élément Permet d’insérer un lien d’abonnement au service. Les détails de la configuration d’un lien sont présentés dans la section Insertion d’un lien .
Lien de désabonnement Tout élément Permet d’insérer un lien de désabonnement de service. Les détails de la configuration d’un lien sont présentés dans la section Insertion d’un lien .
Supprimer le lien Lien (link) Permet de supprimer le lien, ainsi que toutes les configurations qui y sont liées, après confirmation.
Insérer un champ de personnalisation Elément Texte Permet d’ajouter un champ de la base de données au contenu. Reportez-vous à Insertion d’un champ de personnalisation.
Insérer un bloc de contenu Elément Texte Permet d’ajouter un bloc de personnalisation au contenu. Reportez-vous à Ajout d’un bloc de contenu.
Activer le contenu dynamique Elément Texte Permet d’insérer du contenu dynamique dans le contenu. Reportez-vous à Définition de contenu dynamique.
Désactiver le contenu dynamique Elément Texte Allows you to delete dynamic content.
Agrandissement de la police Elément Texte Augmente la taille du texte sélectionné (ajoute <span style="font-size:"> ).
Réduire la police Elément Texte Réduit la taille du texte sélectionné (ajoute <span style="font-size:"> ).
Gras Elément Texte Ajoute le style gras au texte sélectionné (entoure le texte de balises <strong> </strong> ).
Italique Elément Texte Ajoute le style italique au texte sélectionné (entoure le texte de balises <em> </em> ).
Souligné Elément Texte Souligne le texte sélectionné (entoure le texte sélectionné avec <span style="text-decoration: underline;"> tag).
Modifier la couleur d’arrière-plan Elément Texte Permet de modifier la couleur d’arrière-plan du bloc sélectionné (ajoute style="backcolor: rgba(170, 86, 255, 0.87)).
Changer la couleur du texte Elément Texte Permet de modifier la couleur de tout le texte du bloc ou simplement le texte sélectionné dans le bloc ( <span style="color: #56ff56;"> ).
Image Bloc contenant une image Permet d’insérer une image à partir d’un fichier enregistré localement.
Supprimer Tout bloc Supprime le bloc et son contenu.
Dupliquer Tout bloc Duplique le bloc, y compris les styles qui y sont liés.

Gérer la structure et le style d'une landing page

Gérer les blocs dans l'éditeur de contenu

Les différents éléments du contenu HTML sont affichés dans la landing page sous forme de blocs, correspondant à la balise <div> </div> . Sélectionnez un bloc pour interagir avec lui. Il sera alors entouré d'une boîte bleue.
Si un bloc est sélectionné, les objets parents de l’élément HTML correspondant s’affichent dans un chemin de navigation situé au bas de la zone de modification.
Lorsque le pointeur de la souris survole l’un des éléments du chemin de navigation, l’élément concerné est mis en surbrillance. Vous pouvez donc naviguer facilement entre les différents blocs et sélectionner exactement l’élément HTML que vous souhaitez modifier.
Utilisez les options de la palette et de la barre d’outils contextuelle pour modifier, supprimer ou dupliquer le bloc.
Pour les blocs contenant du texte, cliquez de nouveau dans le bloc pour activer le mode de modification du texte. Le cadre autour du bloc devient vert. Vous pouvez ensuite sélectionner ou saisir du texte. Utilisez les options de la palette et de la barre d’outils contextuelle pour ajouter un lien ou modifier la mise en forme du texte.
Paramètres définis pour un élément d’un bloc (liens, champs de personnalisation, blocs de contenu, etc.) peut être modifiée à tout moment à partir de la palette.

Ajouter une bordure et un arrière-plan dans l'éditeur de contenu

Vous pouvez également définir une couleur d’ arrière-plan en sélectionnant une couleur dans le graphique. Cette couleur est appliquée au bloc sélectionné.
Vous pouvez ajouter une bordure au bloc sélectionné.

Changer le style du texte dans l'éditeur de contenu

Pour modifier le style du texte, vous devez cliquer à l’intérieur d’un bloc de texte.
Pour modifier l’alignement du texte, sélectionnez l’une des trois icônes suivantes dans la palette de gauche :
  • Aligner à gauche : aligne le texte à gauche du bloc sélectionné (ajoute style="text-align: left;").
  • Centre : centre le texte dans le bloc sélectionné (ajoute style="text-align: center;").
  • Aligner à droite  : aligne le texte à droite du bloc sélectionné (ajoute style="text-align: right;").
Vous pouvez également utiliser la barre d’outils pour modifier les attributs de police : adaptez la taille de la police, mettez le texte en gras ou en italique, soulignez ou modifiez la couleur du texte. Consultez cette section .

Insérer des images dans une landing page

  1. Dans le contenu d'une landing page, sélectionnez un bloc contenant une image.
  2. Sélectionnez le bouton Insérer .
  3. Sélectionnez Image locale dans la barre d'outils contextuelle.
  4. Sélectionnez un fichier.
  5. Modifiez les propriétés de l’image selon vos besoins.

Définir le contenu dynamique dans une landing page

Pour définir du contenu dynamique dans une landing page, sélectionnez un bloc à l'aide du fil d'Ariane ou en cliquant directement sur un élément.
Certains blocs, tels que les images, ne peuvent pas être sélectionnés directement. Dans ce cas, sélectionnez le bloc parent à l’aide du chemin de navigation. Vous pouvez ensuite modifier tous les éléments inclus dans cet élément parent, y compris les images. La condition sera appliquée à tous les éléments enfants du bloc parent.
Le chemin de navigation est présenté dans la section Gestion des blocs .
Les étapes suivantes pour définir le contenu dynamique dans une page d’entrée sont similaires aux étapes à suivre pour un courrier électronique. Reportez-vous à cette section .
Si un élément variante est présenté en rouge, cela signifie qu’une expression n’a pas encore été définie.
Vous pouvez naviguer entre les différents contenus dynamiques d’un bloc. Pour cela :
  1. Sélectionnez le bloc.
    Les flèches apparaissent sur les côtés droit et gauche de l’image.
  2. Cliquez sur la flèche droite pour parcourir le contenu dynamique disponible.
    Les flèches de chaque côté s’estompent selon que vous avez atteint le dernier ou le premier contenu dynamique disponible.
  3. Pour supprimer toutes les conditions appliquées à un bloc, sélectionnez celui-ci et cliquez de nouveau sur l'icône Désactiver le contenu dynamique .
  4. Sélectionnez le contenu dynamique que vous souhaitez conserver.
Dans la palette :
  • Les contenus auxquels une expression est entrée ne sont plus décrits en rouge, mais en gris.
  • Le contenu actuellement sélectionné apparaît en bleu.