Intégrer une visite virtuelle sur son site : guide complet 2026

Si vous avez déjà créé une visite dans Tours et souhaitez l'afficher sur votre site, inutile d'écrire du code à partir de zéro. Après la publication, rendez-vous dans Mes visites, choisissez la visite concernée, ouvrez le menu à trois points et cliquez sur intégration. Sélectionnez ensuite l'option adaptée à votre site — HTML, React, Angular, WordPress ou Wix — puis copiez le code généré.

Dans cette même fenêtre, vous pouvez activer ou désactiver l'intégration et décider sur quels domaines la visite est autorisée à s'afficher. Vous gardez ainsi le contrôle sur l'endroit où la visite apparaît, sans retourner dans l'éditeur ni modifier le contenu de la visite.

Pour le visiteur, le résultat est simple : la visite à 360° s'ouvre directement sur votre page. Vous ne le redirigez pas vers un autre site, vous ne l'éloignez pas de votre page de présentation et vous ne l'obligez pas à chercher la galerie séparément. Il peut explorer les chambres, les tables, l'appartement, le showroom ou l'espace événementiel exactement là où se trouvent votre description, votre offre, votre formulaire de contact ou votre bouton de réservation.

En bref

• Une visite virtuelle intégrée sur votre site s'affiche directement sur votre page, sans lien séparé vers une autre plateforme.
• Dans Tours, le code se récupère depuis Mes visites, une fois la visite publiée.
• Les étapes sont : Mes visites → menu à trois points → intégration → choisir la plateforme → copier le code.
• Dans la fenêtre d'intégration, vous pouvez activer ou désactiver l'affichage de la visite sur des sites externes.
• Vous pouvez définir les domaines sur lesquels la visite est autorisée à apparaître, pour éviter qu'elle soit copiée n'importe où.
• Des options de code sont disponibles pour HTML, React, Angular, WordPress et Wix.
• Si vous modifiez la visite dans l'éditeur, la version intégrée sur votre site se met à jour automatiquement.
• La visite intégrée peut inclure des scènes 360°, des points interactifs, des réservations intégrées et des statistiques d'utilisation.

Qu'est-ce qu'intégrer une visite virtuelle sur un site ?

Intégrer une visite virtuelle sur un site signifie que le visiteur peut explorer un espace en 360° directement sur votre page. Il ne voit pas seulement une grande photo et n'est pas redirigé vers une galerie externe. Il peut faire pivoter l'image, passer d'une pièce à l'autre, cliquer sur des points interactifs et découvrir des détails que les photos classiques ne montrent pas aussi clairement.

Pour un hôtel, cela peut se traduire par une présentation plus convaincante des chambres. Pour un restaurant, les visiteurs peuvent voir l'ambiance et la salle avant de réserver. Pour l'immobilier, cela peut réduire les questions inutiles, car le visiteur comprend mieux la disposition et les dimensions du bien avant de demander une visite.

Sur le plan technique, l'intégration se fait via un code généré par la plateforme. Vous le copiez depuis Tours et le collez dans votre site. Sur WordPress ou Wix, vous le placez dans un élément HTML. Sur un site développé sur mesure, vous l'insérez dans le code de la page. Sur des projets React ou Angular, vous utilisez la variante dédiée à cette technologie.

Le principal avantage est de garder le visiteur dans le même contexte. La visite peut se trouver à côté de la description de la chambre, du formulaire de contact, des tarifs ou du bouton de réservation. Cela rend l'expérience plus fluide et plus facile à utiliser.

Comment obtenir le code d'intégration dans Tours ?

Dans Tours, le code d'intégration est généré automatiquement. Vous n'avez pas à le construire manuellement ni à chercher des paramètres cachés dans l'application. Une fois la visite publiée, vous la retrouvez dans votre liste de visites et accédez à l'intégration directement depuis là.

