---
url: 'https://dxpr.com/fr/hc/documentation/learn-dxpr-builder/tutorials/add-forms'
title: 'Ajouter des formulaires aux pages | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T14:23:57+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  Ici, vous placez un formulaire d’inscription à côté de votre
  message dans une section. Le formulaire est un bloc Drupal, donc vous
  pouvez placer ainsi tout webform ouvert. Utilisez cette page pour un
  formulaire dans une page existante. Pour une page complète avec adresse,
  carte et horaires d’ouverture, suivez
  Créer une page de contact.
  La vidéo construit une inscription à la lettre d’information pour une
  clinique.
tags:
  - 'Follow a tutorial'
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 des formulaires aux pages'
      description: |-
        Ici, vous placez un formulaire d’inscription à côté de votre
        message dans une section. Le formulaire est un bloc Drupal, donc vous
        pouvez placer ainsi tout webform ouvert. Utilisez cette page pour un
        formulaire dans une page existante. Pour une page complète avec adresse,
        carte et horaires d’ouverture, suivez
        Créer une page de contact.
        La vidéo construit une inscription à la lettre d’information pour une
        clinique.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T14:23:57+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/learn-dxpr-builder/tutorials/add-forms'
      articleSection: 'Suivre un tutoriel'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/fr/hc/documentation/learn-dxpr-builder/tutorials/add-forms'
      description: |-
        Ici, vous placez un formulaire d’inscription à côté de votre
        message dans une section. Le formulaire est un bloc Drupal, donc vous
        pouvez placer ainsi tout webform ouvert. Utilisez cette page pour un
        formulaire dans une page existante. Pour une page complète avec adresse,
        carte et horaires d’ouverture, suivez
        Créer une page de contact.
        La vidéo construit une inscription à la lettre d’information pour une
        clinique.
      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) /[Suivre un tutoriel](/fr/hc/documentation/learn-dxpr-builder/tutorials/overview) # Ajouter des formulaires aux pages.

 Apprendre DXPR BuilderCréer des pagesSuivre un tutoriel

   ## Dans ce guide

 Guides associés

- [Créer une page de contact](/fr/hc/documentation/apprendre-dxpr-builder/tutoriels/page-de-contact)
- [Ajouter un bloc Drupal à votre page](/fr/hc/documentation/apprendre-dxpr-builder/integrations/blocs-drupal)

Ici, vous placez un formulaire d’inscription à côté de votre message dans une section. Le formulaire est un bloc Drupal, donc vous pouvez placer ainsi tout webform ouvert. Utilisez cette page pour un formulaire dans une page existante. Pour une page complète avec adresse, carte et horaires d’ouverture, suivez [Créer une page de contact](/fr/hc/documentation/apprendre-dxpr-builder/tutoriels/page-de-contact).

La vidéo construit une inscription à la lettre d’information pour une clinique.

  ## Avant de commencer

- Votre rôle a la permission **Edit with DXPR Builder**.
- Le formulaire existe, par exemple comme webform créé avec le module Webform.
- La page est ouverte dans le builder. Pour une nouvelle, accédez à **Content** > **Add content** > **Landing Page**(`/node/add/landing_page`) et cliquez sur **Save**.

## Étape 1 : ajouter une section teintée

1. Cliquez sur **Ajouter des éléments** sur la page vide et choisissez **Section** depuis l’onglet **Mise en page**.
2. Survolez la section et ouvrez **Plus** > **Paramètres**. Ouvrez le panneau **Style**, choisissez un **Background** gris clair et cliquez sur **Save**.

## Étape 2 : ajouter deux colonnes

1. Cliquez sur **+** sur la section et choisissez **Ligne**. Une nouvelle ligne arrive avec deux colonnes égales, la division voulue ici.

## Étape 3 : rédiger le message d’inscription

1. Cliquez sur **+** dans la colonne gauche et choisissez **Texte**depuis l’onglet **Contenu**.
2. Tapez « Get health tips by email » et réglez-le sur **Heading 2**depuis la barre d’outils.
3. Ajoutez une ligne sur ce que les abonnés reçoivent et à quelle fréquence, puis cliquez sur **Save**.

## Étape 4 : insérer le formulaire

1. Cliquez sur **+** dans la colonne droite.
2. Ouvrez l’onglet **Drupal Blocks**.
3. Choisissez le bloc de votre formulaire et cliquez sur **Save** dans sa boîte de dialogue de réglages. Le formulaire s’affiche dans la colonne.

## Étape 5 : enregistrer et prévisualiser

1. Cliquez sur **Save** dans la barre d’outils du builder.
2. Ouvrez le menu d’affichage (l’**icône en forme d’œil**) et choisissez **Preview** pour voir le message à côté du formulaire.

## D’où viennent les formulaires

Non montré dans la vidéo :

- **Module Webform** : chaque webform ouvert est listé dans l’onglet **Drupal Blocks** comme « Block: DXPR builder: Webform: » suivi de son nom. Tapez le nom dans **Search**, ou choisissez **DXPR builder** sous **Filter by category**.
- **Module Contact du cœur** : ses formulaires sous **Structure** > **Contact forms** n’ont pas de bloc à eux. Le module contribué Contact Block ajoute un **Contact block** au même onglet.

## Styliser les formulaires

Non montré dans la vidéo. Les formulaires prennent les styles de votre thème. Pour les changer :

- Ajoutez des classes sous **HTML classes** dans le panneau **General** du bloc, et stylisez ces classes dans votre thème.
- Réglez la marge et le remplissage autour du formulaire dans le panneau **Style** du bloc.

## Ce que vous voyez

La bande grise contient votre titre et une ligne de texte à gauche et le formulaire à droite. En prévisualisation, le formulaire fonctionne comme pour les visiteurs, et les envois vont aux gestionnaires propres du formulaire. Choisissez **Edit** dans le menu en forme d’œil pour continuer.

## Si vous ne voyez pas le formulaire

- **Votre webform manque dans l’onglet Drupal Blocks.** Le builder ne liste que les webforms ouverts. Accédez à **Structure** > **Webforms**(`/admin/structure/webform`) et réglez le statut du formulaire sur **Open**.
- **L’onglet Drupal Blocks manque ou est vide.** Le builder ne liste de blocs que quand le module **Block Content** du cœur est activé. Activez-le sous **Extend** (`/admin/modules`).
- **Les visiteurs voient une colonne vide où devrait être le formulaire.**Le bloc cache un webform aux personnes qui ne peuvent pas l’envoyer. Autorisez leur rôle à créer des envois dans les réglages **Access** du webform.
- **Vos changements ont disparu après un rechargement.** Vous avez quitté la page avant de cliquer sur **Save** dans la barre d’outils du builder. Si Save affiche une erreur, voir [Les modifications ne s’enregistrent pas](/fr/hc/documentation/apprendre-dxpr-builder/depannage/enregistrement-echoue).

## Et ensuite ?

- [Créer une page de contact](/fr/hc/documentation/apprendre-dxpr-builder/tutoriels/page-de-contact) pour une page complète avec formulaire, carte et horaires
- [Blocs Drupal](/fr/hc/documentation/apprendre-dxpr-builder/integrations/blocs-drupal) pour chaque bloc à placer dans une page