Landing pages - Partie 2 : Définir la structure de votre landing page

Votre landing page est composée de sections, de lignes, de colonnes et d’éléments. Cet article vous aide à comprendre la structure d’une landing page. Découvrez comment ajouter, déplacer, dupliquer ou supprimer des éléments. 

Nous avons créé une série d’articles pour vous aider à créer des landing pages. 

💡 Bon à savoir
Les landing pages sont disponibles avec les forfaits Premium et Entreprise.

Cet article aborde les points suivants :

Mise en page de votre landing page

Découvrons la structure des landing pages créées à l’aide de notre éditeur. Une landing page est composée des éléments suivants :

Section > Lignes > Colonnes > Éléments

Sections

Chaque page comprend des sections, ce qui permet une plus grande souplesse et facilité d’utilisation. Par exemple, votre landing page peut contenir une section Entête, une section Corps et une section Pied-de-page.

Vous pouvez ajouter deux types de sections à votre page :

  1. Cliquez sur Add a Blank Section pour une personnalisation complète à partir de zéro.
  2. Nous vous proposons également des sections préconçues que vous pouvez ajouter à votre landing page.

LC_sections_FR.png

Vous pouvez renommer chaque section pour encore plus de clarté lorsque vous créez votre landing page. Pour ce faire, il vous suffit de cliquer sur la section et de remplir le champ Nommer cette section dans le panneau de droite.

Vous pouvez également nommer une section sous Sections > Section X > ⚙️. La section à modifier s’affiche sur la droite.

Lignes et colonnes

Chaque section contient des lignes qui peuvent être divisées en plusieurs colonnes

À l’intérieur des colonnes, vous pouvez ajouter des Éléments tels que du texte, une image, un bouton, un séparateur, une forme, une icône, une vidéo, un logo et un code HTML. Pour en savoir plus, consultez notre guide détaillé consacré à l’éditeur de pages et aux éléments.

Voici un résumé de la structure, de la mise en page aux sections, aux lignes et aux colonnes :

2020-11-06_16-30-15__1_.gif

Ajouter une section, une colonne ou une ligne

Plusieurs possibilités s’offrent à vous pour ajouter des lignes ou des sections. Vous pouvez les ajouter directement dans votre design ou via le panneau de gauche (sous Sections ou Mise en page).

Ajouter une section ou une ligne directement dans le design

  1. Passez la souris sur une section.
  2. En bas de la section figure un bouton AJOUTER UNE LIGNE OU UNE SECTION.
  3. Cliquez sur ce bouton, puis sur AJOUTER UNE LIGNE ou AJOUTER UNE SECTION.
    LP_ajoutersectionligne_FR.png
  4. Pour les lignes : choisissez une disposition pour votre nouvelle ligne (jusqu’à quatre colonnes).
  5. Pour les sections : le panneau de gauche s’ouvre, vous permettant d’ajouter une section vierge ou une section préconçue dans la liste. 
    Les sections peuvent également être directement ajoutées à partir du panneau Sections sur la gauche. Elles seront alors ajoutées juste au-dessus du pied-de-page ou à la fin de votre design si vous l’avez conçu de zéro.
  6. C’est tout !

Cette méthode ne vous permet pas d’ajouter des colonnes. Veuillez consulter la section suivante pour savoir comment ajouter des colonnes.

Ajouter une section, une colonne ou une ligne à partir du panneau de mise en page

Vous pouvez également ajouter des sections ou des lignes directement à partir du panneau Mise en page lorsque vous naviguez dans la structure. À chaque étape s’affiche à un bouton + Ajouter une section, + Ajouter une colonne ou + Ajouter une ligne

LP_ajoutersectionlignecolonne_FR.png

Déplacer des sections, des lignes, des colonnes et des éléments

Maintenant que vous savez ajouter des sections, des lignes et des colonnes, vous souhaitez peut-être les réorganiser dans votre design. Pour déplacer des éléments, accédez au panneau de mise en page.

Vous pouvez alors simplement faire glisser les différents éléments. Voici un exemple avec les éléments d’une colonne :

LP_organisation_FR.gif

💡 Bon à savoir
Si vous n’êtes pas certain de la section, de la ligne, de la colonne ou de l’élément que vous déplacez, gardez à l’esprit que le bloc correspondant s’anime dans votre design à chaque fois que vous passez la souris sur l’élément dans la liste.

Dupliquer ou supprimer des sections, des lignes, des colonnes et des éléments

Chaque élément de votre landing page peut être dupliqué.

  • Vous pouvez dupliquer des sections, des lignes, des colonnes et des éléments à partir du panneau Mise en page. Pour ce faire, cliquez sur l’icône Dupliquer lorsque vous passez la souris sur l’élément.
  • Vous pouvez aussi dupliquer une section ou un élément à partir du panneau d’édition sur la droite lorsque vous cliquez sur la section ou l’élément. L’option Dupliquer se trouve dans l’angle inférieur droit.

LP_duplicate_FR.png

Ajouter une page

Pour ajouter une nouvelle page, cliquez sur l’onglet Pages dans le menu de gauche, puis sur le bouton + Create a blank page. Cliquez ici pour en savoir plus sur les pages.

⏩ Et après ?

🤔 Vous avez des questions ?

Pour toute question, n’hésitez pas à contacter notre service client en créant un ticket à partir de votre compte. Si vous n’avez pas encore de compte, vous pouvez nous contacter ici.