Développez les fonctionnalités de votre site Guesty en ajoutant du code HTML et des scripts personnalisés. Utilisez le widget HTML pour intégrer directement à vos pages des fonctionnalités tierces telles que des vidéos, des formulaires ou des calendriers. Vous pouvez également ajouter du code personnalisé global ou par page, avec un contrôle précis sur son emplacement de chargement sur votre site.
Important :
N'ajoutez que du code provenant de sources fiables. Analysez et testez systématiquement tout code personnalisé avant publication, et effectuez d'abord une sauvegarde de votre site.
Pour en savoir plus sur l'utilisation du HTML en mode développeur, consultez la section Mode développeur .
Comprendre où ajouter du code personnalisé
Vous disposez de deux options principales pour ajouter du code personnalisé :
- Code global : Appliquez le code globalement à toutes les pages en l'ajoutant à l'en-tête du site ou avant la balise de fermeture
<body>. - Code par page : Ajoutez du code à l’en-tête d’une page individuelle pour les scripts ou les styles qui ne doivent affecter que cette page.
Option 1 : Ajouter du code global au site (balises globales <head> ou <body> )
- Dans le panneau latéral, cliquez sur RÉFÉRENCEMENT NATUREL et paramètres .
- Cliquez sur En-tête HTML .
- En-tête HTML : Ajoutez du contenu à la section <head>. Utilisez ce champ pour les scripts globaux, les styles, les balises méta ou le code de vérification qui doivent apparaître dans
<head>sur toutes les pages. - HTML de fin du corps : Ajoutez du HTML ou du JavaScript personnalisé juste avant l’élément de fermeture
</body>sur chaque page.
- Collez votre code, puis cliquez sur Enregistrer .
Conseil :
Placez le code qui charge les ressources (comme les fichiers CSS ou les scripts généraux) dans la section <head>. Utilisez la section <body> pour les widgets ou les codes de données analytiques qui doivent se charger après le contenu de la page .
Pour plus de détails, consultez le guide du code personnalisé Duda .
Option 2 : Ajouter du code par page (en-tête de page unique)
- Dans le panneau latéral, cliquez sur Pages .
- Sélectionnez la page à laquelle vous souhaitez ajouter du code, puis cliquez sur l' icône d'engrenage des paramètres .
- Cliquez sur RÉFÉRENCEMENT NATUREL .
- Faites défiler vers le bas jusqu'à l'en-tête HTML .
- Collez votre code dans le champ et cliquez sur Enregistrer .
Cela ajoute du code uniquement à l' <head> de la page sélectionnée.
Ajoutez le widget HTML à votre site
Suivez les instructions ci-dessous pour ajouter le widget :
- Connectez-vous à votre compte Guesty .
- Dans la barre de navigation supérieure, cliquez sur le sélecteur de mode et sélectionnez le mode Croissance .
- Cliquez sur Distribution .
- Cliquez sur la vignette des Sites Internet Guesty .
- À droite du site web concerné, cliquez sur Modifier .
- Dans le panneau de gauche, cliquez sur + pour ouvrir les widgets.
- Faites défiler vers le bas jusqu'au widget HTML.
- Cliquez et faites glisser le widget HTML sur votre site.
En savoir plus sur l'ajout de widgets à votre site.
Utilisez l'éditeur de contenu du widget HTML
- Dans le bloc de contenu HTML, cliquez sur l'onglet Contenu .
- Collez ou saisissez votre code HTML personnalisé dans la zone de texte prévue à cet effet.
- Cliquez sur Mettre à jour pour enregistrer les modifications.
Utilisez l'éditeur de conception de widgets HTML
- Dans le bloc de contenu HTML, cliquez sur l'onglet Conception .
- Ajustez la mise en page, le style ou l'espacement du widget selon vos besoins.
Pour plus d'informations sur les options de conception générales, consultez la section Conception des widgets .
Important :
- Guesty ne peut pas dépanner votre code personnalisé.
- Les scripts côté serveur (comme PHP ou ASP) ne sont pas pris en charge. Seul le code côté client (JavaScript, HTML, CSS) s'exécute dans les widgets.
- Utilisez HTTPS pour toutes les ressources externes. Les liens non HTTPS ne se chargeront pas dans l'éditeur.
- Ne remplacez pas et ne réinitialisez pas jQuery. L'éditeur utilise jQuery 3.0 et son remplacement pourrait entraîner un dysfonctionnement de votre site.
- Si votre code utilise un événement
onloadet que la navigation rapide est activée, essayez de désactiver la navigation rapide si vous rencontrez des problèmes. - Créez toujours une sauvegarde avant d'ajouter ou de mettre à jour du code.
Ajouter des données connectées au widget HTML
Lors de la création de pages dynamiques, insérez des champs dynamiques issus d'une collection ou de la bibliothèque de contenu dans le widget HTML. Cette méthode permet d'afficher un contenu personnalisé propre à chaque instance de page, sans avoir à coder en dur toutes les valeurs de votre collection.
Par exemple, intégrez un podcast SoundCloud, un calendrier externe ou des widgets personnalisés qui changent pour chaque élément de votre collection. Stockez uniquement une valeur unique (comme un identifiant ou un slug) dans votre collection et intégrez-la au code de votre widget à l'aide des données connectées. En savoir plus sur les données connectées .
Suivez les instructions ci-dessous pour ajouter des données connectées :
- Connectez-vous à votre compte Guesty .
- Dans la barre de navigation supérieure, cliquez sur le sélecteur de mode et sélectionnez le mode Croissance .
- Cliquez sur Distribution .
- Cliquez sur la vignette des Sites Internet Guesty .
- À droite du site web concerné, cliquez sur Modifier .
- Dans le bloc de contenu HTML, cliquez sur l'onglet Contenu .
- Collez votre code HTML dans le champ, puis supprimez l'URL (la fin de l'URL) du code et enregistrez-la pour plus tard.
- Cliquez sur Mettre à jour .
- Dans la barre supérieure, cliquez sur Modifier la ligne .
- Collez l'URL que vous avez enregistrée à l'étape 2 dans le champ « Paragraphe de section » .
- Faites un clic droit sur votre widget HTML pour ouvrir le menu contextuel et cliquez sur Modifier le contenu .
- Cliquez sur Connecter , puis sélectionnez le champ de données auquel vous souhaitez connecter le widget.
- Cliquez sur Copier dans le presse-papiers , puis collez le contenu copié dans la section du code où se trouvait l'URL avant que vous ne la supprimiez à l'étape 2.
- Cliquez sur Mettre à jour .
Conseil :
Utilisez les données connectées dans le widget HTML pour adapter efficacement le contenu dynamique de votre site. Ne stockez que les modifications apportées à votre collection ; conservez le code HTML ou le code du widget partagé dans l’éditeur pour faciliter la maintenance.
Pour les options avancées, la résolution de problèmes pour développeurs et les spécificités de la plateforme, consultez le mode développeur .