Wix : comment installer le widget pour site web Bridebook
Choisissez la façon dont vous souhaitez afficher le widget sur votre site web, puis suivez les étapes correspondant à l'option choisie.
Avant de commencer
4 étapes pour publier
Obtenez l'URL de votre widget depuis Bridebook Business
Connectez-vous à Bridebook Business et rendez-vous dans la section Widget pour site web. Vous avez besoin de l'URL de votre code d'intégration. Copiez uniquement l'adresse située dans la partie src="" de l'iframe, et non la balise iframe complète.
https://enquiry.bridebook.com?publicId=YOUR_VENUE_ID&widgetId=YOUR_WIDGET_IDUniquement l'URL, pas le code iframe
Copiez tout ce qui se trouve entre les guillemets après src= dans votre code d'intégration. Ne copiez pas la balise <iframe> complète, car cela provoquera une erreur Forbidden.
Ouvrez votre page dans l'éditeur Wix et ajoutez un élément d'intégration
Dans l'éditeur Wix, ouvrez la page où vous souhaitez placer le widget. Cliquez sur + Ajouter en haut à gauche, puis sur Éléments. Recherchez html dans la barre de recherche. Deux options s'afficheront. Cliquez sur Intégrer un site.
N'utilisez pas Intégrer du code
L'option Intégrer du code crée un iframe imbriqué qui bloque le contenu externe et affichera une erreur Forbidden. Utilisez toujours Intégrer un site pour le widget Bridebook intégré.
Collez l'URL et cliquez sur Appliquer
Un élément HTML sera placé sur votre page et un panneau Paramètres s'ouvrira à droite. Assurez-vous que Choisir ce qu'il faut intégrer est réglé sur Lien. Collez votre URL Bridebook dans le champ Lien, puis cliquez sur Appliquer. Le widget se chargera dans l'élément.
Assurez-vous de cliquer sur Appliquer
Le widget ne se chargera pas tant que vous n'aurez pas cliqué sur Appliquer. Si vous fermez le panneau sans cliquer dessus, l'élément restera vide.
Redimensionnez l'élément et publiez
Faites glisser les bords de l'élément HTML pour le redimensionner afin que le formulaire Bridebook complet soit visible. Une hauteur d'environ 700 px convient bien à la plupart des écrans. Lorsque le résultat vous convient, cliquez sur Publier en haut à droite, puis ouvrez votre page en ligne pour vérifier qu'elle s'affiche correctement.
Ce qu'il faut vérifier
Le formulaire Bridebook se charge dans l'élément sur votre page
Les couples verront les options permettant de réserver une visite, de s'inscrire à une journée portes ouvertes ou d'envoyer une demande. Chaque soumission arrive dans Bridebook Business avec le tag Widget pour site web.
Vous voyez toujours une zone vide ?
Assurez-vous que le menu déroulant Paramètres indique Lien et non Code, que vous avez collé uniquement l'URL (pas la balise iframe complète), et que vous avez cliqué sur Appliquer avant de fermer le panneau.
Avant de commencer
Comment fonctionne le pop-up
Sur Wix, le script et le code du bouton vont tous deux dans le même élément Intégrer du code. Wix isole les éléments HTML dans des environnements séparés, donc le script et le bouton doivent se trouver ensemble dans un seul bloc pour communiquer. Vous les collez tous les deux dans un seul élément, vous cliquez sur Appliquer, et le bouton est actif.
3 étapes pour publier
Obtenez votre script depuis Bridebook Business
Connectez-vous à Bridebook Business et accédez à la section Widget pour site web. Copiez votre balise de script unique. Il s'agit d'une seule ligne qui commence par <script, différente du code d'intégration iframe.
<script src="https://enquiry.bridebook.com/widget.js"
data-public-id="YOUR_PUBLIC_ID"
data-widget-id="YOUR_WIDGET_ID"
defer></script>
Ajoutez un élément Intégrer du code et collez le script et le bouton
Dans l'éditeur Wix, accédez à la page où vous souhaitez placer le bouton. Cliquez sur + Ajouter, puis sur Éléments. Recherchez code et cliquez sur Intégrer du code.
Dans le panneau Paramètres, assurez-vous que Choisir ce qu'il faut intégrer est réglé sur Code. Collez ensuite le code combiné ci-dessous dans le champ de l'éditeur. Il inclut à la fois le script et le bouton dans un seul bloc. Cliquez ensuite sur Appliquer.
<script src="https://enquiry.bridebook.com/widget.js"
data-public-id="YOUR_PUBLIC_ID"
data-widget-id="YOUR_WIDGET_ID"
defer></script>
<button data-bb-open style="background-color:#4D52E3;
color:#fff;padding:12px 24px;border-radius:30px;
border:none;font-size:15px;font-weight:700;
cursor:pointer;">Réserver une visite</button>
Pourquoi les deux vont dans la même zone
Wix isole chaque élément HTML dans son propre environnement. Si le script se trouve à un autre endroit que le bouton, ils ne peuvent pas communiquer et le pop-up ne s'ouvrira pas. Les garder ensemble dans un seul élément Intégrer du code résout ce problème.
Vous souhaitez l'adapter à votre propre marque ?
Vous pouvez modifier les couleurs, la taille et le libellé du bouton pour correspondre au style de votre lieu. La seule chose à conserver est data-bb-open sur l'élément bouton. Sans cela, le pop-up ne s'ouvrira pas.
<button data-bb-open style="background-color:#YOUR_COLOUR;
color:#YOUR_TEXT_COLOUR;padding:12px 24px;
border-radius:8px;border:none;
font-size:15px;font-weight:700;
cursor:pointer;">Libellé de votre bouton</button>
Publiez et testez
Cliquez sur Publier en haut à droite de l'éditeur. Ouvrez ensuite votre site en ligne et cliquez sur le bouton. Le formulaire Bridebook devrait s'ouvrir dans une superposition pop-up au-dessus de votre page.
Ce qu'il faut vérifier
Le formulaire Bridebook s'ouvre dans un pop-up lorsque le bouton est cliqué
Les couples peuvent réserver une visite, s'inscrire à une journée portes ouvertes ou envoyer une demande sans quitter votre page. Chaque soumission arrive dans Bridebook Business avec le tag Widget pour site web.
Le pop-up ne s'ouvre pas ?
Assurez-vous que le script et le code du bouton se trouvent tous les deux dans le même élément Intégrer du code, que le menu déroulant est réglé sur Code et que vous avez cliqué sur Appliquer. Vérifiez que le bouton inclut data-bb-open exactement comme indiqué. Videz votre cache et réessayez.
Compatible avec
Prêt ?
Configurez votre widget dans Bridebook Business
Obtenez votre code unique, choisissez votre type de widget et publiez-le. Chaque demande arrive automatiquement dans Bridebook Business, avec un tag indiquant la source et prête à être traitée.
Configurer votre widget →