Ajouter un séparateur.

Apprendre DXPR BuilderCréer des pagesAjouter du contenuDonnées et animation

Vous obtenez une ligne horizontale nette qui découpe votre page en sections claires. Utilisez-la entre du texte, des images ou d’autres éléments quand une page a besoin d’une pause visuelle.

Un séparateur violet centré, de 6 px d’épaisseur et 300 px de long, entre le titre Our services et son paragraphe

Ajouter un séparateur

Ouvrez votre page une fois la session ouverte : les commandes du constructeur apparaissent au survol de la zone de contenu. Votre première page présente les bases.

  1. Survolez la colonne et cliquez sur + dans sa barre de contrôle, ou cliquez sur Ajouter des éléments sur une page vide. Ouvrez l’onglet Contenu et cliquez sur Séparateur. Il apparaît en haut de la colonne, sans boîte de dialogue. Faites-le glisser par la poignée de sa barre de contrôle pour le déplacer.
  2. La ligne est fine : survolez donc la ligne elle-même pour afficher sa barre de contrôle. Cliquez sur Plus, choisissez Paramètres et définissez une Color.
  3. Sous Thickness, choisissez Custom thickness.
  4. Faites glisser le curseur Thickness pour définir la graisse du trait. Ici, nous utilisons 6 px.
  5. Sous Length, choisissez Custom width.
  6. Faites glisser le curseur Width pour définir la longueur du trait. Ici, nous utilisons 300 px.
  7. Réglez Align sur Center.
  8. Cliquez sur Enregistrer dans la boîte de dialogue, puis sur Enregistrer dans la barre d’outils en haut de la zone de contenu pour stocker la page.

Ce que vous voyez

Une ligne horizontale traverse la colonne, dans la couleur, l’épaisseur et la longueur choisies. Dans la vidéo, elle fait 6 px d’épaisseur, 300 px de long et est centrée. Les visiteurs la voient une fois la page enregistrée et publiée.

Configurer votre séparateur

Survolez l’élément et ouvrez Plus > Paramètres dans sa barre de contrôle. Options :

  • Color : la couleur du trait. Laissez vide pour utiliser la couleur du thème.
  • Thickness : Theme default ou Custom thickness. Custom thickness ajoute un curseur Thickness de 0 à 20 px.
  • Length : Theme default ou Custom width. Gardez Length sur Theme default pour un trait pleine largeur. Custom width ajoute un curseur Width de 0 à 500 px.
  • Align : Left, Center ou Right. N’apparaît qu’avec Custom width.

Si rien ne s’affiche

  • Le séparateur ne figure pas dans l’onglet Contenu. Votre profil d’utilisateur le masque. Demandez à un administrateur de cocher Separator sous Elements dans Profils d’utilisateurs.
  • Il a disparu après rechargement. La page n’a pas été enregistrée. Ajoutez-le de nouveau et cliquez sur Enregistrer dans la barre d’outils en haut de la zone de contenu.
  • Le séparateur est au-dessus de votre contenu. Les nouveaux éléments arrivent en haut de la colonne. Survolez le trait et faites-le glisser par sa poignée, ou ouvrez Plus > Move Down.
  • Le trait est invisible. La Color correspond à l’arrière-plan de la page. Survolez l’élément et ouvrez Plus > Paramètres, puis choisissez une couleur contrastée.
  • Le trait ne couvre pas toute la largeur. Length est réglée sur Custom width. Survolez l’élément et ouvrez Plus > Paramètres, puis remettez la Length sur Theme default.

Et ensuite ?

Onglet Style pour modifier l’espacement autour de votre séparateur.