• Connectez-vous à votre compte Tours.
• Ouvrez la page Mes visites.
• Trouvez la visite publiée que vous souhaitez afficher sur votre site.
• Cliquez sur le menu à trois points en regard de la visite.
• Choisissez l'option Intégration.
• Vérifiez que l'intégration est activée.
• Ajoutez ou modifiez les domaines autorisés.
• Choisissez la variante de code pour HTML, React, Angular, WordPress ou Wix.
• Copiez le code affiché et collez-le dans la page souhaitée de votre site.

Chaque visite possède ses propres paramètres d'intégration. C'est particulièrement utile lorsque vous gérez plusieurs établissements, plusieurs biens ou plusieurs pages de présentation. Vous pouvez avoir une visite pour la réception, une pour les chambres, une pour le restaurant et une autre pour une salle de réception, chacune avec son propre code et ses propres domaines autorisés.

Que peut-on configurer dans la fenêtre d'intégration ?

La fenêtre d'intégration n'est pas seulement l'endroit où vous copiez le code. C'est aussi là que vous contrôlez la façon dont la visite est utilisée sur des sites externes. Vous pouvez y désactiver l'intégration, autoriser uniquement certains domaines et choisir le code adapté à votre plateforme.

• Activation ou désactivation : vous pouvez arrêter l'affichage de la visite sur des sites externes sans supprimer la visite de votre compte.
• Domaines autorisés : vous choisissez sur quels sites la visite peut apparaître, par exemple le domaine de l'hôtel, du restaurant ou de l'agence immobilière.
• Choix de la plateforme : vous pouvez sélectionner HTML, React, Angular, WordPress ou Wix.
• Code prêt à copier : une fois la plateforme choisie, le code adapté s'affiche sous le sélecteur.
• Paramètres distincts par visite : chaque visite publiée peut avoir ses propres règles d'intégration.

La liste des domaines autorisés est utile pour garder le contrôle. Par exemple, si vous avez créé une visite pour le site officiel d'un hôtel, vous pouvez autoriser l'affichage uniquement sur ce domaine. Si quelqu'un copie le code et tente de le placer sur un autre site, l'intégration peut être bloquée.

Quelle option choisir : HTML, React, Angular, WordPress ou Wix ?

Tous les sites ne sont pas construits de la même façon, c'est pourquoi Tours propose plusieurs variantes de code. L'idée est de ne pas avoir à adapter manuellement l'intégration, mais de choisir la bonne option et de copier le code généré.

Si vous ne savez pas quelle option choisir, la règle est simple : WordPress pour WordPress, Wix pour Wix, React pour React ou Next.js, Angular pour Angular, et HTML pour tout autre site acceptant du code personnalisé.

Intégration d'une visite virtuelle sur WordPress

Sur WordPress, l'intégration est assez simple. Vous choisissez la variante WordPress dans Tours, copiez le code et le placez dans la page où vous souhaitez afficher la visite. Vous n'avez pas besoin d'une extension spéciale pour les visites virtuelles, tant que votre thème ou votre éditeur vous permet d'ajouter du HTML personnalisé.

• Dans Gutenberg, ajoutez un bloc HTML personnalisé et collez le code.
• Dans Elementor, utilisez l'élément HTML et placez le code dans la section souhaitée.
• Dans Divi, utilisez le module de code.
• Dans WPBakery, vous pouvez utiliser un élément pour le HTML brut ou le code personnalisé.
• Dans l'éditeur classique, passez en vue Texte / HTML et insérez le code à l'endroit voulu.

Il vaut la peine de soigner l'espace dans lequel vous placez la visite. Si vous la compressez dans une section trop petite, le rendu ne sera pas satisfaisant. Sur ordinateur, une hauteur d'environ 600 px est généralement un bon point de départ, et sur mobile, pensez à vérifier la page avant de la publier.

Intégration d'une visite virtuelle sur Wix

Sur Wix, choisissez la variante Wix dans Tours et copiez le code généré. Ouvrez ensuite l'éditeur Wix et ajoutez un élément d'intégration HTML dans la zone de la page où vous souhaitez afficher la visite.

