Quizanta.
Commencer gratuitement

Installation

Mettez votre quiz sur votre site

Trois façons, selon ce avec quoi votre site est fait. Aucune ne demande un développeur, et aucune ne copie le quiz dans votre site : le tunnel reste dans Quizanta, donc le modifier là-bas le change partout où il apparaît.

Ce qu'il vous faut d'abord

Un tunnel publié. Ouvrez-le dans Quizanta → Intégrations, vous y verrez son adresse ; la dernière partie de cette adresse est son slug, et toutes les méthodes ci-dessous le demandent.

quizanta.com/q/cuisines-lyon → le slug est cuisines-lyon

WordPress et WooCommerce

Le plugin

Sur WordPress, coller un script dans une page échoue le plus souvent : l'éditeur de blocs le supprime pour quiconque n'est pas administrateur, et les page builders le ré-encodent. Le plugin met le tunnel dans un bloc à la place.

Télécharger le plugin
  1. 1Installez-leExtensions → Ajouter → Téléverser une extension, choisissez le fichier téléchargé, installez et activez.
  2. 2Reliez-le à votre compteRéglages → Quizanta. Collez la clé API depuis Quizanta → Intégrations et vos tunnels publiés apparaissent dans un menu. La clé est facultative : sans elle, vous saisissez le slug. Elle peut aussi lire vos leads, ne la mettez donc que sur un site dont les administrateurs ont le droit de les voir.
  3. 3Posez-le sur une pageAjoutez le bloc « Quizanta quiz » là où le tunnel doit apparaître. Dans Elementor, Divi, WPBakery ou tout autre builder, utilisez plutôt un widget HTML ou texte avec le shortcode.
  4. 4Ou sur tout le siteRéglages → Quizanta → Bouton flottant : choisissez un tunnel et un bouton apparaît dans le coin de chaque page. Laissez vide pour aucun.
Ce que permettent le bloc et le shortcode
  • Dans la page ou en bouton dans le coin — un réglage sur chaque bloc.
  • Un tunnel différent par page : chaque bloc nomme le sien, celui des réglages n'est que le repli.
  • Une hauteur minimale, pour l'instant qui précède l'annonce de sa propre hauteur.

[quizanta slug="YOUR-FUNNEL"]

Toutes les autres plateformes

Une ligne de code

Shopify, Wix, Squarespace, Webflow, Tilda, PrestaShop, un site écrit à la main : tous acceptent le même extrait. Copiez-le depuis Quizanta → Intégrations, votre tunnel est déjà dedans.

Dans la page

Le div là où le tunnel doit apparaître, le script n'importe où sur la même page. Le tunnel annonce sa propre hauteur, il ne laisse donc aucun vide.

<div data-quizanta="YOUR-FUNNEL"></div>
<script src="https://quizanta.com/widget.js" async></script>
En bouton dans le coin

Une seule balise, sans div. Le bouton suit le visiteur sur toutes les pages où il se trouve et ouvre le tunnel par-dessus.

<script src="https://quizanta.com/widget.js" data-quizanta="YOUR-FUNNEL" data-mode="popup" async></script>

Où le coller, plateforme par plateforme

Les noms de menus bougent d'une version à l'autre sur toutes ces plateformes. Si un libellé ci-dessous ne correspond plus, prenez le plus proche : l'endroit est le bon même quand les mots changent.

Shopify
Dans la page
  1. 1.Boutique en ligne → Thèmes → Personnaliser.
  2. 2.Choisissez la page voulue en haut de l'éditeur, puis Ajouter une section → Liquid personnalisé.
  3. 3.Collez l'extrait « dans la page », remplacez YOUR-FUNNEL par votre slug, puis Enregistrer.
En bouton dans le coin
  1. 1.Boutique en ligne → Thèmes → ⋯ → Modifier le code.
  2. 2.Ouvrez Layout → theme.liquid.
  3. 3.Collez l'extrait du bouton sur la ligne avant </body> et enregistrez. Il est désormais sur toutes les pages de la boutique.
Wix
Dans la page
  1. 1.Dans l'éditeur : Ajouter (+) → Intégrer du code → Intégrer du HTML.
  2. 2.Cliquez sur Saisir le code, collez l'extrait « dans la page », puis Appliquer.
  3. 3.Étirez le cadre à la largeur voulue, puis Publier.
