L'éditeur en un coup d'œil
En haut se trouve la barre d'en-tête : « ← Vos sites web » ramène à la vue d'ensemble, « Choisir la page » bascule entre la page d'accueil et les sous-pages, « Ordinateur », « Tablette » et « Mobile » changent l'aperçu, ↶ et ↷ annulent et rétablissent. À côté, vous voyez si tout est enregistré, ce qui reste libre dans votre barre IA, « Emporter », l'état de la page et, tout à droite, « Publier ».
À gauche, les espaces de travail sont répartis en trois groupes : sous « Personnaliser le site », « Site web », « Sections », « Pages et menu », « Menu et pied de page », « Couleurs et police » et « Modifier avec Kenji » ; sous « Connecter des outils », ShopBuilder, FormBuilder et DomainStudio ; sous « Gérer », « Réglages », « Membres », « Sur Google » et « Entreprise ». Au centre se trouve votre vraie page, à droite l'outil correspondant à ce sur quoi vous cliquez.
« Réglages » réunit l'essentiel d'un site web : « Nom du site » et « Langue du site » — la langue s'applique aux mots fixes comme les boutons, le contact et les messages d'erreur ; vos textes ne sont pas traduits —, ainsi que « Emporter » et « Supprimer le site ». Pour tout ce qui a déjà sa place, seul le chemin pour y accéder y figure : « Sur Google », « Membres » et « Adresse dans DomainStudio ». Si le site web porte une marque, elle y figure avec « Attribuer dans BrandStudio ».
Sur les écrans plus petits, y compris sur de nombreux ordinateurs portables, l'éditeur affiche une colonne à la fois : en bas, vous basculez entre « Sections », « Aperçu » et « Outil », et les espaces de travail se trouvent derrière « Choisir l’espace de travail ». Sur mobile, l'indicateur IA, « Emporter », l'état de la page et « Mettre hors ligne » se trouvent derrière « Afficher plus ».
L'enregistrement se fait automatiquement. Si la barre d'en-tête indique « Non enregistré », une ligne rouge en donne la raison, avec « Enregistrer à nouveau » à côté.
Saisir directement dans la page
Vous modifiez les titres, les paragraphes, les libellés des boutons et les points des listes là où ils se trouvent : cliquez dans le texte et écrivez. L'aperçu est votre vraie page, pas une reproduction à côté.
Entrée valide, Échap restaure l'ancien texte. Un texte tient toujours sur une seule ligne — les retours à la ligne deviennent des espaces. Dans l'éditeur, les liens ne mènent nulle part ; un clic ne fait que sélectionner.
L'enregistrement a lieu peu après la saisie, dans le brouillon. Rien ne change en ligne tant que vous n'avez pas publié.
- Dans l'aperçu, cliquez sur le texte que vous voulez modifier.
- Écrivez le nouveau texte.
- Appuyez sur Entrée ou cliquez à côté pour le valider — Échap annule ce que vous avez saisi.
La saisie ne consomme pas de crédit IA.
Ce que contient le pied de page
Vous remplissez le pied de page dans l'espace « Menu et pied de page », sous « Pied de page ». Les lignes de contact proviennent des données de votre entreprise et se gèrent là-bas. Sous « Lier des pages existantes », vous définissez pour chaque page si elle est « Pas dans le pied de page », dans la « Liste de liens » ou parmi les « Liens juridiques » — indépendamment de sa présence dans le menu en haut. Seules les pages publiques y apparaissent, jamais une page réservée aux membres.
Les « Liens personnalisés » se composent d'un libellé et d'une destination : une page de votre site web, une section ou une adresse avec https://, mailto: ou tel:. Le champ n'accepte pas une destination non sécurisée. Sous « Réseaux sociaux », vous choisissez la « Source des profils » — les données de votre entreprise ou des profils propres au pied de page, dix au maximum ; les réseaux connus apparaissent avec leur icône et leur nom pour les lecteurs d'écran.
Avec « Colonnes personnalisées », vous organisez jusqu'à quatre colonnes avec un titre, chacune comptant jusqu'à dix entrées : pages, liens, contact, réseaux sociaux. « Conclure par une action » place un bouton à la fin ; sans texte propre, il reprend le bouton de l'en-tête. La « Note de pied de page » est une ligne libre en bas de page. Le pied de page renvoie automatiquement vers les mentions légales de votre marque.
- Ouvrez « Menu et pied de page » et choisissez « Pied de page » en haut.
- Ouvrez une zone, par exemple « Liens personnalisés », saisissez le libellé et la destination du lien, puis cliquez sur « Ajouter un lien ».
- Vérifiez « Aperçu de votre pied de page » et cliquez sur « Enregistrer le design ».
Un lien commencé ou un profil à moitié saisi doit d'abord être ajouté ou vidé, sinon la mise en forme ne peut pas être enregistrée.
Intégrer votre boutique à la page
Si vous avez une boutique dans ShopBuilder ai, vous pouvez l'intégrer à votre site web de deux façons : comme section à part entière sur une page ou comme élément du menu. Un clic sur « ShopBuilder » dans la barre affiche vos boutiques à côté de la page, chacune avec ses produits actifs et ses catégories : « Insérer » l'ajoute comme nouvelle section après celle que vous avez sélectionnée, « Dans le menu » l'inscrit comme élément du menu. Dans la section, vous choisissez à droite l'« Affichage » : « Catalogue » présente votre offre au cœur de la page, « Bouton uniquement » mène à la boutique par un bouton. Vous pouvez aussi ajouter la section via « + Ajouter une section » → « Boutique » et choisir la boutique à droite.
Ce que la section affiche se règle à droite sous « Que montrer ? » : « Tout le catalogue », « Une catégorie » ou « Des produits choisis » — 24 au maximum, dans l'ordre où vous les cochez, réorganisables avec ↑ et ↓. S'y ajoutent « Ordre », « Au maximum » (0 signifie : tout afficher), le « Champ de recherche au-dessus des produits » et « Afficher les catégories comme filtres » ; le champ de recherche est proposé à partir de quatre produits dans la sélection, les catégories à partir de deux. La même boutique peut figurer plusieurs fois sur une page, chaque section avec sa propre sélection ; si vous choisissez une autre boutique dans une section, sa sélection repart de zéro. Si vous renommez une catégorie dans ShopBuilder, la section vous le signale et vous refaites votre choix.
Le catalogue reprend les couleurs et la police de ce site web pour ne pas détonner ; le design enregistré de votre boutique reste intact. L'achat se fait toujours dans la boutique : chaque clic sur un produit ou vers le panier mène à l'adresse de votre boutique, où se trouvent la caisse et le paiement. Il n'existe pas de seconde caisse dans le site web.
Seules vos propres boutiques sont proposées. Sous la sélection, vous voyez l'état de la boutique : « Boutique accessible », « Cette boutique n’a pas encore de produits actifs. » — seul le bouton apparaît alors — ou « Cette boutique n’est pas encore accessible au public. » Les visiteurs ne voient pas une boutique à l'état de brouillon ; une courte phrase s'affiche à sa place.
- Sélectionnez dans la page la section après laquelle la boutique doit apparaître, puis cliquez à gauche sur « ShopBuilder » sous « Connecter des outils ».
- À côté de la page, cliquez sur « Insérer » au niveau de votre boutique — ou sur « Dans le menu ».
- À droite, réglez sous « Affichage » et « Que montrer ? » ce que la section affiche.
- Publiez le site web ; ce n'est qu'à ce moment-là que la liaison apparaît.
« Plus d’options » sous la liste ouvre l'espace large : vous y choisissez la boutique, l'affichage et la sélection avant même l'insertion, puis vous cliquez sur « Insérer sur cette page » ou « Ajouter au menu ». Vous gérez les produits, les prix et les commandes dans ShopBuilder ai — plus d'informations dans le chapitre ShopBuilder ai.
Ajouter, ordonner, dupliquer et supprimer des sections
Chaque page est une suite de sections. Via « Sections », vous ouvrez la liste à gauche : en haut l'« En-tête », en dessous les sections dans l'ordre de la page. Un clic vous y amène dans l'aperçu.
Vous ajoutez de nouvelles sections avec « + Ajouter une section » ; le catalogue « Quel type de section ? » présente chaque type avec un petit dessin. La nouvelle section se place après celle qui est sélectionnée. Pour réordonner, faites glisser ou utilisez les flèches ↑ et ↓ — cela fonctionne aussi sans souris.
À droite de la section sélectionnée se trouvent « Dupliquer la section » — la copie est créée sans image — et « Supprimer la section », avec une demande de confirmation. Une page peut contenir jusqu'à 14 sections ; chaque sous-page a sa propre liste.
- Cliquez à gauche sur « Sections ».
- Sélectionnez une section, cliquez sur « + Ajouter une section », puis sur un type.
- Faites glisser les sections à leur place ou utilisez ↑ et ↓.
- Pour supprimer : cliquez sur la section, puis à droite sur « Supprimer la section », puis sur « Oui, supprimer ».
Rien de tout cela ne consomme de crédit IA, et « Annuler » rétablit une section supprimée.
Dix types de sections
« Texte » pour tout ce qui est narratif, avec une image si vous le souhaitez. « Prestations » pour des points côte à côte. « Contact » avec adresse, téléphone, e-mail, horaires d'ouverture et un formulaire qui envoie réellement. « Appel à l’action » est un bandeau coloré avec un bouton. « Questions & réponses » se déplie et se replie. « Témoignages » affiche des citations, « Tarifs » des offres sous forme de cartes d'information sans caisse. « Image » est une grande image avec légende, « Formulaire » intègre un formulaire de FormBuilder ai, « Boutique » votre boutique.
Les prestations, les questions & réponses, les témoignages et les tarifs se composent de « Points ». Vous les gérez à droite : deux champs par point, « + Ajouter un point » jusqu'à douze, ↑ et ↓ pour réordonner, ✕ pour supprimer. Les nouvelles sections arrivent avec des textes provisoires neutres — pas de témoignages inventés, pas de prix inventés.
Les questions et réponses sont en outre intégrées à la page sous une forme lisible par les machines, afin que Google puisse les reconnaître. Il n'y a volontairement pas d'autres types : chacun doit rendre bien dans tous les styles et fonctionner sur mobile.
- Dans l'aperçu, cliquez sur une section avec des points, par exemple « Tarifs ».
- Modifiez les champs à droite sous « Points » ; la modification est appliquée dès que vous quittez un champ.
- Cliquez sur « + Ajouter un point » pour ajouter un point supplémentaire.
Les textes provisoires des nouvelles sections existent en allemand et en anglais ; sur un site web dans une autre langue, vous les remplacez directement.
L'en-tête
L'en-tête de chaque page propose trois structures : « Texte centré » — une image, s'il y en a une, se place en dessous —, « Image en arrière-plan » avec une image assombrie et un texte clair, et « Texte à gauche, image à droite ». « Image en arrière-plan » nécessite une image ; s'il n'y en a pas, la page affiche « Texte centré », et à droite s'affiche au préalable « Il faut une image pour cela — choisissez-en une ci-dessous. »
Vous saisissez le titre, la phrase en dessous et le libellé du bouton directement dans la page. Sans libellé, la page publiée n'a pas de bouton. Vous choisissez où il mène sous « Le bouton mène à » (voir Les boutons pointent vers des pages). La barre d'en-tête affiche le même bouton en haut à droite s'il existe une section de contact ou si le bouton a une destination.
- Cliquez sur « En-tête » dans la liste des sections, ou cliquez en haut de la page dans l'aperçu.
- Choisissez à droite, sous « Structure », l'une des trois formes.
- Si besoin, ajoutez une image avec « Choisir une image ».
Se passer d'image n'est pas un pis-aller : un en-tête sobre avec une phrase claire est souvent une meilleure entrée en matière qu'une photo de banque d'images.
Arrière-plan, côté de l'image, alignement
Pour chaque section, vous choisissez à droite un « Arrière-plan » : « Comme la page », « Surface claire » ou « Accent doux ». Pour « Texte », vous définissez sous « Image à côté du texte » si une image se place à gauche, à droite ou pas du tout à côté ; « Alignement » place le texte « À gauche » ou « Centré ».
Ces quelques réglages donnent son rythme à la page — des bandes alternées séparent mieux les thèmes que n'importe quelle ligne. La bande « Appel à l’action » repose toujours sur la couleur d'accent ; son arrière-plan ne peut pas être modifié.
- Dans l'aperçu, cliquez sur une section.
- Choisissez à droite « Arrière-plan », pour les sections de texte « Image à côté du texte », et « Alignement ».
Aperçu par appareil
Avec « Ordinateur », « Tablette » et « Mobile » dans la barre supérieure, vous voyez la page en pleine largeur, puis sur 768 et 390 pixels de large. Ce n'est pas une imitation, mais votre page dans un cadre plus étroit — elle se réorganise exactement comme chez le visiteur, y compris le menu qui se déplie sur mobile.
La plupart des visiteurs arrivent depuis un mobile. Y jeter un œil avant de publier est le test le moins coûteux qui soit.
- Cliquez en haut sur « Mobile ».
- Faites défiler la page et vérifiez le menu, les images et les boutons.
- « Ordinateur » vous ramène à la pleine largeur.
Annuler et rétablir
↶ et ↷ dans la barre supérieure annulent des étapes et les rétablissent — jusqu'à cinquante, tant que l'éditeur est ouvert. C'est prévu pour la page elle-même : les textes saisis, les sections que vous avez ajoutées, déplacées, dupliquées ou supprimées, les points d'une section, la police et une modification faite par Kenji.
« Annuler » n'annule pas ce qui est enregistré par une voie distincte : les informations sous « Entreprise », « Sur Google », « Pages et menu », « Menu et pied de page » et « Membres ». Une fois l'éditeur fermé, l'historique disparaît ; la page publiée n'en est pas affectée tant que vous ne publiez pas à nouveau.
- Cliquez sur ↶ (Annuler) pour annuler la dernière étape.
- Cliquez sur ↷ (Rétablir) pour la rétablir.
Annuler ne consomme pas de crédit IA. Si vous annulez une modification faite par Kenji, le crédit IA utilisé pour celle-ci reste consommé.
Modifier avec Kenji
Au lieu de chercher des champs, vous dites à Kenji ce qui doit changer : « Raccourcis le titre et ajoute une section sur notre petit-déjeuner. » Vous lui parlez dans la fenêtre de Kenji, en bas à droite — la même fenêtre que partout sur KENJTEC. En haut, elle indique ce sur quoi vous travaillez : l'outil, le nom de votre site, la page ouverte et la section que vous avez choisie. Kenji réécrit la page actuellement affichée dans l'aperçu, et la modification arrive dans le brouillon. Kenji peut réécrire des textes, ajouter, réorganiser ou supprimer des sections, et faire chercher une nouvelle image pour un emplacement.
Kenji répond par des mots : il dit d'abord en une phrase ce qu'il fait, puis l'éditeur modifie la page, et en dessous s'affiche « C’est fait — la modification est dans le brouillon. Elle ne sera en ligne qu’avec « Publier ». » Si vous posez seulement une question, par exemple « Que puis-je améliorer sur cette page ? », il répond au lieu de modifier quoi que ce soit. Si vous venez de taper quelque chose, l'éditeur l'enregistre d'abord ; si cela échoue, Kenji ne modifie rien et la fenêtre affiche « Enregistrez d’abord — votre dernière version n’est pas encore sauvegardée. »
Restent intacts : vos données d'entreprise, les pages et le menu, la mise en forme du menu et du pied de page, les réglages sur Google, vos propres couleurs, les paramètres de votre marque et votre code en mode développeur. Une phrase adressée à Kenji ne modifie donc pas les couleurs que vous avez choisies vous-même ou qui viennent de la marque — c'est à cela que sert « Couleurs et police ».
Si le résultat ne vous plaît pas, « Annuler » dans l'éditeur rétablit l'état précédent.
- Dans l'éditeur, cliquez à gauche sur « Modifier avec Kenji » — ou en bas à droite sur le bouton rond avec le K.
- Écrivez ce que vous voulez dans le champ « Dites ce qui doit changer — ou posez-moi une question… » et appuyez sur Entrée.
- Attendez que « C’est fait » s'affiche dans la fenêtre et que l'aperçu montre le nouvel état.
Chaque modification dans la conversation consomme du crédit IA, et si elle échoue, rien n'est facturé. Si votre barre IA est vide, elle se remplit à nouveau d'elle-même, ou vous ajoutez un pack IA — voir Compte et facturation.
Propositions de texte pour un emplacement
Si un texte isolé ne convient pas, vous obtenez des propositions pour cet emplacement précis. Sous « Entreprise » → « Textes » se trouvent les textes de la page d'accueil : « Titre dans l'en-tête », « Phrase en dessous », « Libellé du bouton », « Sous-titre du site », le titre et le texte de chaque section, et la « Ligne du pied de page ».
Vous pouvez y modifier le texte à la main et le valider avec « Appliquer ». Ou vous utilisez l'un des quatre boutons : « Plus court », « Plus long », « Autre ton » ou « Trois propositions ». Kenji fournit trois versions, affichées les unes sous les autres, et seul votre clic en insère une. D'ici là, votre texte reste tel quel.
- Cliquez à gauche sur « Entreprise » et ouvrez « Textes ».
- Dépliez l'emplacement que vous voulez modifier.
- Cliquez sur « Plus court », « Plus long », « Autre ton » ou « Trois propositions ».
- Cliquez sur la version qui vous plaît — elle est aussitôt dans le brouillon.
Les propositions consomment du crédit IA ; appliquer une version ou modifier le texte à la main n'en consomme pas.