🔒La création visuelle (le compositeur)

#31.0 — Le plus simple : « Refaire le site »

Vous n'avez rien à apprendre pour refaire votre site. Depuis le tableau de bord, cliquez sur « Préparer une nouvelle version du site ». Un assistant vous guide en huit étapes, et vous n'avez jamais à choisir quel écran ouvrir : il y a un bouton « Étape suivante », et c'est tout.

1. Choisir l'apparence — trois propositions avec une miniature. Le système crée pour vous une version privée et y installe l'apparence choisie.
2. Nom, logo et couleurs — les couleurs n'appartiennent qu'à votre nouvelle version.
3. Haut du site — l'assistant vérifie l'identité, le menu et la recherche, et vous dit quoi corriger s'il manque quelque chose.
4. Page d'accueil — vous cochez ce que vous voulez montrer : bienvenue, actualités, agenda, démarches, horaires, coordonnées, alerte. Les blocs se remplissent tout seuls avec vos informations.
5. Bas du site — adresse, téléphone, horaires, liens. Les mentions obligatoires sont ajoutées d'office.
6. Vérification — ce qui bloque est séparé de ce qui mérite juste un coup d'œil.
7. Aperçu privé — votre site entier, sur ordinateur, tablette et téléphone.
8. Mettre en ligne — un résumé de ce qui change et de ce qui ne change pas, puis un seul bouton.

> À aucun moment les habitants ne voient votre travail avant que vous n'ayez cliqué « Mettre cette version en ligne ». Et juste après, un bouton « Revenir à la version précédente » remet le site exactement comme avant.

Vous pouvez quitter à tout moment : tout est enregistré, et l'assistant vous propose de reprendre là où vous en étiez.

Pour corriger une seule page, choisissez « Modifier une seule page » : vous cliquez dans la page, vous corrigez, vous publiez. Rien d'autre.

#31.1 — À quoi ça sert ?

Le compositeur permet de construire une page en posant des blocs, sans écrire de code : un titre, un texte, une image, un bouton, des colonnes. Vous voyez le résultat pendant que vous travaillez.

Il sert aussi à composer l’habillage du site lui-même : l’en-tête (le haut de toutes les pages), le pied de page, la page d’accueil et la page « introuvable ».

> Vous n’êtes pas obligée de l’utiliser. Une page ordinaire, rédigée dans l’éditeur de texte habituel, reste parfaitement valable.

#31.2 — Ouvrir le compositeur sur une page

1. Pages › ouvrez la page › bouton Création visuelle.
2. Au premier passage, on vous demande par où commencer : page vierge, modèle à adapter, ou reprise du contenu existant.
3. Posez des blocs depuis le panneau + Ajouter, à gauche.
4. Cliquez un bloc dans la page pour le modifier : ses réglages apparaissent à droite.

Vos modifications sont enregistrées automatiquement, mais elles ne sont pas en ligne tant que vous n’avez pas cliqué sur Publier.

#31.3 — Les blocs les plus utiles

Les sections toutes prêtes (Annoncer des travaux, Informations école, Annoncer une fête, Horaires par service, Questions fréquentes…) se trouvent dans + Ajouter › Compositions.

#31.4 — Ordinateur, tablette, mobile

Les trois icônes en haut changent la largeur d’affichage.

• Ce que vous réglez sur Ordinateur s’applique partout.
• Ce que vous réglez sur Tablette ou Mobile ne vaut que là ; les valeurs héritées apparaissent en grisé.
• Vérifier toutes les largeurs essaie 42 tailles d’écran et signale ce qui dépasse.

#31.5 — Les vérifications

Le bouton ✔︎ liste ce qui gêne la lecture ou l’accessibilité : contraste insuffisant, titre principal absent ou en double, image sans description, bloc qui déborde.

Chaque signalement propose voir (aller au bloc) et souvent corriger (appliquer la correction). Une correction s’annule comme le reste, par Ctrl+Z (Cmd+Z sur Mac).

> La description d’une image n’est jamais inventée à votre place : vous seule savez ce qu’elle montre.

#31.6 — Trouver une commande : « Que faire ? »

Le bouton 🔎 Que faire ? (ou Ctrl+K / Cmd+K) ouvre une recherche : tapez « publier », « accordéon », « horaires », « aide en-tête »… et laissez-vous conduire. Les accents ne sont pas nécessaires.

#31.7 — L’habillage du site : en-tête, pied, accueil

Site › Habillage du site. Vous y composez les quatre zones communes à toutes les pages : l’en-tête, le pied, la page d’accueil et la page « introuvable ».

