Utiliser l'outil de création de landing page

Vue d’ensemble

Ce tutoriel vous aide à utiliser l'outil de création pour réaliser votre propre landing page.

Avant tout, prenez le temps de lire ce guide : Qu'est-ce qu'une landing page ?

Bon à savoir : les landing pages sont disponibles pour les offres Premium et supérieures.

Modifier les paramètres

Les paramètres de largeur de la page peuvent être modifiés à l'étape 1 : configuration de votre landing page, sous Paramètres optionnels (Optional settings).

Pour mieux comprendre la structure d'une page, référez-vous à l'étape 2 : conception de votre landing page.

L'onglet Gérer la présentation (Manage Layout) vous permet de parcourir les différentes sections, lignes et colonnes. Pour en modifier les paramètres, consultez notre guide Modifier les paramètres des éléments d'une landing page.

Bon à savoir : pour passer rapidement d'un élément à un autre, maintenez appuyée la touche Shift de votre clavier et (en même temps) cliquez sur l'élément que vous souhaitez modifier.

Ajouter un nouvel élément

Ajouter une page

Pour ajouter une nouvelle page, dans le menu de gauche, cliquez sur l'onglet Gérer les pages (Manage pages), puis sur le bouton + CRÉER UNE PAGE VIERGE (CREATE A BLANK PAGE).

Ajouter une section

Pour ajouter une nouvelle section, trois possibilités s'offrent à vous :

  1. Dans le menu de gauche, cliquez sur l'onglet Ajouter des sections (Add sections), puis sur le bouton + AJOUTER UNE SECTION (ADD SECTION).
  2. Si votre souris se trouve sur une section, vous pouvez aussi cliquer sur le bouton AJOUTER UNE LIGNE OU UNE SECTION (ADD ROW OR SECTION) en dessous, puis sur AJOUTER UNE SECTION (ADD SECTION). Sur la gauche, le menu permettant d'ajouter une section s'affiche alors.
  3. Une autre solution pour ajouter une nouvelle section consiste à cliquer sur le bouton + AJOUTER UNE SECTION (ADD SECTION) à partir de l'onglet Gérer la présentation (Manage Layout).

Choisissez l’une des deux solutions suivantes :

  • Ajouter une section vierge
  • Ajouter une section prédéfinie. Vous pouvez utiliser la liste déroulante pour filtrer par type (tous, couvertures, en-têtes, formulaires, fonctionnalités, call-to-action, témoignages).

Ajouter une ligne

Pour ajouter une nouvelle ligne, passez votre souris sur la section. Un bouton AJOUTER UNE LIGNE OU UNE SECTION (ADD ROW OR SECTION) se trouve en dessous. Cliquez dessus, puis sur AJOUTER UNE LIGNE (ADD ROW).

Choisissez le nombre de colonnes dans votre nouvelle ligne (entre une et quatre).

Ajouter un élément

Cliquez sur l'onglet AJOUTER DES ÉLÉMENTS (ADD ELEMENTS). Ensuite, faites simplement glisser un élément dans le projet.

Les éléments disponibles sont listés ci-dessous. Suivez ce lien pour consulter un guide détaillé sur comment modifier les paramètres d'un élément.

 

  • Texte : saisissez simplement votre texte, que vous pourrez ensuite modifier en accédant aux onglets « Typographie » et « Espacement » (« Spacing »).
  • Image : vous pouvez ajouter des images à votre landing page en ajoutant une URL, en important une image ou en sélectionnant une image à partir de la galerie. Vous pouvez modifier l'image dans les onglets « Image », « Style », « Espacement » (« Spacing ») et « Alignement ».
  • Bouton : vous pouvez ajouter un bouton CTA et personnaliser le texte du bouton. Vous pouvez choisir de relier le bouton à une URL, de l'ancrer à une section ou de le relier vers une page de ce funnel. La couleur, le style, l'espacement et l'alignement du bouton peuvent être modifiés.
  • Séparateur (Divider) : vous pouvez ajouter un séparateur horizontal.
  • Formulaire (Form) : pour ajouter un formulaire, suivez ce tutoriel.
  • Icône : choisissez et modifiez une icône à partir de notre galerie, pour insérer des icônes de médias sociaux par exemple. Vous pouvez choisir parmi plus de 1 400 icônes différentes.
  • Vidéo : vous pouvez utiliser une URL à partir de Wista, YouTube, Vimeo, Twitch, Dailymotion, Canal+, Youku et Coub.
  • Logo : vous pouvez insérer votre logo en ajouter une URL ou en important une image.
  • Code : ajoutez un code HTML personnalisé.
  • Panier (Cart) : bientôt disponible

Dupliquer ou supprimer un élément

Si vous avez fait une erreur, utilisez les boutons ANNULER/REFAIRE (UNDO/REDO) situés dans l'angle supérieur droit de l'outil.
hmRyt0krhnlrDkfT86vzuCxyOWntjI80OHbs5kp6BhGGJeyFzy0rlB7LqCTZHHA4nwmf8MhvZYJ501_Nmv74aDMHMsLYxymgvvZ128wa4ZrgeRc0NJ3d3u-BaeFDZAoaW6On_MCx.png

Il existe deux possibilités pour dupliquer ou supprimer un élément :

  • Lorsque le menu latéral droit est affiché, cliquez en bas de l'encadré, sur DUPLIQUER (DUPLICATE) ou SUPPRIMER (DELETE).8cJg2eiGoh8FuPx3AoLKVJUGGgGLo3p2tSiseGM2a1xOjthvEHbV_PvyoMYn8PwIkuCB9980pzsYKeNAvTO1e-REYxXtz0whiAVnW_42NxqzMMaTAdHxgmXPRoe1so-GwqplpZdF.png
  • Une autre solution consiste à cliquer sur les feuilles de papier ou la corbeille à partir de l'onglet Gérer la présentation (Manage Layout).

Personnaliser la palette de couleurs

Vous pouvez choisir une couleur prédéfinie, effacer la couleur ou ajouter une nouvelle couleur.
customize-color-1.png

Pour utiliser une couleur personnalisée, cliquez sur + AJOUTER UNE COULEUR (ADD COLOR).

Choisissez une couleur à partir de la palette de couleurs ou ajoutez un code hexadécimal (#RRGGBB).

customize-color-2.png

Cliquez sur Enregistrer (Save).

Personnaliser l'affichage mobile

customize-color-3.png

À l'aide des boutons situés dans l'angle supérieur droit, vous pouvez tester le rendu de votre landing page sur bureau, tablette et smartphone.

Pour chaque section de votre landing page, vous pouvez contrôler sa visibilité selon le type d'appareil dans la section de modification. Vous pouvez :

  • Masquer sur mobile (Hide on Mobile)
  • Masquer sur tablette (Hide on Tablet)
  • Masquer sur ordinateur (Hide on Desktop)

Remarque : si vous masquez sur mobile ou tablette, la section apparaîtra dans l'aperçu et dans l'outil de création, au cas où vous auriez besoin d'effectuer des modifications. Cependant, elle ne s'affichera pas sur la page une fois publiée.

Lorsque vous avez terminé votre landing page, cliquez sur SUIVANT (NEXT) dans l'angle inférieur droit pour accéder à l'étape 3 : la publication de votre landing page.