---
url: 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/elements/liens-sociaux'
title: 'Ajouter un élément de liens sociaux | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T14:42:06+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'Vous obtenez une rangée d’icônes de marques qui mènent vers vos profils de médias sociaux. Utilisez-la dans un pied de page, une barre latérale ou une section de contact pour que les visiteurs vous trouvent et vous suivent.'
tags:
  - Marketing
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 élément de liens sociaux'
      description: 'Vous obtenez une rangée d’icônes de marques qui mènent vers vos profils de médias sociaux. Utilisez-la dans un pied de page, une barre latérale ou une section de contact pour que les visiteurs vous trouvent et vous suivent.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T14:42:06+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/liens-sociaux'
      articleSection: Marketing
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/elements/liens-sociaux'
      description: 'Vous obtenez une rangée d’icônes de marques qui mènent vers vos profils de médias sociaux. Utilisez-la dans un pied de page, une barre latérale ou une section de contact pour que les visiteurs vous trouvent et vous suivent.'
      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) /[Marketing](/fr/hc/documentation/learn-dxpr-builder/elements/marketing) # Ajouter un élément de liens sociaux.

 Apprendre DXPR BuilderCréer des pagesAjouter du contenuMarketing

   ## 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 rangée d’icônes de marques qui mènent vers vos profils de médias sociaux. Utilisez-la dans un pied de page, une barre latérale ou une section de contact pour que les visiteurs vous trouvent et vous suivent.

## Ajouter un élément de liens sociaux

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 **Liens sociaux**. L’élément apparaît en haut de la colonne et sa boîte de dialogue de paramètres s’ouvre.
2. Sous **Social links**, remplacez les deux lignes d’exemple par vos comptes. Cliquez sur **Add link** pour chaque compte supplémentaire. Commencez à saisir la marque, choisissez-la dans les suggestions et saisissez l’URL, par exemple `https://github.com/dxpr`.
3. Choisissez un **Style** pour la forme des icônes. C’est le champ près du haut de la boîte de dialogue, pas le panneau Style plus bas. Ici, c’est **Circle**.
4. Choisissez une **Size** pour les icônes. Ici, c’est **3x**.
5. Cliquez sur le titre **Icon colors** pour le déplier, et réglez **Background color** sur **Brand color**.
6. Sous **Color**, choisissez une nuance dans la palette. La palette s’affiche parce que **Color** est réglé sur **Custom** par défaut. Ici, elle est presque blanche.
7. 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

Les comptes ajoutés apparaissent comme une rangée d’icônes, et chaque icône ouvre son profil. Dans la vidéo, LinkedIn, GitHub et Drupal s’affichent comme de grands cercles aux couleurs de leurs marques avec des logos blancs. Les visiteurs les voient une fois la page enregistrée et publiée.

## Configurer vos liens sociaux

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

- **Social links :** une ligne par icône, avec un nom de marque et l’URL du profil. Cliquez sur Add link pour une autre ligne, et utilisez les flèches pour changer l’ordre.
- **Layout :** Inline place les icônes en rangée. Stacked place chaque icône sur sa propre ligne.
- **Style :** la forme des icônes : None, Rounded, Circle ou Square.
- **Size :** Small, Large, ou 2x à 5x.
- **CSS3 hover effects :** None, Disc ou Pulse. Tout effet transforme l’icône en cercle.
- **Color :** la couleur des logos : Brand color, Custom ou Inherit. Custom affiche une palette, et Inherit utilise la couleur du texte autour.
- **Background color :** le remplissage de la forme, avec les mêmes trois choix.

**Color** et **Background color** se trouvent sous le titre **Icon colors**. Cliquez dessus pour les ouvrir.

## Si rien ne s’affiche

- **Les liens sociaux ne figurent pas dans l’onglet Contenu.** Votre profil d’utilisateur les masque. Demandez à un administrateur de les activer dans [Profils d’utilisateurs](/fr/hc/documentation/learn-dxpr-builder/admin/user-profiles-admin).
- **Ils ont disparu après rechargement.** La page n’a pas été enregistrée. Ajoutez-les de nouveau et cliquez sur **Enregistrer** dans la barre d’outils en haut de la zone de contenu.
- **Une icône manque.** Sa ligne n’a ni marque ni URL, l’élément l’ignore donc. Renseignez les deux champs de cette ligne.
- **Une forme s’affiche sans logo.** Le nom de marque n’a pas d’icône correspondante, et la ligne dit « No matching brand icon found ». Choisissez la marque dans les suggestions pendant la saisie.
- **Une icône ouvre la mauvaise page.** L’URL de cette ligne est fausse ou incomplète. Survolez l’élément et ouvrez **Plus &gt; Paramètres**, puis vérifiez que chaque URL commence par `https://`.

## Et ensuite ?

[Onglet Style](/fr/hc/documentation/apprendre-dxpr-builder/parametres-des-elements/onglet-style) pour modifier l’espacement et l’arrière-plan de vos liens sociaux.