08. Travailler vite : Structure, Historique, raccourcis, copier-coller

La page du chapitre 07 a pris vingt minutes ; la même, construite par quelqu’un qui maîtrise la Structure, les raccourcis et le copier-coller, en prend huit. Ce chapitre rassemble les outils de vitesse d’Elementor et la méthode de travail qui va avec, avant que les chapitres suivants ne multiplient les réglages.

8.1 — La Structure : le plan de la page

Le chapitre 05 a présenté la Structure (Structure, anciennement Navigator) comme une arborescence de la page. Il est temps de s’en servir vraiment. Elle s’ouvre de trois façons : par son icône dans la barre supérieure, par un clic droit sur n’importe quel élément de la toile puis Structure, ou par Ctrl+I (Cmd+I sur Mac). Elle montre chaque conteneur et chaque contenu, emboîtés comme sur la toile, avec une petite flèche pour replier ou déplier chaque branche.

Quatre gestes y sont possibles, et chacun remplace avantageusement le même geste sur la toile. Sélectionner : un clic sur une ligne sélectionne l’élément et ouvre ses réglages, sans risque de cliquer sur l’enfant au lieu du parent. Renommer : un double-clic sur le nom permet de le remplacer (« Bandeau d’accueil » plutôt que « Flexbox ») ; le nom n’a aucun effet sur le site, il ne sert qu’à vous, mais il change tout dès qu’une page dépasse dix éléments. Réordonner : on fait glisser une ligne au-dessus ou au-dessous d’une autre, ou à l’intérieur d’un conteneur, avec une précision que la toile n’offre pas. Masquer : l’icône d’œil (View) cache temporairement un élément dans l’éditeur pour travailler sur ce qu’il recouvre ; cela n’a aucun effet sur le site public, et l’on oublie facilement ce que l’on a masqué, d’où la règle : tout ré-afficher avant d’enregistrer.

La Structure est flottante par défaut ; le bouton d’ancrage (Dock) la colle au bord de l’écran, où elle reste ouverte pendant que vous travaillez. Elle signale aussi, par un petit marqueur, les éléments qui portent des Conditions d’affichage, des effets de mouvement, une position absolue ou du CSS personnalisé : autant d’explications à une page qui « ne se comporte pas comme prévu ».

1. Ouvrez la page « Accueil » et la Structure. Ctrl+I. Ancrez-la avec le bouton Dock.
2. Repliez tout. Cliquez sur les flèches pour ne voir que les deux conteneurs de premier niveau : « Bandeau d’accueil » et « Prestations ».
3. Inversez-les. Faites glisser « Prestations » au-dessus de « Bandeau d’accueil ». La toile se réorganise aussitôt.
4. Revenez en arrière. Ctrl+Z. L’ordre initial est rétabli.
5. Dépliez « Prestations » et vérifiez les noms. Les trois Blocs Div doivent s’appeler « Prestation – Escaliers », « Prestation – Cuisines », « Prestation – Agencements ». Renommez ce qui manque, puis Ctrl+S.

8.2 — L’Historique : Actions et Révisions

L’Historique (History), ouvert par son icône dans la barre supérieure ou par Ctrl+Shift+H, a deux onglets qui répondent à deux questions différentes.

L’onglet Actions répond à « qu’ai-je fait depuis que j’ai ouvert cette page ? ». Chaque ajout, suppression, déplacement ou modification de réglage y apparaît sur une ligne ; cliquer sur une ligne ramène la page à cet instant, et les lignes suivantes restent disponibles tant que vous ne faites pas une nouvelle action. Ctrl+Z (Défaire) et Ctrl+Shift+Z (Refaire) parcourent cette même liste une ligne à la fois. Elle se vide quand vous quittez l’éditeur.

L’onglet Révisions (Revisions) répond à « comment était cette page hier ? ». Chaque enregistrement et chaque publication crée une révision, datée et signée. Cliquer sur une révision l’affiche sur la toile, avec un bouton pour l’appliquer et un autre pour l’ignorer ; appliquer une révision ne la publie pas, il faut encore enregistrer. Ces révisions sont conservées par WordPress, et certains hébergeurs en limitent le nombre : ne comptez pas sur elles comme sauvegarde à long terme (chapitre 36), mais comme filet de la semaine.

8.3 — Dupliquer, copier, coller : construire une fois

Ne construisez jamais deux fois ce qui peut être dupliqué.

Un clic droit sur un élément de la toile ou de la Structure ouvre un menu contextuel : Dupliquer (Duplicate), Copier (Copy), Coller (Paste), Coller le style (Paste Style), Supprimer (Delete), et pour les widgets classiques Réinitialiser le style. Chacun a son raccourci, et c’est par les raccourcis qu’on gagne du temps.

Dupliquer

Ctrl+D crée une copie de l’élément sélectionné juste après lui, dans le même conteneur, avec tous ses réglages et tous ses enfants. C’est ainsi que les trois prestations du chapitre 07 sont nées d’une seule. La méthode vaut pour tout ce qui se répète : cartes, colonnes, lignes d’un tarif, témoignages, sections entières. Construisez la première jusqu’au dernier détail — police, couleur, marges, rayon —, puis dupliquez ; corriger un détail sur trois copies coûte trois fois plus que le corriger avant.

