Utilisez le widget de réservation de Lodgify sur un site web externe

Vous pouvez utiliser le widget de réservation Lodgify pour intégrer le moteur de réservation de Lodgify sur un site web externe. Pour cela, nous proposons plusieurs options : un Encadré de recherche, et un Encadré de réservation.

L'option widget Encadré de recherche est notre option recommandée, car c'est la seule qui peut intégrer de façon transparente le processus de réservation dans votre site web externe. De cette façon, l'invité ne quittera jamais consciemment votre site web externe.

💡 Note: Les widgets Lodgify sont compatibles avec les versions standard de WordPress, Squarespace et Wix. Les variations de mise en page et de thème peuvent affecter la compatibilité. Pour les questions d'intégration, veuillez contacter votre développeur ou votre fournisseur de créateur de site web.

Parcourez les sections : 

• Options de widget disponibles
• Génération du code d'intégration
• Intégration du widget encadré de recherche sur votre site web externe
• Intégration du widget encadré de recherche sur WordPress
• Ajouter le widget de réservation Lodgify sur Wix
• Ressources associées

Options de widget disponibles

Lodgify propose 2 options différentes pour lier le système de réservation de Lodgify à un site web externe. 

💡 Note : Les anciennes versions des widgets sont encore disponibles ici, mais seront bientôt obsolètes. Pour en savoir plus, voir la fin de l'article.

Génération du code d'intégration

Vous pouvez les deux widgets sur votre site web externe si vous proposez un seul hébergement (peu importe si cet hébergement a des types de chambre ou non). Lorsque l'invité clique sur le bouton de réservation, il sera redirigé directement vers votre page de prise de réservation Lodgify où il pourra sélectionner le type de chambres si vous en avez un. Pour générer et intégrer le code du widget externe, suivez ces étapes :

1. Allez dans le menu de gauche et sélectionnez Site web.
2. Allez maintenant à Widgets externes.
   
   
3. Dans Type de widget, choisissez dans le menu déroulant si vous voulez créer un encadré de recherche ou un encadré de réservation.

