PageTree démo by

Éditer des pages

Aperçu

L’aperçu affiche la page en direct, dans le layout de votre thème, pendant que vous l’éditez.

Comment fonctionne l’aperçu

  • L’aperçu occupe la partie droite de l’onglet de la page.
  • Il utilise le Layout choisi dans l’en-tête de la page : vos styles, scripts et polices sont chargés.
  • Il se met à jour quand vous modifiez un bloc.
  • Cliquez sur un bloc dans l’aperçu pour ouvrir son formulaire. Au survol, le bloc correspondant est mis en évidence dans la liste.
  • Les liens de la page sont désactivés dans l’aperçu : cliquer sur un lien n’ouvre pas une autre page. Si l’aperçu quitte malgré tout la page, il est rechargé.
  • Les blocs masqués (case Affiché ? décochée) restent visibles dans l’aperçu, mais pas sur le site.

Les composants CMS placés comme blocs ne sont pas exécutés dans l’aperçu : une carte résume le composant et ses propriétés. Leur rendu réel n’apparaît que sur le site.

Éditer dans l’aperçu

Depuis la 2.4, l’aperçu sert aussi à éditer :

  • Barre d’outils du bloc : au survol d’un bloc, une barre d’outils permet de Monter ce bloc, Descendre ce bloc, Sélectionner le bloc parent (pour un bloc placé dans une Section ou une grille) et Modifier ce bloc (ouvre son formulaire).
  • Textes en place : les textes des blocs intégrés (titres, textes, boutons, légendes) se modifient en cliquant dessus. Entrée valide, Échap annule ; dans un texte sur plusieurs lignes, Maj+Entrée ajoute un retour à la ligne.

Les mêmes outils sont disponibles directement sur le site : voir Édition sur le site.

Tailles d’écran

À droite de la barre d’outils des blocs, trois boutons changent la largeur de l’aperçu :

  • mobile (icône téléphone) ;
  • tablette (icône tablette) ;
  • ordinateur (icône écran).

Le bouton suivant agrandit l’éditeur des blocs et l’aperçu sur toute la fenêtre ; cliquez à nouveau pour revenir à l’affichage normal.

Ouvrir l’aperçu dans une fenêtre

Vous pouvez détacher l’aperçu dans une fenêtre séparée, par exemple pour le placer sur un second écran.

  1. Cliquez sur le bouton Ouvrir l’aperçu dans une fenêtre, le dernier à droite de la barre d’outils des blocs.
  2. Une fenêtre s’ouvre, à la largeur de la taille d’écran choisie. La liste des blocs prend toute la largeur de l’onglet.
  3. Continuez à éditer : la fenêtre se met à jour.
  4. Pour la rattacher, cliquez sur Ramener l’aperçu dans l’éditeur (même bouton) ou fermez la fenêtre.

Une seule fenêtre d’aperçu est partagée par tous les onglets ouverts : elle affiche la page de l’onglet visible.

Si rien ne s’ouvre, le navigateur a bloqué la fenêtre. Autorisez les fenêtres pop-up pour le site du back-office, puis réessayez.

Aperçu ou page publiée ?

L’aperçu montre l’état en cours d’édition, même non enregistré et même si la page n’est pas publiée. Pour voir la page telle qu’elle est servie, enregistrez puis cliquez sur Ouvrir la page dans la barre d’outils du document. Une page inactive, non publiée ou programmée renvoie une erreur 404 aux visiteurs ; connecté au back-office, vous la voyez avec un bandeau qui indique son statut (voir Édition sur le site).

L’aperçu reste vide

Vérifiez que le layout choisi s’affiche correctement seul, puis consultez le journal (Réglages → Journal des évènements, ou storage/logs/system.log). Voir Dépannage.