Intégrer le widget Guesty Booking Engine dans un site web externe

Le moteur de réservation Guesty est un portail de réservation statique qui permet aux clients de consulter les disponibilités et de finaliser leurs séjours sans passer par des plateformes tierces. En intégrant ce portail comme widget sur un site web personnel, tel que Wix ou WordPress, vous préservez une image de marque cohérente et vous éliminez les frais de distribution liés à des tiers.

Si vous possédez votre propre domaine, vous pouvez le connecter à votre moteur de réservation Guesty et utiliser l'adresse de votre site web.

Intégrez votre moteur de réservation Guesty

Suivez les instructions ci-dessous pour intégrer votre widget Guesty Booking Engine sur un site externe.

Pas à pas:

Connectez-vous à votre compte Guesty.
Dans le menu de navigation latéral, cliquez sur Marketing et ventes pour ouvrir le menu déroulant.
Sous Gestion des canaux, sélectionnez Distribution.
Cliquez sur la vignette du moteur de réservation Guesty.
Dans la ligne du moteur de réservation concerné, cliquez sur .
Dans le menu déroulant, sélectionnez « Se connecter à votre propre site web ».
Cliquez sur pour copier l'extrait et le coller sur votre site web externe.

Note:

Guesty n'offre pas d'assistance pour les difficultés techniques liées à l'ajout de code à un site web externe.
Le filtre de destination du widget de recherche du moteur de réservation synchronise automatiquement les données des champs « Adresse de la ville » de vos annonces. Vous pouvez personnaliser ces valeurs pour afficher des quartiers ou des régions plutôt que des villes, mais cela peut affecter la connexion avec des plateformes comme Airbnb, Booking.com et Vrbo en raison de leurs exigences en matière d'adresse.

Comportement de style et de couleur des widgets

Le widget de recherche du moteur de réservation Guesty prend en charge un paramètre color permettant de contrôler les couleurs de surbrillance et de sélection des éléments graphiques. Cette couleur est automatiquement définie en fonction des paramètres de conception de votre moteur de réservation.

Vous pouvez modifier manuellement la valeur color dans le code d'intégration pour une personnalisation de votre marque.

Format de code d'intégration recommandé

Pour une mise en forme des couleurs homogène, utilisez toujours le code d'intégration le plus récent. Ce code ressemblera à l'exemple ci-dessous (votre code contiendra vos paramètres spécifiques) :

 <div id="search-widget_IO312PWQ">
  <script>
    !function(e,t,a,n,c,r){
      function s(t){e.console.log("[Widget intgre invit]:",t)}
      var i,d,l,o,y,m,g,h,p,u;
      n&&(i=n,d=t.getElementsByTagName("head")[0],
      (l=t.createElement("link")).rel="stylesheet",
      l.type="text/css",l.href=i,l.media="all",d.appendChild(l)),
      o=function(){
        try{e[a].create(r).catch(function(e){s(e.message)})}
        catch(e){s(e.message)}
      },
      h=!1,y=c,
      m=function(){h||this.readyState&&"complete"!=this.readyState||(h=!0,o())},
      (g=t.createElement("script")).type="text/javascript",
      g.src=y,g.async="true",g.onload=g.onreadystatechange=m,
      p=g,(u=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,u)
    }(
      window,
      document,
      "Widget de barre de recherche invit",
      "https://s3.amazonaws.com/guesty-frontend-production/search-bar-production.css",
      "https://s3.amazonaws.com/guesty-frontend-production/search-bar-production.js",
      {
        "siteUrl": "libelulahomes.guestybookings.com",
        "color":"#e2c2a1"
      }
    );
  </script>
</div>

Important :

Après avoir mis à jour la couleur de votre moteur de réservation, veillez à toujours copier et réintégrer le code du widget pour que les modifications apparaissent sur votre site web externe.

Utilisez toujours le code d'intégration mis à jour du widget Booking Engine, qui inclut désormais le paramètre color. L'utilisation d'un ancien script peut entraîner un affichage incorrect des couleurs du widget ou une incompatibilité avec votre configuration Booking Engine.

Dépannage

La couleur du widget ne correspond pas.

Si les couleurs du widget ne correspondent pas à votre moteur de réservation Guesty :

Confirmez la date de déploiement de la conception de votre moteur de réservation.
Recopiez le code d'intégration de Connect sur votre propre site web.
Vérifiez que le paramètre color apparaît bien dans le script.

Ce comportement est normal et ne constitue pas un défaut du système.

Associé à:

GFP: Guesty Booking Website