4. Vous pourrez choisir :

   • D’afficher ou masquer le menu déroulant de localisation dans la barre de recherche (le menu déroulant de localisation s’applique uniquement au widget Encadré de recherche),

   • D’afficher ou masquer la répartition du nombre d'invités,
   • D’afficher ou masquer le prix de base des annonces (s'applique uniquement au widget Encadré de réservation),
   • D’activer ou non les mises à jour automatiques pour votre widget, afin que les mises à jour produit et les corrections de bugs soient appliquées automatiquement,

   • Le design du widget.

     

5. Voici quelques paramètres pour l'Encadré de réservation :
   • Vous pouvez choisir d'afficher ou non le prix "à partir de" sur le widget avant de sélectionner les dates.
     
   • Vous pouvez choisir une devise fixe à afficher pour tous les invités sur le widget, ou régler la devise en fonction de l'adresse IP des invités.
     
   • Si vous avez plusieurs hébergements et que vous voulez utiliser un encadré de réservation, vous devez créer un widget pour chaque hébergement spécifique ou créer un bouton sur votre site web externe qui renvoie à votre page Tous les hébergements.
6. Sélectionnez l'hébergement et la langue que vous souhaitez utiliser dans le widget et ensuite Générer le code.
7. Vous verrez une zone de code avec deux entrées de code. Tout d'abord, copiez et collez le premier code là où vous souhaitez l'intégrer. Ensuite, ajoutez le deuxième code juste en dessous du premier.
   
   Voici quelques instructions en fonction des différents scénarios possibles :
   • Pour ajouter plusieurs widgets sur la même page : copiez et collez le premier code pour chaque widget que vous souhaitez ajouter, puis ajoutez le deuxième code une fois.
   • Pour ajouter des widgets sur des pages séparées de votre site web : pour chaque page, copiez et collez le premier code suivi du deuxième code.
   • Pour ajouter différentes options de widgets sur la même page (par exemple, encadré de réservation et encadré de recherche) : copiez et collez à la fois le premier et le deuxième code pour chaque option de widget sur la même page.

Si le widget externe ne s’affiche pas correctement, vérifiez que les deux extraits de code ont été copiés correctement.
Ensuite, contrôlez si le widget fonctionne sur un site tiers, par exemple onecompiler.com/html. Si le widget fonctionne sur d’autres sites mais pas sur le vôtre, il est probable qu’un autre code de votre site interfère avec l’affichage correct du widget Lodgify. Dans ce cas, nous vous recommandons de contacter l’assistance de votre fournisseur de site externe ou votre développeur web pour obtenir de l’aide.

Intégration du widget encadré de recherche sur votre site web externe

L'encadré de recherche est l'option recommandée si vous avez plusieurs hébergements sur votre site web. Intégrer de manière transparente le Widget encadré de recherche sur votre site web externe signifie que vous pouvez connecter Lodgify à un sous-domaine de votre site web externe (par exemple, search.yourdomain.com ou booking.yourdomain.com). De cette façon, les pages du processus de réservation apparaîtront sous votre sous-domaine et les clients n'auront pas l'impression d'être redirigés vers un autre site web, mais qu'ils passent par l'ensemble du processus de réservation sur votre site web.
💡 Note: L'option d'intégration transparente est préférable pour les sites web avec plusieurs hébergements car, sur les sites web à hébergement unique, le bouton de recherche redirigera toujours automatiquement vers la page de prise de réservation.

Pour mettre cela en place, vous devez suivre 4 étapes :

• Générez le code d'intégration pour intégrer le Widget Barre de recherche sur votre site web externe
• Créez un sous-domaine chez votre fournisseur de domaine
• Liez le sous-domaine à votre compte Lodgify
• Remplissez une URL de logo personnalisée

Générez le code d'intégration pour le widget Encadré de recherche

Pour générer le code d'intégration, suivez ces étapes :

1. Allez dans le menu de gauche et sélectionnez Site web.
2. Allez maintenant à Widgets externes.
   
   
3. Dans Type de Widget, sélectionnez Widget Encadré de recherche dans le menu déroulant et choisissez la langue.
4. Vous pouvez maintenant choisir que le widget s'ouvre dans une nouvelle fenêtre ou qu'il reste dans la même fenêtre, et sélectionner la couleur du bouton de recherche.
   💡 Notes:
   • Si vous souhaitez intégrer le widget sur un site web WIX, vous devez sélectionner la destination Nouvelle fenêtre, sinon, le widget ne pourra pas fonctionner correctement sur WIX.
   • Bien que la couleur du texte à l’intérieur du bouton du widget et celle du bouton lui-même puissent être personnalisées dans Créateur de site > Widget externe, le nombre d’invités s’affichera toujours en noir, sauf s’il est remplacé par du CSS sur le site Web externe de l’utilisateur.
5. Ensuite, Générer un code d'intégration, copiez le code Javascript dans votre presse-papiers et collez-le dans votre site web externe (généralement dans un type de Widget HTML).
   💡 Note: Les configurations de site web externe peuvent varier, cependant, dans la plupart des cas, le Widget Barre de recherche fonctionnera sans aucune configuration supplémentaire en collant le code généré dans un widget de code de votre constructeur de site web externe.
   

Créer un sous-domaine

Si vous souhaitez que votre module de réservation apparaisse sous un sous-domaine, vous devez lier votre domaine et mettre à jour les paramètres DNS de ce sous-domaine. Suivez les étapes décrites dans cet article.

Remplissez une URL de logo personnalisée

Une fois que les invités cliquent sur le bouton de recherche, ils sont redirigés vers votre page Tous les hébergements dans Lodgify (ou la page de prise de réservation si vous n'avez qu'un seul hébergement). Afin de rendre l'intégration aussi transparente que possible, vous voulez vous assurer que lorsqu'un client clique sur le logo ou l'un des éléments du menu depuis la page Tous les hébergements/page de prise de réservation, ils sont redirigés vers votre site web externe

Pour ce faire, suivez ces étapes :

1. Dans Lodgify, rendez-vous dans le menu de gauche et sélectionnez Site web.
2. Sélectionnez maintenant Styles
3. Faites défiler jusqu'à tout en bas et cliquez sur Logo.
   
4. Ensuite, faites défiler jusqu'à tout en bas, dans URL du logo, ajoutez le lien vers la page d'accueil de votre site web externe.

💡 Note: Vous devriez configurer la barre de menu exactement comme elle l'est sur votre site web externe. Allez simplement dans la configuration des pages de votre constructeur de site et créez un lien pour chaque élément de menu qui mène à la page correspondante sur votre site web externe. Apprenez comment créer un lien sur votre menu Lodgify.

💡 Note: Vous pouvez utiliser du CSS pour faire correspondre l'apparence de votre menu Lodgify à celle de votre site web externe. En savoir plus sur le code personnalisé dans Lodgify.

Intégration du widget encadré de recherche sur WordPress

Vous pouvez facilement ajouter le widget encadré de recherche à votre site Web WordPress en utilisant le plugin Lodgify. Une fois configuré, vous pouvez rapidement et facilement l'ajouter à plusieurs emplacements sur votre site.

Pour intégrer le widget encadré de recherche sur WordPress avec le plugin Lodgify, suivez ces étapes :

1. Connectez-vous à votre compte WordPress et allez dans Plugins.
2. Recherchez Lodgify et sélectionnez le plugin Booking Engine by Lodgify :
3. Rendez-vous dans le menu de gauche et sélectionnez Site web.
4. Cliquez sur Widgets externes.
   
   
5. Dans Type de widget, choisissez Encadré de recherche.
6. Ensuite, générez le code, copiez le code JavaScript et collez-le dans la page du plugin sur WordPress. Puis cliquez sur Enregistrer.
7. Pour ajouter le plugin à une page spécifique, allez dans vos pages WordPress, modifiez la page où vous souhaitez que le plugin apparaisse, et lorsque vous ajoutez un nouveau bloc, vous verrez le plugin listé sous le nom Lodgify Search Widget :
   

Ajouter le widget de réservation Lodgify sur Wix

Si vous utilisez Wix, n’ajoutez pas le widget de réservation Lodgify à l’intérieur d’un élément <iframe>, car cela peut entraîner un affichage incorrect du widget. Selon la documentation de Wix, l’ajout du widget via les options Intégrer un code HTML ou Intégrer un site peut casser la réactivité du widget ainsi que de tout autre code ajouté de cette manière.

À la place, vous devez utiliser l’option Élément personnalisé de Wix, qui permet d’intégrer le widget sans affecter la réactivité. Vous trouverez les instructions détaillées de Wix ici.