---
url: 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/elements/separateur'
title: 'Ajouter un séparateur | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T14:41:31+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: '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.'
tags:
  - 'Data and motion'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T17:19:22+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Ajouter un séparateur'
      description: '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.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T14:41:31+0000'
      dateModified: '2026-10-24T17:19:22+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/elements/separateur'
      articleSection: 'Données et animation'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/elements/separateur'
      description: '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.'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Accueil
            item: 'https://dxpr.com/fr'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: fr
---
[Centre d’aide](/fr/hc)/[Documentation](/fr/hc/documentation) /[Apprendre DXPR Builder](/fr/hc/documentation/learn-dxpr-builder) /[Créer des pages](/fr/hc/documentation/learn-dxpr-builder/build) /[Ajouter du contenu](/fr/hc/documentation/learn-dxpr-builder/elements) /[Données et animation](/fr/hc/documentation/learn-dxpr-builder/elements/data-and-motion) # Ajouter un séparateur.

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

   ## Dans ce guide

 Guides associés

- [Modifier l’aspect d’un élément dans le panneau Style](/fr/hc/documentation/apprendre-dxpr-builder/parametres-des-elements/onglet-style)

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.

## 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](/fr/hc/documentation/apprendre-dxpr-builder/demarrage/premiere-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](/fr/hc/documentation/learn-dxpr-builder/admin/user-profiles-admin).
- **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](/fr/hc/documentation/apprendre-dxpr-builder/parametres-des-elements/onglet-style) pour modifier l’espacement autour de votre séparateur.