Utilisez des widgets de base pour construire les fondations de votre site. Ces outils vous permettent d'ajouter des éléments essentiels comme du texte, des boutons et des éléments de navigation pour aider les visiteurs à trouver des informations et à passer à l'action.
Utilisez le widget Texte ou Titre pour créer des titres, partager des informations et présenter votre site aux visiteurs. Trois widgets de texte sont disponibles : Texte, Grand titre (H1) et Petit titre (H3).
Cliquez sur le widget pour ouvrir la barre d'outils intégrée permettant de styliser le texte comme suit :
- Utilisez l'assistant IA pour générer ou modifier du contenu.
- Appliquez une famille de polices et des styles de police, tels que le gras, l'italique ou le soulignement, à votre texte.
- Ajoutez ou modifiez les liens hypertextes.
- Créez des listes numérotées ou à puces.
- Connectez les données.
Vous pouvez également attribuer des styles spécifiques au thème du site pour gérer votre design globalement.
Incitez les visiteurs à agir en ajoutant des boutons. Les liens peuvent mener vers des pages, des articles de la boutique, des fenêtres contextuelles, des ancres ou des fichiers téléchargeables.
Cliquez sur le widget et sélectionnez l'onglet Contenu pour effectuer les actions suivantes :
- Sous « Texte du bouton », saisissez le texte correspondant au bouton.
- Sélectionnez la destination du lien.
- Utilisez l'outil « Audit des liens » pour garantir que votre bouton pointe vers l'emplacement attendu.
Cliquez sur le widget et sélectionnez l'onglet Design.
Note:
Les modifications apportées dans l'éditeur de design remplacent les styles définis au niveau du bouton du thème. Pour rétablir le style du bouton du thème, cliquez sur « Rétablir le style du thème ».
- Choisissez un thème principal ou secondaire et appliquez le style en conséquence.
-
Activez l'option Flottant pour que le bouton reste visible lorsque les visiteurs font défiler la page.
Utilisez des boutons flottants pour que les appels à l'action importants restent fixes, visibles et cliquables sur toutes les pages du site. Exemples d'utilisation :
- Contactez-nous
- S'abonner
- Obtenir un devis
N'activez cette option « Afficher sur cette page » que si nécessaire.
- Sur mobile, nous suggérons de placer le bouton flottant dans le coin inférieur de l'écran afin que les visiteurs puissent facilement cliquer dessus d'une seule main.
- Sur mobile, vous pouvez afficher une icône plutôt que du texte en choisissant la mise en page qui comporte une icône.
- Si un bouton flottant ne s'affiche pas sur mobile, il se peut que vous utilisiez une ancienne mise en page mobile. Pour la mettre à jour, accédez à l'éditeur de conception et cliquez sur Mise en page du site.
Utilisez le widget Espaceur pour créer une mise en page professionnelle et organisée et pour améliorer la lisibilité en ajoutant un espace vide vertical entre les widgets.
Cliquez sur le widget pour modifier sa hauteur.
Mettez à disposition des prospectus, des livres numériques ou des documents à télécharger. Les visiteurs de votre site peuvent partager vos liens de téléchargement par d'autres moyens, comme l'e-mail et les réseaux sociaux.
Avant de commencer
- Vous ne pouvez pas télécharger de fichiers dans votre dossier racine.
- Les fichiers téléchargés sont publics. Ne téléchargez que des fichiers dont vous êtes propriétaire ou pour lesquels vous disposez des autorisations nécessaires. Ne partagez pas de données confidentielles.
- Les formats pris en charge incluent
.pdf, .xls, .xlsx, .doc, .docx, .zip, .ppt, .pptx, .psd, .txt, .xml, .mp3, .ttf, .otf, .woff, .eot, .svg, .odt, .ott, .js, .css, .png, .jpg, .gif, .jpeg, .rar - Vous pouvez ajouter jusqu'à 15 000 fichiers par site. La taille limite des fichiers est de 200 Mo.
- Les espaces dans les noms de fichiers ne sont pas pris en charge.
- Cliquez sur le widget, puis sélectionnez l'onglet Contenu .
- Sous « Texte du bouton », saisissez le texte du bouton dans le champ prévu à cet effet.
- Cliquez sur + Fichier pour ajouter un fichier.
-
Pour ajouter de nouveaux fichiers, cliquez sur + Télécharger des fichiers .
Faites glisser vos fichiers ou cliquez sur « Choisir des fichiers » pour ajouter des fichiers ou des dossiers. Vous pouvez également télécharger des fichiers depuis Dropbox, Google Drive, un lien ou Gmail. Il est possible d'ajouter plusieurs fichiers simultanément.
- Sélectionnez les fichiers concernés et cliquez sur Télécharger . Vous serez averti une fois le téléchargement terminé.
- Sélectionnez le fichier concerné.
- Facultatif : Cochez la case « Ne pas indexer le fichier » pour empêcher les moteurs de recherche d'afficher le fichier dans les résultats de recherche.
- Cliquez sur Terminé .
Organisez les informations à l'aide de listes préformatées.
Pour des listes plus complexes, envisagez d'utiliser le widget de menu Restaurant.
- Cliquez sur le widget et sélectionnez l'onglet Contenu.
- Choisissez d'inclure un élément Image et l'élément Lien associé à chaque élément de votre liste.
- Cliquez sur "Créer votre liste" pour ajouter du contenu.
- Cliquez sur un élément de la liste pour ouvrir les "paramètres de la liste". Vous disposez des options suivantes:
- Cliquez sur + Image pour ajouter une image.
- Sous "Étiquette de l'article", saisissez le texte souhaité. Pour masquer l'étiquette, cliquez sur
. - Sous "Description", saisissez le texte de description souhaité. Pour masquer la description, cliquez sur .
- Cliquez sur " Ajouter un lien " pour sélectionner le type de lien que vous souhaitez ajouter à l'élément.
- Sous "Texte du lien", saisissez le texte du lien souhaité. Pour masquer le lien, cliquez sur .
- Cliquez sur + Ajouter un élément pour ajouter d'autres éléments à la liste.
- Sous "Titre de la liste principale", saisissez le titre de la liste dans le champ prévu à cet effet.
- Cliquez et faites glisser un élément pour le réorganiser.
Cliquez sur le widget et sélectionnez l'onglet Design pour personnaliser son style, notamment la mise en page, les styles de police, les bords arrondis des images et les styles de séparateurs.
Utilisez le widget Colonne pour organiser et agencer le contenu d'une ligne.
Important:
Créez une sauvegarde de votre site avant de modifier les colonnes afin de pouvoir restaurer une version précédente si nécessaire.
- Cliquez avec le bouton droit sur le widget pour ouvrir le menu de l'éditeur de colonnes.
- Si la colonne ne comporte pas de marge intérieure, cliquez avec le bouton droit sur le widget à l'intérieur de la colonne.
- Cliquez sur Sélectionner le conteneur .
- Sélectionnez la colonne.
- Vérifiez que l'en-tête du menu affiche « Colonne ».
- Modifiez chaque colonne individuellement comme suit :
-
Position
Pour modifier la position de la colonne, cliquez sur les flèches à droite ou à gauche.
Les flèches sont désactivées si la ligne ne contient qu'une seule colonne.
-
Ajouter
Cliquez sur + Ajouter et sélectionnez l'une des options suivantes :
- Colonne. Ajoutez une nouvelle colonne à la ligne actuelle. Vous pouvez ajouter jusqu'à 4 colonnes par ligne.
- Ligne interne. Ajoutez une ligne dans la colonne actuelle.
- Widget Ci-dessous. Ajoutez un nouveau widget directement sous le widget actuel. Vous pouvez choisir parmi les options suivantes : Texte, Image, Bouton, Icône, ou sélectionnez « Plus de widgets » pour ouvrir la bibliothèque complète.
-
Rembourrage
Pour supprimer l'espacement intérieur, cliquez sur Effacer le remplissage
-
Revenir
Pour rétablir les paramètres du thème, cliquez sur « Réinitialiser l’espacement par défaut ».
-
Animation
Cliquez sur Animation et sélectionnez un style d'animation, tel qu'un fondu ou un zoom, à appliquer à la colonne.
-
Cacher
Pour masquer la colonne sur les écrans d'ordinateur, de tablette ou de mobile, cliquez sur « Masquer de » et sélectionnez l'option correspondante.
-
Copie
Pour copier la colonne, cliquez sur Copier.
-
Ancre
- Pour ancrer la colonne à la page, cliquez sur « Définir comme ancre » et saisissez un nom. Cochez la case pour ajouter l'ancre à la navigation de votre site.
- Pour modifier le nom d'une ancre existante, cliquez sur Modifier l'ancre. Saisissez le nom et cliquez sur Mettre à jour.
- Pour supprimer une ancre existante, cliquez sur Modifier l'ancre. Cliquez ensuite sur Supprimer l'ancre.
-
Données de connexion
- Pour connecter des données, cliquez sur Connecter les données. Sous l'onglet « Connexion », sélectionnez l'option appropriée et cliquez sur Connecter.
- Pour modifier les données connectées, cliquez sur Connecter les données. Sélectionnez Modifier la connexion. Apportez les modifications nécessaires et cliquez sur Connecter.
- Pour modifier les données connectées, cliquez sur Connecter des données. Sélectionnez Modifier le contenu. Apportez les modifications nécessaires et cliquez sur Enregistrer.
-
- Pour supprimer la colonne, sélectionnez-la et cliquez sur Supprimer.
Pour modifier le style d'arrière-plan ou l'espacement d'une colonne :
- Cliquez sur le widget.
- Dans l'éditeur de conception, choisissez un type d'arrière-plan :
- Couleur :
- Choisissez une couleur unie ou un dégradé. Les couleurs dégradées remplacent les images et inversement.
- Personnalisez la couleur, la largeur et le rayon de la bordure.
- Activez l'effet d'ombre et sélectionnez une couleur, un type et une position.
- Image :
- Pour ajouter une image en arrière-plan, cliquez sur + pour ouvrir le sélecteur d'images.
- Sélectionnez l'image appropriée.
- Pour créer un diaporama d'images de fond, sélectionnez plusieurs images à l'aide du sélecteur d'images.
- Cliquez sur Terminer .
- Choisissez l'affichage de votre image : Couverture, Image pleine page, Mosaïque ou Aucune répétition.
- Configurez la position, le fond, la bordure et l'ombre de l'image.
- Pour ajouter une image en arrière-plan, cliquez sur + pour ouvrir le sélecteur d'images.
- Vidéo :
- Cliquez sur « Sélectionner une vidéo » pour choisir un fichier téléchargé, ou collez une URL depuis YouTube, Vimeo ou Dailymotion.
- Pour plus d'informations sur les arrière-plans vidéo, consultez la section Arrière-plans vidéo.
- Couleur :
Affichez les données en lignes et en colonnes. Vous pouvez saisir les données directement, coller un tableau existant ou importer un fichier CSV.
Avant de commencer
- Importez un fichier CSV, exporté et copié depuis Google Sheets ou Excel (langues non RTL uniquement).
- Les tableaux ne peuvent contenir que du texte et des liens. Utilisez des lignes et des colonnes ou les widgets Liste pour créer un tableau avec des images, des boutons ou d'autres widgets.
- L'éditeur de tableau n'est pas pris en charge par Edge version 17.
- Le tableau peut comporter jusqu'à 30 lignes et colonnes.
- Lorsqu'elle est connectée à des données, la limite de lignes correspond à la limite du type de collection :
Dans l'onglet Contenu , saisissez directement le texte dans l'éditeur ou cliquez sur Importer un fichier CSV pour ajouter des données au tableau.
Utilisez « Tout effacer » pour supprimer toutes les données de votre tableau.
Cliquez sur le widget et sélectionnez l'onglet Design pour ajuster les couleurs des lignes et la largeur des colonnes.
Sur mobile, choisissez entre les affichages Squish, Scroll ou Collapse.
Le widget Tableau synchronise les données provenant de sources internes ou externes telles que Google Sheets et Airtable, vous permettant ainsi de gérer le contenu en dehors de l'éditeur. Il lie automatiquement les lignes aux pages dynamiques existantes de la même collection pour une navigation simplifiée.
Les tables connectées assistent les types de champs suivants :
- Texte enrichi
- Texte brut
- Image
- Lien
- Nombre
- Date et heure
- Sélection multiple
- Téléphone
Connectez le widget de tableau à une collection
- Cliquez avec le bouton droit sur le widget Tableau et cliquez sur Connecter aux données.
- Dans l'onglet « Connexion », sélectionnez une collection dans le menu déroulant.
- Sélectionnez les champs souhaités dans les options « Champs à afficher ». Les colonnes seront affichées dans l’ordre de sélection.
- Cliquez sur Connecter.
- Une connexion de données réussie est signalée par
lorsque vous survolez le widget Tableau.
Liste des ingrédients
Liste de prix
Liste des emplacements
Liste des saveurs
Aidez les visiteurs à naviguer dans l'arborescence de votre site. Le fil d'Ariane indique le chemin vers la page actuelle, ce qui améliore l'expérience utilisateur et le référencement naturel.
- Cliquez sur le widget et sélectionnez l'onglet Contenu.
- Activez ou désactivez les éléments que vous souhaitez afficher dans le fil d'Ariane. Vous avez les options suivantes :
- Page d'accueil. Afficher systématiquement la page d'accueil dans le fil d'Ariane.
- Page actuelle. Afficher la page actuelle dans le fil d'Ariane.
- Masquer le fil d'Ariane lorsqu'il n'y a pas de page parente. Active le fil d'Ariane pour toutes les pages sauf la page d'accueil ou les pages du premier niveau de navigation.
Cliquez sur le widget et sélectionnez l'onglet Design pour styliser la police, puis sélectionnez un style de séparateur pour séparer les noms de page.
Organisez le contenu en sections extensibles, comme une FAQ ou une section présentant les produits phares. Cela réduit le défilement et aide les visiteurs à trouver rapidement l'information.
Le widget Accordion peut afficher des pages dynamiques ainsi que des informations spécifiques sur une collection ou un produit grâce à la liaison en ligne .
- Cliquez sur le widget et sélectionnez l'onglet Contenu .
- Ajoutez ou modifiez les champs :
- Articles:
- Cliquez sur un élément pour modifier son contenu
- Pour dupliquer un élément, cliquez
sur dupliquer un élément - Pour ajouter un nouvel élément, cliquez sur + Ajouter un élément .
- Règles d'affichage :
- Activez l'option « Afficher un élément développé à la fois » pour permettre l'ouverture simultanée de plusieurs éléments.
- Activez l'option « Afficher le premier élément développé » pour développer le premier élément de la liste.
- Référencement Naturel : Activez l’option « Activer le schéma FAQ » pour aider les moteurs de recherche à prévisualiser votre contenu.
- Articles:
Cliquez sur le widget et sélectionnez l'onglet Design pour personnaliser son style.
Utilisez les balises H3 pour le référencement naturel et optimisez l'espacement pour les appareils mobiles.
Présentez les contenus connexes, tels que les services ou les forfaits, dans des sections compactes. Les visiteurs peuvent cliquer sur les onglets pour consulter différentes informations sans quitter la page.
Note:
Vous pouvez avoir un nombre illimité d'onglets, cependant, les étiquettes des onglets rétrécissent à mesure que de nouveaux onglets sont ajoutés pour faire de la place à ces derniers.
- Cliquez sur le widget et sélectionnez l'onglet Contenu.
- Cliquez sur un onglet pour le modifier. Vous pouvez modifier l'image, le texte alternatif de l'image, le libellé de l'onglet, le type de titre du libellé, le titre, la description, le bouton et le lien du bouton.
- Pour ajouter un nouvel onglet, cliquez sur + Ajouter un onglet.
- Pour afficher l'image, activez l'option Afficher l'image.
- Cliquez sur le widget et sélectionnez l'onglet Design.
- Cliquez sur la vignette de la mise en page pour sélectionner une mise en page.
- Cliquez sur Tous les onglets pour personnaliser le style des onglets.
- Cliquez sur l'onglet sélectionné et survolez-le pour personnaliser le style du texte et l'arrière-plan. Cela n'affecte pas l'apparence de tous les onglets.
- Appliquez un style supplémentaire aux éléments suivants :
- Style de Description
- Style de bouton
- Style d'image
- Style de cadre
Intégrez un widget de recherche permettant aux voyageurs de sélectionner leurs dates de séjour. Une fois leurs dates choisies, les voyageurs sont redirigés vers votre moteur de réservation Guesty pour sélectionner une propriété.
Le filtre de destination extrait automatiquement les données des champs « adresse de la ville » de vos annonces. Vous pouvez personnaliser ces valeurs pour afficher les quartiers ou les régions au lieu des villes, mais cela peut affecter la connexion avec des plateformes comme Airbnb, Booking.com et Vrbo en raison de leurs exigences en adresse.
Par défaut, le widget du Moteur de réservation est intégré à votre page d'accueil lorsque vous commencez à créer votre site Web Guesty.
- Cliquez sur le widget et sélectionnez l'éditeur de contenu.
- Facultatif : sélectionnez dans le menu déroulant l'emplacement des propriétés que vous souhaitez afficher.
- Facultatif : sélectionnez vos dates d'arrivée et de départ
Cliquez sur le widget et sélectionnez l'éditeur de design pour personnaliser le bouton.
Ajoutez une mention de droits d'auteur qui se met à jour automatiquement pour l'année en cours. Cela indique aux visiteurs que votre site est actif et à jour.
- Cliquez sur le widget et sélectionnez l'onglet Contenu.
- Sous «Description», saisissez votre texte de clause de non-responsabilité dans le champ de texte prévu à cet effet.
-
Activez l'inversion de l'icône/de l'année si nécessaire.
Le widget de copyright s'affiche sur chaque page de votre site.
Cliquez sur le widget et sélectionnez l'onglet Design pour modifier la police, la couleur et l'alignement du texte.
Conseil:
Faites glisser le widget à l'emplacement souhaité. Par défaut, il se trouve tout en bas de la page.
Mettez en valeur des propriétés spécifiques en fonction de critères tels que la localisation ou les équipements. Utilisez ce widget sur vos pages d'accueil pour améliorer votre référencement sur Google.
Ajoutez des titres accrocheurs comme « Appartements avec piscine à Amsterdam » et proposez des options de filtrage et de tri pour aider les visiteurs à trouver la propriété idéale. Lorsqu'ils recherchent des appartements avec piscine à Amsterdam en ligne, les voyageurs sont plus susceptibles d'accéder à votre page et de réserver via votre site web. Créez autant de pages de destination ciblées que nécessaire pour que vos propriétés soient facilement accessibles.
Lorsqu'un visiteur clique sur une propriété dans le widget, il est redirigé vers votre Moteur de réservation Guesty pour commencer la réservation. S'il filtre ou trie les résultats, il ne voit que les annonces correspondant à sa sélection.
Pour une page de destination optimale, combinez les widgets suivants :
- Widget de barre de recherche de Réservation : ajoutez une barre de recherche en haut de la page pour permettre aux voyageurs de réserver facilement. Préremplissez les champs « Lieu » et autres en fonction du contenu de la page (par exemple, définissez le lieu sur « Amsterdam » pour la page de vos appartements avec piscine).
- Widget « Propriétés en vedette » : placez-le sous la barre de recherche pour mettre en avant vos meilleures propriétés. En savoir plus .
- Widget de résultats de recherche Référencement Naturel : ajoutez votre titre principal (comme « Appartements avec piscine à Amsterdam ») et affichez votre sélection d'annonces complète avec des options de recherche et de filtre.
Ajoutez le widget de résultats de recherche Référencement Naturel à une page de destination dédiée avec une URL claire, ou à votre page d'accueil. Vous pouvez également l'ajouter à n'importe quelle page sans le combiner avec d'autres widgets. Il vous suffit de le glisser-déposer à l'endroit souhaité.
- Cliquez sur le widget et sélectionnez l'onglet Contenu.
- Sous « Propriétés à afficher aux voyageurs lorsqu'ils arrivent sur cette page », sélectionnez l'emplacement correspondant dans le menu déroulant.
- Sous « Étiquettes des annonces (catégories) », sélectionnez les étiquettes de catégorie pertinentes.
- Sélectionnez le nombre de chambres et de salles de bains, puis saisissez le tarif journalier de l'annonce.
- Sélectionnez l'une des options d'affichage suivantes :
- Prix - du plus bas au plus élevé
- Du nouveau au vieux
- Du vieux au nouveau
- Sous « Autoriser les voyageurs à filtrer et trier », activez les options de filtre souhaitées :
- Activer les filtres pour les voyageurs
- Activer le tri pour les voyageurs
- Cliquez sur Appliquer.
Cliquez sur le widget et sélectionnez l'onglet Design pour ajouter une animation et un espacement au widget.
Cochez la case « Afficher plus » pour permettre aux visiteurs de voir davantage de propriétés.
Mettez en valeur vos annonces les plus performantes ou de luxe grâce au widget Propriétés. Idéal pour les pages d'atterrissage où vous souhaitez faire ressortir certaines propriétés. Glissez-déposez le widget où vous le souhaitez sur votre site web ou sur une page d'atterrissage dédiée.
- Cliquez sur le widget et sélectionnez l'onglet Contenu.
- Recherchez et sélectionnez les propriétés que vous souhaitez présenter.
- Vous pouvez sélectionner jusqu'à 30 propriétés par widget.
- Le statut de l'annonce doit être « Répertoriée ».
- Cliquez sur + Ajouter un filtre pour affiner les résultats par équipements, type de propriété et/ou emplacement.
- Dans l'onglet « Sélectionné », vous pouvez faire glisser les propriétés pour modifier l'ordre d'affichage.
-
Cliquez sur Enregistrer.
Conseil:
Vous pouvez ajouter plusieurs widgets de propriétés et configurer différents groupes de propriétés mises en avant à afficher sur chacun d'eux.
Ajoutez des images avec du texte qui s'adapte automatiquement à l'image.
Note:
Faites un clic droit et sélectionnez « Se connecter aux données » pour utiliser le contenu dynamique.
- Cliquez sur le widget et sélectionnez l'onglet Contenu .
- Sélectionnez la position de l'image : gauche ou droite.
- Cliquez sur la vignette de l'image pour la sélectionner.
- Pour ajouter un lien, cliquez sur « Lien vers l’image » et sélectionnez l’emplacement du lien souhaité.
- Sous « Texte alternatif », saisissez le texte requis si le champ est prévu à cet effet.
- Sous « Paragraphe », saisissez le texte souhaité.
Cliquez sur le widget et sélectionnez l'onglet Design pour ajuster les propriétés de la police et de l'image.
Ajoutez un compte à rebours en temps réel à votre site pour dynamiser l'engagement et créer un sentiment d'urgence en mettant en évidence le temps limité restant pour les soldes, les événements et les promotions.
- Cliquez sur le widget et sélectionnez l'onglet Contenu.
- Indiquez la date de fin du compte à rebours dans le champ prévu à cet effet.
- Indiquez l'heure de fin du compte à rebours dans le champ prévu à cet effet. Saisissez une heure précise, par exemple, 23h45 si nécessaire.
- Sélectionnez un fuseau horaire dans le menu déroulant.
- Sous "message de fin de compte à rebours", saisissez dans le champ de texte le message qui s'affiche lorsque le compte à rebours est terminé.
- Sélectionnez "Afficher le compteur à 0000 et le message en dessous" ou "Supprimer le compteur et afficher uniquement le message".
- Sous « Titre », saisissez le texte souhaité pour le compte à rebours dans le champ prévu à cet effet. Pour masquer le titre, cliquez sur .