• Un modèle d’en-tête (identité + menu, avec ou sans recherche) donne un résultat fonctionnel tout de suite.
• Tant que l’en-tête et le pied ne sont pas publiés, le site continue d’utiliser ceux de votre thème : rien ne casse en cours de route.
• Le menu affiché est le vrai menu du site : le modifier dans Menus le met à jour ici aussi.
• Sur téléphone et petite tablette, ce menu devient une bande qui se fait glisser du doigt : toutes les entrées restent accessibles sans que l’en-tête n’occupe la moitié de l’écran.
• Le logo est remis à l’échelle automatiquement : inutile de préparer une image à la bonne taille, un blason carré de grande dimension s’affiche correctement.
• La page « introuvable » est celle que voit un habitant qui suit un lien périmé. Les modèles en proposent trois (sobre, avec recherche, illustrée) ; c’est souvent la page la plus visitée après l’accueil.

#31.8 — Refaire le site tranquillement : l’espace de préparation

Un espace de préparation vous laisse tout refaire pendant que les habitants continuent de voir le site actuel.

1. Apparence › Variantes › créez une préparation.
2. Travaillez dedans : rien n’est visible du public.
3. Aperçu privé pour voir le résultat.
4. Quand vous êtes prête, activez : le site bascule d’un coup.
5. Vous pouvez revenir en arrière : le site redevient exactement ce qu’il était.

Dans une préparation non active, Site › Habillage du site propose trois modèles de site complets (commune institutionnelle, tournée services, magazine) : ils installent d’un coup l’en-tête, le pied et la page d’accueil. Vous ajustez ensuite. Si quelque chose empêche l’installation, rien n’est changé.

#31.9 — Les gabarits : une mise en page pour plusieurs contenus

Site › Gabarits. Un gabarit décide de la mise en page d’un ensemble de contenus : toutes les pages d’une rubrique, toutes les actualités, les listes, les résultats de recherche.

1. Choisissez le type (Pages, Articles, Archives, Recherche) et donnez-lui un nom.
2. Vous arrivez dans le compositeur : posez les emplacements (« Contenu de la page », « Liste des contenus »…). Ce sont les endroits où viendra le contenu réel de chaque page.

2bis. À la création, choisissez « Partir d’un modèle » : le gabarit arrive déjà composé (article sobre, article magazine avec grande image de tête et galerie, archives en cartes ou en grille, résultats de recherche). Vous ajustez ensuite. L’option « vierge » reste disponible.

1. Revenez à la liste, réglez à quoi il s’applique (tout le site, une rubrique, une page précise… ou « sauf »).
2. Publiez.

> Un gabarit ne peut pas être publié s’il ne contient pas son emplacement obligatoire : sans lui, les pages s’afficheraient vides. Le message vous dit lequel ajouter.

Si plusieurs gabarits visent les mêmes contenus, l’écran le dit : le plus précis l’emporte, puis la priorité la plus forte.

#31.10 — Une image de fond, et la parallaxe

Sur une section, réglages du bloc › Image de fond › « Choisir une image de fond » : la médiathèque s’ouvre, vous cliquez la photo.

• Point focal : ce qui doit rester visible quand l’image est recadrée.
• Parallaxe : cochez-la et le fond reste fixe pendant que le texte défile. C’est un effet de magazine, réservé aux ordinateurs — sur téléphone il coûte cher en fluidité, il y est neutralisé tout seul.
• Voile : posez-en un si du texte s’affiche par-dessus, sinon la photo rend la lecture difficile. Le vérificateur vous prévient.

> Les modèles livrés ne contiennent aucune photo : ils ne peuvent pas deviner celles de votre commune. Ils posent la mise en scène (hauteur, voile, couleur du texte) et vous choisissez l’image.

#31.11 — Le mode guidé de l'éditeur

Quand vous arrivez dans l'éditeur depuis l'assistant, il est allégé : seuls les réglages utiles au bloc que vous avez choisi sont affichés, et une phrase en haut rappelle quoi faire.

• Le bouton « Réglages avancés », en haut à droite, rend l'interface complète : styles réutilisables, variables, interactions, mise en page fine. Rien n'a été retiré, tout est à un clic.
• Votre choix est mémorisé : si vous préférez le mode complet, vous le retrouvez à chaque écran.

#31.12 — Faire réagir un bloc (interactions)

Dans les réglages d’un bloc, Interactions : « au clic → afficher → *Encadré horaires* ». Vous choisissez dans des menus ; il n’y a rien à écrire.

• « Au survol » fonctionne aussi au clavier : l’accessibilité est ajoutée toute seule.
• Si les scripts sont désactivés chez le visiteur, le contenu visé reste visible : il n’est jamais perdu.

#31.13 — Questions fréquentes

J’ai tout cassé, comment revenir en arrière ? Ctrl+Z annule. Le bouton 📜 Révisions permet de revenir à une version précédente.

Mes modifications sont-elles en ligne ? Non, tant que vous n’avez pas cliqué Publier. L’indicateur « Enregistré » signifie seulement que rien n’est perdu.

Puis-je revenir à une page normale ? Oui : une page composée peut retrouver son mode classique sans perdre son contenu.

Faut-il connaître le HTML ? Non. Le champ « CSS avancé » existe pour des cas rares ; les trois sites de démonstration ont été construits sans y toucher.