Growform Multi Step Form Builder
  • Use cases
    • Génération de leads dans le domaine de la finance et de l’assurance
    • Génération de leads
    • Génération de leads juridiques
    • Page immobilière
    • Génération de leads dans le domaine de l’énergie solaire et de l’énergie
    • Génération de leads dans le secteur de la construction et des métiers
  • Modèles
  • Intégrations
  • Tarification
  • Nous contacter
  • Log in
  • Free trial

Comment ajouter un formulaire Growform à plusieurs étapes à Unbounce (méthode de superposition)

This post shows you how to add a multi-step form to your Unbounce page as an overlay – i.e. how to get a form to “pop up” when somebody clicks a button:

This is an overlay form. It appears when a button is clicked on your Unbounce page

The overlay method is a nice way to avoid overwhelming your visitors when they first see your form.

If you want to embed a multi step form directly on the page, you’re in the wrong place, and should head to this guide.

Table des matières

  • 1 – Create a form on Growform
  • 2 – Get your Growform share code
  • 3 – Find your Unbounce trigger button and give it a custom class name
  • 4 – Get your Growform share code
  • 5 – Paste your code into Unbounce‘s JavaScript area
  • 6 – Check out your new Unbounce multi-step form!

1 – Create a form on Growform

It almost goes without saying that you’ll need to set up a form on Growform. We have a 14 day free trial (with no credit card required) – you can sign up here.

Follow our getting started guide if you need help creating your first form.

The first step will look something like this:

Follow our getting started guide if you need help creating your first form.

2 – Get your Growform share code

To get your Growform share code, open Growform and make sure your form is saved. Then, navigate to “Share form” in the top blue bar.

Choose the second option – “Show Growform as a modal when your users click something on your website”.

Click the code and copy it to your clipboard.

3 – Find your Unbounce trigger button and give it a custom class name

In Unbounce, find the button you wish to use as a “trigger” in Unbounce and click it (whilst in the editor) to reveal the properties panel.

Find “class” under “Element metadata” and enter any class name you wish – let’s call it “growformTrigger”:

Take a note of your class name – you’ll need it in the coming steps.

Don’t forget to save your Unbounce page and do the same for mobile view.

4 – Get your Growform share code

To get your Growform share code, open Growform and make sure your form is saved. Then, navigate to “Share form” in the top blue bar.

Choose the second option – “Show Growform as a modal when your users click something on your website”.

Click the code and copy it to your clipboard:

5 – Paste your code into Unbounce‘s JavaScript area

Click “Javascripts” at the bottom of the Unbounce editor and then “Add new Javascript”.

Ensure “Before body end tag” is selected under “Placement”.

Paste the code you copied in step 3 into the box.

Finally, replace the growformTargetClass on line 4 (“myButtonClass123”) with the class name you copied in step 2 (in this example’s case, “growformTrigger”).

This is vital so Growform knows to trigger the modal when somebody clicks your Unbounce button.

Hit “Done” and then save and view your changes:

6 – Check out your new Unbounce multi-step form!

Hit the button you chose in preview (or live) mode to see your new multi-step form in Unbounce:

Need more? We’re actively working on our Unbounce offering, including the ability to see leads appear in Unbounce.

Please get in touch with us to provide feedback and help us shape the roadmap.

template_name
_id
friendly_id
above_fold_header
above_fold_description
long_description_header
long_description
how_does_it_work_header
how_does_it_work_text
screenshot_url
template_page_name
featured
how_it_works_new

Post a Comment

Recent Posts

  • Nous passons en revue les meilleures alternatives à Microsoft Forms pour une meilleure personnalisation et un meilleur contrôle.
  • Voici notre revue des meilleurs constructeurs de formulaires pour les sites WordPress
  • Nos stratégies éprouvées de génération de leads entrants pour attirer des prospects qualifiés
  • Nous décomposons les 6 différents types de formulaires et ce pour quoi vous en avez besoin
  • 6 bonnes pratiques essentielles de conception de formulaires mobiles pour augmenter les conversions

Categories

  • Conception de formulaires en plusieurs étapes
  • Conception de la forme
  • Conformité
  • Convertri
  • CRO
  • Formulaire de confiance
  • Génération de leads
  • Google Tag Manager
  • Hubspot
  • Immobilier
  • Intégration
  • Marketing
  • Non classifié(e)
  • Offres spéciales de génération de leads
  • Outils
  • Prospection
  • Tutoriels
  • Tutoriels Unbounce
  • Unbounce
  • Utilisation de growform

Try Growform Multi Step Form Builder »

Guides

  • Comment créer de beaux formulaires Asana sans code
  • Comment créer des formulaires Hubspot à plusieurs étapes (sans code)
  • Comment ajouter un formulaire Growform à plusieurs étapes à Instapage
  • Comment ajouter un formulaire Growform à plusieurs étapes à Leadpages
  • Comment ajouter un formulaire Growform à plusieurs étapes à Unbounce
  • Comment ajouter un formulaire Growform à plusieurs étapes à Webflow
  • Comment ajouter un formulaire Growform à plusieurs étapes à WordPress

Features

  • Toutes les caractéristiques
  • Maîtriser les formulaires de logique conditionnelle : Un guide pratique avec des exemples
  • Guide des formulaires conversationnels : Créez facilement des formulaires engageants
  • Formulaires intégrables pour votre site web
  • Des formulaires de capture de prospects qui convertissent en 2023 : 5 conseils puissants + exemples
  • Vérification du plomb : Méthodes en temps réel et en masse pour des données précises
  • Sauts logiques : Créez des formulaires dynamiques pour un meilleur engagement des utilisateurs
  • TrustedForm par ActiveProspect : Le guide ultime pour 2024
  • Comment mettre en place Jornaya (construire un formulaire Jornaya) avec Growform
  • Comment créer un formulaire d’assistant : Guide étape par étape
  • Règles de la FCC sur la génération de prospects : Comment garantir la conformité avec 1-1 Consent
  • Alternatives

More

  • Partenaires affiliés
  • Conditions d’utilisation
  • Vie privée et GDPR
  • Service status
  • Blog
  • Help docs
  • Climate pledge
  • Glossaire Growform : Maîtrisez aujourd’hui les formulaires de conversion
© 2020 - 2024 Growform Ltd. All rights reserved. Growform is a company registered in England and Wales. Company No. 13097518. Registered office: Kemp House, 160 City Road, London, United Kingdom, EC1V 2NX , UK
  • English
  • Français
  • Español
  • Italiano
  • Deutsch