Ajouter un bouton avec l’éditeur de contenu enrichi

  • Rversion finale: Yokohama
  • Mis à jour 30 janv. 2025
  • 6 minutes de lecture
  • Ajoutez un bouton pour déclencher des actions ou rediriger les utilisateurs vers un contenu différent.

    Avant de commencer

    Rôle requis : sn_cd.content_manager

    Renseignez les champs du formulaire Nouveau contenu. Reportez-vous à la rubrique Créer du contenu enrichi.

    Créez la mise en page à l’aide de modules ou de colonnes.

    Procédure

    1. Accédez au canevas en sélectionnant le bouton Ouvrir l’éditeur dans l’onglet Conception du formulaire Nouveau contenu .
      Ouvrir l’éditeur de contenu enrichi à partir de l’onglet Conception
    2. Dans le canevas de l’éditeur de contenu enrichi , vous pouvez utiliser une méthode de glisser-déposer pour ajouter un bouton.
    3. Accédez à l’onglet Paramètres .
      L’onglet Paramètres sur le côté du canevas a des configurations de style
    4. Utilisez l’un des paramètres de style suivants :
      Tableau 1. Paramètres de style
      Champ Paramètres Description
      Application d'un style
      Type de bouton Définit le type de bouton que vous ajoutez. Les choix possibles sont les suivants :
      • Primaire (par défaut)
      • Secondaire
      • Lien uniquement
      Taille du bouton Définit la taille de votre bouton. Les choix possibles sont les suivants :
      • Très petit
      • Petit
      • Moyen (par défaut)
      • Grand
      Affichage Configurez l’apparence de plusieurs composants dans la même colonne, tels qu’une image et un composant de texte. Sélectionnez une option parmi les suivantes :
      • Haut et bas (par défaut) : l’image apparaît au-dessus de l’autre composant.
      • Côte à côte : l’image apparaît avec l’autre composant à côté.
      Remarque :
      Pour de meilleurs résultats, définissez le même affichage pour les composants. Par exemple, si vous avez des composants d’image et de texte dans une colonne et que vous souhaitez que l’image apparaisse à gauche et le texte à droite, modifiez les paramètres d’affichage des deux composants sur Côte à côte.
      Alignement horizontal Définit l’alignement du bouton. Choisissez entre gauche, centre ou droite.
      Application de style avancée
      Couleur du bouton Changez la couleur de votre bouton.
      1. Entrez le code de couleur qui représente la couleur d’arrière-plan que vous souhaitez afficher.
        Remarque :
        Toutes les couleurs HTML sont prises en charge. Pour plus d’informations, voir Noms des couleurs HTML.
      2. Vous pouvez également sélectionner le sélecteur de couleurs (carré gris) à droite du champ Couleur d’arrière-plan .
      3. Cliquez dans la palette de couleurs qui s’affiche.
      4. Après avoir sélectionné une couleur dans la palette de couleurs, utilisez la barre de défilement sur le côté droit pour affiner votre couleur.
      5. Faites glisser la barre de haut en bas.
      6. Utilisez la barre de défilement inférieure pour éclaircir ou assombrir votre couleur.
      Largeur

      Hauteur

      Ajustez la largeur et la hauteur d’un bouton en le sélectionnant et en utilisant les listes déroulantes Largeur et Hauteur pour entrer un numéro ou utilisez les flèches vers le haut et vers le bas.
      Vous pouvez également choisir l’unité de mesure que vous préférez en sélectionnant la touche de flèche vers le bas unique à gauche des flèches vers le haut et vers le bas. Les choix possibles sont les suivants :
      • auto : la taille est basée sur le contenu de l’onglet. Si vous saisissez du texte supplémentaire dans l’onglet, la largeur augmente automatiquement.
      • px : Utilisez les pixels comme mesure.
      • % : utilisez un pourcentage comme mesure.
      Marge Ajustez les marges ou l’espace à l’extérieur et autour du bouton.

      Utilisez les listes déroulantes sous la section Marge pour ajuster les marges en haut, en bas, à droite et à gauche. Tout comme la largeur et la hauteur, vous pouvez choisir l’unité de mesure que vous préférez en sélectionnant la touche de flèche vers le bas à gauche des flèches vers le haut et vers le bas.

      Bordure Modifiez la bordure autour de l’extérieur du bouton.
      Remarque :
      La bordure est le contour autour du bouton.

      Largeur : utilisez les flèches vers le haut et vers le bas pour ajuster la largeur de la bordure. Tout comme la largeur et la hauteur, vous pouvez choisir l’unité de mesure que vous préférez en sélectionnant la touche de flèche vers le bas à gauche des flèches vers le haut et vers le bas.

      Style : format de la bordure autour du bouton. Sélectionnez la liste déroulante pour sélectionner le type de bordure que vous souhaitez autour du bouton.

      Couleur : la couleur de la bordure autour de votre bouton. Sélectionnez la couleur de votre bouton à l’aide de la palette de couleurs et des barres de défilement, de la même manière que vous sélectionnez votre couleur d’arrière-plan.

      Rayon de la bordure Utilisez les flèches vers le haut et vers le bas pour ajuster le rayon de la bordure. Tout comme la largeur et la hauteur, vous pouvez choisir l’unité de mesure que vous préférez en sélectionnant la touche de flèche vers le bas à gauche des flèches vers le haut et vers le bas.
      Nom de la police Définit la police utilisée pour restituer les caractères.

      Cliquez sur la flèche déroulante pour sélectionner une autre police.

      Taille de police Définit la taille de la police.
      Valeur font-weight Détermine le gras ou la clarté de votre texte.

      Cliquez sur la flèche déroulante pour sélectionner une autre pondération.

      Hauteur de ligne Définit la distance verticale entre deux lignes de texte.
      Couleur de la police Remplace la couleur de police du thème de votre portail.

      Pour sélectionner une couleur, entrez le code hexadécimal ou cliquez sur le sélecteur de couleurs (carré gris à droite de la couleur de police) et sélectionnez une couleur dans la palette de couleurs.

      Propriétés
      Étiquette de bouton Texte qui apparaît sur le bouton.
      Titre Texte qui s’affiche lorsqu’un utilisateur survole le bouton.
      URL Emplacement d’une page Web ou d’un contenu. Entrez l’adresse URL complète que vous ciblez lorsqu’un utilisateur sélectionne le bouton.
      Cible Indique où le bouton dirige l’utilisateur. Les choix possibles sont les suivants :
      • Cette fenêtre : la sélection du bouton ouvre le contenu dans la même fenêtre que celle que vous avez affichée.
      • Nouvelle fenêtre : la sélection du bouton ouvre le contenu dans une nouvelle fenêtre.
    5. Sélectionnez Enregistrer ou Enregistrer et terminer.
      La sélection de l’option Enregistrer enregistre votre contenu et vous restez sur le canevas de l’éditeur de contenu enrichi . Sélectionner Enregistrer et terminer enregistre votre enregistrement et vous renvoie au formulaire Nouveau contenu.

    Que faire ensuite

    • (Facultatif) Traduisez votre contenu.

      Demandez une traduction pour votre contenu. Pour plus d'informations, consultez Prise en charge multilingue dans la bibliothèque de contenu.

      Remarque :
      Ne traduisez le contenu qu’une fois que vous avez modifié le contenu. Pour de meilleurs résultats, nous vous déconseillons d’ajouter ou de supprimer des composants ou de modifier la mise en forme après la traduction.

      Pour créer du contenu enrichi qui est formaté différemment dans différentes langues, dupliquez le contenu et modifiez la mise en forme selon vos besoins. Ensuite, utilisez Audiences pour cibler le contenu sur les utilisateurs par langue. Reportez-vous à la rubrique Audiences.

    • Prévisualisez votre contenu à partir de l’onglet Publier .
      Remarque :
      L’aperçu du contenu est conçu pour donner une idée générale de l’apparence de votre contenu. Le contenu peut sembler différent après publication en raison de variations dans la résolution de l’appareil, la différence de thème ou la configuration du style d’application mobile.
    • Configurez un plan de publication pour contrôler où le contenu est livré, l’audience et la période pendant laquelle il est disponible : Créer un plan de publication pour votre contenu.