En bouton dans le coin
  1. 1.Tableau de bord → Paramètres → Code personnalisé → + Ajouter du code.
  2. 2.Collez l'extrait du bouton, emplacement Body – fin, sur Toutes les pages, chargé une fois.
  3. 3.Appliquer, puis Publier.
Squarespace
Dans la page
  1. 1.Modifiez la page → Ajouter un bloc → Code.
  2. 2.Collez l'extrait « dans la page », langage HTML, et laissez « Afficher le code source » décoché.
  3. 3.Enregistrer.
En bouton dans le coin
  1. 1.Paramètres → Avancé → Injection de code.
  2. 2.Collez l'extrait du bouton dans le champ Footer.
  3. 3.Enregistrer.
Webflow
Dans la page
  1. 1.Glissez un élément Embed là où le tunnel doit apparaître.
  2. 2.Collez l'extrait « dans la page », Save & Close.
  3. 3.Publish.
En bouton dans le coin
  1. 1.Project settings → Custom code.
  2. 2.Collez l'extrait du bouton dans Footer code, avant la balise </body>.
  3. 3.Save, puis Publish.
Tilda
Dans la page
  1. 1.Dans l'éditeur de page : Ajouter un bloc → Autres → T123 (code HTML).
  2. 2.Collez l'extrait « dans la page » dans le contenu du bloc.
  3. 3.Enregistrez et publiez la page.
En bouton dans le coin
  1. 1.Paramètres du site → Plus → Code HTML pour tout le site, champ « avant </body> ».
  2. 2.Collez l'extrait du bouton et enregistrez.
  3. 3.Republiez toutes les pages : ce réglage n'atteint que les pages publiées.
PrestaShop
Dans la page
  1. 1.Apparence → Thème et logo → le template de la page voulue, ou tout module acceptant du HTML.
  2. 2.Collez l'extrait « dans la page » là où le tunnel doit apparaître.
  3. 3.Paramètres avancés → Performances → Vider le cache.
En bouton dans le coin
  1. 1.Le template du pied de page du thème (footer.tpl), juste avant </body>.
  2. 2.Collez l'extrait du bouton.
  3. 3.Paramètres avancés → Performances → Vider le cache.

Sans site

Le lien, tout simplement

Chaque tunnel est une page à part entière et n'a besoin de rien pour fonctionner : mettez le lien dans la bio Instagram, envoyez-le sur WhatsApp, imprimez le QR de Quizanta → Intégrations sur la camionnette, une carte ou une facture. Ajoutez ?utm_source= à la fin pour distinguer la camionnette de la vitrine quand les demandes arrivent.

Si rien n'apparaît

La page n'affiche rien là où le tunnel devrait être

Deux causes habituelles : le tunnel n'est pas encore publié, ou le slug est faux. Comparez-le à l'adresse dans Quizanta → Intégrations — un tunnel seulement enregistré n'a pas de page publique.

Il y a une barre de défilement dans le tunnel, ou un vide en dessous

Le cadre annonce sa hauteur au fur et à mesure des questions. Si votre thème impose une hauteur fixe aux iframes, retirez-la et réglez plutôt la hauteur minimale sur le bloc.

Le bouton du coin est dans la mauvaise langue

Avant le chargement du tunnel, le bouton lit la langue de votre page. Le plugin WordPress envoie celle du site ; ailleurs c'est <html lang>. Ajoutez data-lang="fr" à la balise script pour la fixer.

Chez moi ça marche, chez un visiteur non

Presque toujours une extension de cache ou un CDN qui sert une vieille copie de la page. Videz le cache et rechargez sans lui.

Toujours bloqué ?

Écrivez à support@quizanta.com en indiquant l'adresse de la page où vous essayez de mettre le tunnel. Cette seule ligne suffit en général.

Transformez les conversations en clients, pas en curieux.

Créez votre quiz en quelques minutes. Publiez-le sur Instagram, WhatsApp ou votre site : les leads qualifiés arrivent directement sur WhatsApp.

Commencer gratuitement Voir tous les modèles
  • Sans carte bancaire
  • Leads illimités
  • En ligne en 5 minutes