• Ouvrez la page souhaitée dans l'éditeur Wix.
• Ajoutez un nouvel élément depuis le menu +.
• Choisissez la zone pour l'intégration ou le code personnalisé.
• Sélectionnez l'élément HTML.
• Collez le code généré par Tours pour Wix.
• Ajustez la largeur et la hauteur pour ordinateur et mobile.
• Publiez la page et testez la visite sur le site en ligne.

Si la visite apparaît tronquée sur Wix, le problème vient la plupart du temps de la taille de l'élément HTML, pas du code Tours. Agrandissez la zone dans laquelle vous avez placé la visite, vérifiez la version mobile et assurez-vous d'avoir publié la dernière version de la page.

Intégration sur React, Angular, Webflow, Squarespace ou HTML

Si votre site n'est pas sur WordPress ou Wix, choisissez la variante qui correspond à votre projet. Pour un site développé sur mesure, la variante HTML est généralement suffisante. Pour des applications modernes, vous pouvez utiliser le code pour React ou Angular.

• React / Next.js : utilisez le code pour React et placez-le dans le composant où vous souhaitez afficher la visite.
• Angular : utilisez le code pour Angular dans le template du composant approprié.
• Webflow : ajoutez un élément d'intégration et collez le code HTML de Tours.
• Squarespace : ajoutez un bloc de code et collez la variante HTML.
• Shopify : placez le code dans une section HTML personnalisée ou dans un template de page, selon le thème utilisé.
• HTML pur : insérez le code directement à l'endroit où vous souhaitez que la visite se charge.

Si votre plateforme n'autorise pas le code personnalisé, vous pouvez utiliser le lien public de la visite ou le code QR généré par Tours. Cela dit, si vous en avez la possibilité, l'intégration directe reste la meilleure option pour les pages commerciales, car le visiteur reste à côté de votre offre, de votre formulaire ou de votre bouton de réservation.

Comment créer la visite avant de l'intégrer ?

Avant d'accéder au code d'intégration, vous devez disposer d'une visite publiée. Dans Tours, la création se fait visuellement : vous importez les scènes 360°, les organisez et ajoutez les points interactifs dont vous avez besoin.

• Créez votre compte sur getours.app et accédez à l'application Tours.
• Ouvrez Mes visites et cliquez sur le bouton pour créer une nouvelle visite.
• Renseignez le nom de la visite et la catégorie ; vous pouvez aussi ajouter un lieu, un prix ou des étiquettes.
• Importez la première scène 360° et donnez-lui un nom clair.
• Dans l'éditeur, ajoutez des scènes supplémentaires, des points de navigation, des informations, des images, des vidéos, des liens externes et des groupes de scènes.
• Si vous souhaitez relier certains points au système de réservation, organisez-les avec des étiquettes internes.
• Publiez la visite et choisissez la visibilité appropriée.
• Après la publication, revenez dans Mes visites, ouvrez le menu à trois points et choisissez intégration.

En résumé, l'éditeur est l'endroit où vous construisez l'expérience 360°, et la fenêtre d'intégration est l'endroit depuis lequel vous placez la visite sur votre site et contrôlez où elle peut s'afficher.

Peut-on avoir des réservations dans la visite intégrée ?

Oui. Si vous avez configuré les réservations dans Tours, elles peuvent fonctionner également dans la visite intégrée sur votre site. Le visiteur peut explorer l'espace et envoyer une réservation ou une demande sans quitter la page.

• Réservation au niveau de la visite : vous pouvez afficher un bouton de réservation visible tout au long de la visite.
• Réservation au niveau d'une scène : vous pouvez activer la réservation uniquement dans certaines pièces ou zones.
• Réservation au niveau d'un groupe : vous pouvez regrouper plusieurs scènes, ce qui est utile pour différents types de chambres, d'appartements ou d'espaces.
• Réservation via un point interactif : un point dans la visite peut ouvrir une fenêtre de réservation pour une table, une chambre, un espace ou une demande de visite.
• Réservations par étiquette : plusieurs points interactifs peuvent partager le même calendrier s'ils sont reliés par la même étiquette.