Copier et coller, y compris entre pages et entre sites

Ctrl+C copie l’élément sélectionné ; Ctrl+V le colle après l’élément sélectionné, ou à l’intérieur du conteneur sélectionné. La différence avec Dupliquer tient au presse-papiers : ce que vous copiez reste disponible quand vous changez de page. Copiez le bandeau de la page « Accueil », ouvrez la page « Prestations » avec le Finder, faites un clic droit sur la toile et collez : le bandeau arrive avec ses réglages. Ce presse-papiers est conservé par votre navigateur, ce qui lui permet de passer d’un onglet à l’autre et même d’un site Elementor à un autre, pour peu que vous y soyez connecté avec le même navigateur.

Coller le style

Ctrl+Shift+V applique à l’élément sélectionné les seuls réglages de style d’un élément copié du même type : le texte reste, l’habillage change. Trois boutons construits à des moments différents deviennent identiques en trois collages. Avec les éléments atomiques, cette commande garde son utilité pour un rattrapage ponctuel, mais la bonne réponse durable est la classe du chapitre 18 : un style nommé, appliqué à tous les boutons, modifié une seule fois pour tous.

Réinitialiser, supprimer, sélectionner le parent

Réinitialiser le style ramène un widget classique à son apparence par défaut ; les éléments atomiques n’ont pas d’équivalent (chapitre 06) : on efface les valeurs ou l’on retire la classe. La touche Suppr supprime l’élément sélectionné et tout ce qu’il contient — la Structure vous montre l’étendue des dégâts avant de confirmer. Enfin, pour sélectionner le conteneur d’un élément plutôt que l’élément lui-même, cliquez sur la poignée qui apparaît au sommet du conteneur quand on le survole, ou plus simplement sur sa ligne dans la Structure.

8.4 — Le Finder, les Préférences et les Notes

Le Finder (Ctrl+E) est une barre de recherche qui flotte au-dessus de l’éditeur. Tapez les premières lettres du nom d’une page, d’un article ou d’un modèle : il s’ouvre sans passer par l’administration. Tapez Page, Post, Template ou Product : le Finder propose d’en créer un nouveau. Il donne aussi accès aux réglages d’Elementor, au Gestionnaire de rôle ou au Mode maintenance. Pour un site de cinq pages, c’est le moyen le plus rapide de passer de l’une à l’autre.

Les Préférences de compte (User Preferences, menu du logo ou Ctrl+Shift+U) règlent l’éditeur pour vous seul, pas pour le site : le thème clair ou sombre de l’interface, la largeur du panneau — élargissez-le si les noms de réglages sont coupés — et la visibilité des réglages globaux. Elles suivent votre compte utilisateur, pas le site.

8.5 — Tous les raccourcis clavier

Elementor affiche cette liste depuis le menu du logo, Raccourcis clavier (Keyboard Shortcuts), ou avec Ctrl+?. Sur Mac, remplacez Ctrl par Cmd. Inutile de tout apprendre : les six premiers de la première famille suffisent à doubler votre vitesse.

Source : Centre d’aide Elementor, page « Hotkeys ». Un raccourci ne fonctionne que si le curseur n’est pas dans un champ de texte : cliquez d’abord sur la toile ou sur la Structure.

8.6 — Une méthode de travail

Les outils précédents ne valent que par la manière de s’en servir. Voici la routine que ce support applique à chaque page, et que vous retrouverez dans le projet complet du chapitre 38.

Nommer dès le dépôt. Chaque conteneur reçoit un nom dans la Structure au moment où il est créé, pas « plus tard ». Une page dont la Structure se lit comme un sommaire (« Bandeau d’accueil », « Prestations », « Témoignages », « Appel au devis ») se corrige en une minute, six mois après.

Enregistrer souvent, publier rarement. Ctrl+S après chaque bloc terminé ; sur une page déjà en ligne, on travaille en brouillon ou sur une page d’essai, et l’on ne met à jour qu’après vérification en vue mobile.

Construire un bloc, puis dupliquer. Une carte, une ligne, une section : on la termine entièrement, on la duplique, on personnalise les copies. Et quand la même carte doit exister sur trois pages, on la copie-colle plutôt que de la refaire — en attendant les modèles du chapitre 21 et, en Pro, les composants du chapitre 22.

Regarder la Structure avant de supprimer. Un Flexbox qui paraît vide sur la toile peut contenir des éléments masqués ou de hauteur nulle ; la Structure le dit.

• La Structure est ancrée et tous les conteneurs ont un nom.
• Aucun élément n’est masqué dans la Structure au moment d’enregistrer.
• Le premier exemplaire d’un bloc répété est terminé avant d’être dupliqué.
• La cible est sélectionnée dans la Structure avant chaque collage.
• Ctrl+S a été tapé après le dernier bloc terminé.