--- url: 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/elements/bouton' title: 'Ajouter un bouton | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T14:41:19+00:00' updated: '2026-10-24T17:19:22+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: 'Vous obtenez un bouton d’appel à l’action clair, qui envoie vos visiteurs où vous le souhaitez. Utilisez-le pour mener vers un formulaire d’inscription, une page produit ou une page de contact.' 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 bouton' description: 'Vous obtenez un bouton d’appel à l’action clair, qui envoie vos visiteurs où vous le souhaitez. Utilisez-le pour mener vers un formulaire d’inscription, une page produit ou une page de contact.' 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:19+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/bouton' articleSection: Marketing - '@type': WebPage '@id': 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/elements/bouton' description: 'Vous obtenez un bouton d’appel à l’action clair, qui envoie vos visiteurs où vous le souhaitez. Utilisez-le pour mener vers un formulaire d’inscription, une page produit ou une page de contact.' 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 bouton. 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 un bouton d’appel à l’action clair, qui envoie vos visiteurs où vous le souhaitez. Utilisez-le pour mener vers un formulaire d’inscription, une page produit ou une page de contact. ## Ajouter un bouton 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 **Bouton**. Il apparaît en haut de la colonne et sa boîte de dialogue de paramètres s’ouvre. 2. Remplacez le texte par défaut dans **Title** par le libellé de votre bouton. 3. Saisissez la destination dans **Link**, par exemple `/contact` ou `https://example.com`. 4. Choisissez une couleur sous **Type**. Ici, nous choisissons **Success**. 5. Choisissez la **Size**. Ici, nous choisissons **Large**. 6. 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 Un bouton portant le libellé que vous avez saisi apparaît en haut de la colonne. Dans la vidéo, il est grand et vert et affiche Register for Open Day. Les liens ne s’ouvrent pas pendant la modification. Pour tester le vôtre, enregistrez la page, choisissez **Aperçu** dans le menu d’affichage de la barre d’outils, puis cliquez sur le bouton. Les visiteurs le voient une fois la page enregistrée et publiée. ## Configurer votre bouton Survolez l’élément et ouvrez **Plus > Paramètres** dans sa barre de contrôle. Options : - **Title :** le texte du bouton. - **Link :** la destination du bouton : un chemin de votre site, par exemple `/contact`, ou une URL complète. - **Link target :** ouvre le lien dans la même fenêtre (Same window) ou dans une nouvelle fenêtre (New window). Elle n’apparaît qu’une fois que **Link** a une valeur. - **Type :** le style de couleur : Primary, Secondary, Success, Info, Warning, Danger, Link, Light ou Dark. - **Block button :** étire le bouton sur toute la largeur de la colonne. - **Outline style :** affiche une bordure et un texte colorés, sans remplissage. Le type Link n’a pas de contour et ressemble toujours à un lien texte. - **Size :** Normal, Large ou Small. ## Si rien ne s’affiche - **Le bouton ne figure pas dans l’onglet Contenu.** Votre profil d’utilisateur le masque. Demandez à un administrateur de l’activer 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. - **Un clic mène à « page introuvable ».** Le chemin du **Link** est faux. Les chemins de votre site commencent par `/`, par exemple `/contact`. Survolez l’élément et ouvrez **Plus > Paramètres** pour le corriger. - **Le bouton est différent de celui de la vidéo.** Son aspect vient de **Type**, **Outline style**, **Block button** et **Size**. Survolez l’élément et ouvrez **Plus > Paramètres** pour les vérifier. - **Le lien s’ouvre dans le même onglet.** **Link target** est sur Same window. Renseignez d’abord **Link**, puis choisissez New window. ## 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 votre bouton.