Les réservations se configurent séparément, dans le Gestionnaire de réservations. C'est là que vous définissez les disponibilités, les règles de capacité, l'approbation manuelle ou automatique et les personnes qui gèrent les demandes. Vous connectez ensuite le gestionnaire à la visite, à certaines scènes, à des groupes de scènes ou à des points interactifs.

Si vous utilisez déjà un PMS, un gestionnaire de canaux ou d'autres plateformes de réservation, Tours peut fonctionner comme un canal visuel supplémentaire. Lorsque les disponibilités sont gérées à plusieurs endroits, l'approbation manuelle vous aide à éviter les chevauchements.

Que voit le visiteur dans la visite intégrée ?

Le visiteur voit exactement l'expérience que vous avez construite dans l'éditeur Tours. Ce n'est pas seulement une image panoramique posée sur la page, mais une visite interactive qui peut inclure la navigation, des informations, des liens, des réservations et des statistiques en arrière-plan.

• Des scènes 360° que le visiteur peut faire pivoter dans toutes les directions.
• La navigation entre pièces ou zones via des points interactifs.
• Des points d'information avec du texte, des images ou des vidéos.
• Des liens externes vers des menus, des catalogues, des pages produit ou des formulaires.
• Un bouton de réservation ou des points interactifs qui ouvrent une fenêtre de réservation.
• Du contenu en plusieurs langues, si vous l'avez configuré dans la visite.
• Des statistiques d'utilisation sur les visites, les scènes consultées et les interactions.

Pourquoi la visite ne s'affiche pas sur le site ?

Si vous avez placé le code sur votre site mais que la visite n'apparaît pas, cela ne signifie pas forcément que l'intégration est cassée. La plupart du temps, il manque un paramètre ou le code a été placé à un endroit qui ne l'affiche pas correctement.

• Vérifiez que la visite est publiée. Une visite non publiée ne s'affichera pas correctement sur le site.
• Vérifiez que l'intégration est active dans Mes visites → menu à trois points → intégration.
• Vérifiez les domaines autorisés. Le domaine de votre site doit figurer dans la liste acceptée.
• Assurez-vous d'avoir choisi la bonne variante de code : WordPress pour WordPress, Wix pour Wix, React pour React, Angular pour Angular et HTML pour les autres cas.
• Si vous utilisez Wix ou un constructeur visuel, agrandissez la hauteur de l'élément dans lequel vous avez placé la visite.
• Vérifiez si votre plateforme autorise le code HTML ou le code externe. Certains plans gratuits peuvent avoir des limitations.
• Publiez la page après avoir collé le code. Parfois la visite s'affiche en prévisualisation mais pas sur le site en ligne si les modifications n'ont pas été publiées.

Le test le plus rapide consiste à revenir dans la fenêtre d'intégration, à vérifier que l'intégration est active, que le domaine est autorisé et que le code choisi correspond à votre plateforme. Dans la plupart des cas, le problème se résout sans modifier quoi que ce soit dans la visite.

Comparaison avec d'autres plateformes de visites virtuelles

De nombreuses plateformes de visites virtuelles proposent une forme d'intégration sur site. La différence apparaît lorsque vous souhaitez aller au-delà du simple affichage : contrôle des domaines, réservations intégrées, statistiques d'utilisation, contenu multilingue ou variantes de code pour différentes technologies.

Pour Tours, l'objectif n'est pas seulement de placer une panoramique sur votre site, mais de faire de la visite une partie utile de votre page : présentation, interaction, réservation intégrée, demande de devis ou analyse de l'intérêt des visiteurs.

Si vous souhaitez tester l'intégration, commencez par une visite simple. Créez votre compte, publiez votre première visite, allez dans Mes visites, ouvrez l'intégration et copiez le code pour votre plateforme. En quelques minutes, vous pouvez avoir une visite à 360° affichée directement sur votre site, avec des points interactifs, des réservations intégrées et des statistiques d'utilisation prêts à l'emploi.