Ajouter un bouton à l’aide de l’éditeur de contenu enrichi

  • Rversion finale: Washingtondc
  • Mis à jour 1 févr. 2024
  • 7 minutes de lecture

    • Ajoutez un bouton pour déclencher des actions ou rediriger les utilisateurs vers d’autres contenus.

    Avant de commencer

    Rôle requis : sn_cd.content_manager

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

    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 .
    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 .
    4. Utilisez l’un des paramètres de style suivants :
      Champ de 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

      La sélection d’un type de bouton est extraite des paramètres de thème de votre portail afin de se synchroniser avec celui-ci. Pour plus d'informations, consultez Configuration du portail.
      Taille du bouton Définit la taille de votre bouton.

      La sélection d’une taille de bouton est extraite des paramètres de thème de votre portail afin de se synchroniser avec celui-ci. Pour plus d'informations, consultez Configuration du portail.

      Les choix possibles sont les suivants :
      • Très petit
      • Petit
      • Moyen (par défaut)
      • Large
      Affichage Configurez l’apparence de plusieurs composants dans la même colonne, tels qu’un composant d’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 s’affiche avec l’autre composant à côté.
      Remarque :
      Pour de meilleurs résultats, réglez le même affichage pour les composants. Par exemple, si vous avez une image et des composants de texte dans une colonne et que vous souhaitez que l’image s’affiche à gauche et le texte à droite, définissez les paramètres d’affichage des deux composants sur Côte à côte.
      Alignement horizontal Définit l’alignement des boutons. Choisissez entre la gauche, le centre ou la droite.
      Application de style avancée
      Couleur du bouton Changez la couleur de votre bouton.
      1. Entrez le code 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, consultez 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 vers le haut et vers le 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 saisir un numéro ou utiliser 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 l’unique flèche vers le bas à 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 menus déroulants 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 l’unique 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 l’unique 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 l’unique 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 l’apparence en gras ou en clair de votre texte.

      Cliquez sur la flèche de la liste déroulante pour sélectionner un poids différent.
      Hauteur de ligne Définit la distance verticale entre deux lignes de texte.
      Couleur de la police Remplace la couleur de police de votre thème de portail.

      Pour sélectionner une couleur, entrez le code hex 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 : en sélectionnant le bouton, le contenu s’ouvre dans la même fenêtre que celle que vous avez affichée.
      • Nouvelle fenêtre : lorsque vous sélectionnez le bouton, le contenu s’ouvre dans une nouvelle fenêtre.
    5. Sélectionnez Enregistrer ou Enregistrer et terminer.
      Si vous sélectionnez Enregistrer , votre contenu est enregistré et vous restez sur le canevas de l’éditeur de contenu enrichi . Si vous sélectionnez Enregistrer et terminer , votre enregistrement est enregistré et vous renvoie au formulaire Nouveau contenu .

    Que faire ensuite

    • Prévisualisez votre contenu à partir du formulaire Nouveau contenu.
      Remarque :
      L’aperçu du contenu vous donne une idée générale de l’apparence de votre contenu. Le contenu peut sembler différent une fois publié en raison de variations dans la résolution de l’appareil, la différence de thème ou la configuration du style de l’application mobile.
    • (Facultatif) Traduisez votre contenu.

      Sélectionnez une autre langue pour afficher votre session ou demander une traduction pour le contenu que vous créez. Pour plus d'informations, consultez Prise en charge de la langue pour Expériences de contenu et Publication de contenu.

      Utilisez le menu déroulant Paramètres de langue pour sélectionner une autre langue dans laquelle afficher votre session ou demander une traduction pour le contenu que vous créez.
      • Changer de langue : Cela vous permet de remplacer la langue des paramètres de votre système par une autre langue. Le processus ressemble à celui permettant de modifier votre langue lors de la connexion. Pour plus d'informations, consultez Changer de langue pour Publication de contenu.
      • Traduire le contenu : lorsque vous activez la propriété système sn_cd.enable_localization_framework_integration, le contenu créé à partir de la bibliothèque de contenu affiche la sélection Traduire le contenu dans la liste déroulante Paramètres de langue . Cela vous permet de demander la traduction du contenu dans la langue que vous avez sélectionnée. Pour plus d'informations, consultez Intégration à Infrastructure de localisation.
        Remarque :
        Traduisez le contenu uniquement une fois que vous avez terminé de le modifier. Pour de meilleurs résultats, nous vous déconseillons d’ajouter ou de supprimer des composants, ni de modifier le formatage après la traduction.

        Pour créer du contenu riche dont la mise en forme varie selon la langue, dupliquez le contenu et modifiez la mise en forme selon vos besoins. Ensuite, utilisez les audiences pour cibler les utilisateurs de contenu par langue. Reportez-vous à la rubrique Audiences.

    • Configurez un plan de publication pour contrôler l’endroit où le contenu est fourni, l’audience et la période pendant laquelle il est disponible : Créer un plan de publication pour votre contenu.