Différences

Ci-dessous, les différences entre deux révisions de la page.

--- procedures:sinp-aura:tutoriels:cms:elementor [2021/01/11 14:16] – dmaillard
+++ procedures:sinp-aura:tutoriels:cms:elementor [2023/09/15 13:27] (Version actuelle) – dmaillard
@@ Ligne 1: / Ligne 1: @@
-===== Tutoriel Elementor : Editer le site internet de l'ORB =====
+====== Présentation globale d'Elementor : Editeur du site de l'ORB ======
-Elementor est un plugin WordPress qui embarque son propre composeur de thèmes et de pages. En complétant (ou plutôt en remplaçant) l'éditeur par défaut de Wordpress, il permet de créer des rendus plus esthétiques plus rapidement et avec des compétences moindres en code.
-Pour ce faire, Elementor "code pour vous" un ensemble de widgets que vous pourrez injecter dans vos pages et que vous pourrez paramétrer dans une assez grande mesure. Pour les utilisateurs plus avancés, il permet d'ajouter des règles css et de personnaliser encore davantage les widgets mis à disposition.
+Le site de l'ORB a été conçu avec WordPress, et son plugin Elementor qui embarque son propre éditeur de contenus. Cet éditeur Elementor remplace l'éditeur par défaut de Wordpress, et permet de créer des rendus plus esthétiques, plus rapidement, et avec des compétences moindres (pas de code etc).
-Dans le cadre de l'ORB, nous disposons de la licence Elementor Pro, nous permettant d'avoir accès à davantage de widgets (éléments).
+Elementor "code pour vous" un ensemble de widgets que vous pourrez importer dans vos pages, et que vous pourrez paramétrer dans une assez grande mesure. Pour les utilisateurs plus avancés, il permet d'ajouter des règles css et de personnaliser encore davantage les widgets mis à disposition.
+Dans le cadre de l'ORB, nous disposons de la licence Elementor Pro, nous permettant d'avoir accès à davantage de widgets (éléments) et fonctionnalités.
-=== Des sections et des éléments ===
+===== WordPress, Elementor : qui fait quoi ? =====
-Le composeur d'Elementor s'appuie sur des **sections** qui permettent de **structurer la page**. Ces sections définissent un ensemble de "zones" ou "blocs" au sein desquels on pourra intégrer notre contenu. Une section peut comporter une ou plusieurs colonnes, de largeur variable.
+**Elementor ne prend en charge que la gestion et l'organisation des contenus directement visibles par les visiteurs du site**. Il remplace l'éditeur par défaut de Wordpress (Gutenberg) pour le contenu des pages en lui-même.
-Ce contenu est alors constitué d'**éléments** tels que :
+**Les "métadonnées" des pages et articles (auteurs, mots-clés, images mises en avant, référencement, dates de publications, catégories, permaliens etc) restent gérées par WordPress de manière classique**. De même, les fonctionnalités permettant de publier, programmer, dépublier un article, modifier les menus, gérer les médias ou créer des utilisateurs par exemple, restent totalement gérés par l'interface classique de WordPress (/wp-admin).
+Si vous ne savez pas qui de WordPress ou Elementor fait ce que vous souhaitez faire, demandez-vous simplement si l'utilisateur le verra ou non sur le site.
+===== Fonctionnement général : des conteneurs et des éléments =====
+Le composeur d'Elementor s'appuie sur des **conteneurs** qui permettent de **structurer la page**. Ces conteneurs de tailles variables peuvent être imbriqués les uns dans les autres pour définir un ensemble de "zones" ou "blocs" au sein desquels on pourra intégrer notre contenu.
+Ce contenu est alors représenté par des **éléments** (widgets) préconçus, tels que :
   * des titres,
   * des paragraphes,
@@ Ligne 19: / Ligne 28: @@
   * des vidéos,
   * des boutons,
-  * des formulaires
+  * des formulaires,
-  * et quelques dizaines d'autres...
+  * des cartes,
+  * des graphiques,
-Des éléments plus avancés permettent d'améliorer la lisibilité pour l'utilisateur : onglets, accordéons, galeries filtrables etc
+  * et quelques dizaines d'autres possibilités...
-=== L'éditeur d'Elementor ===
-Elementor a son propre éditeur, permettant de composer des pages ou des articles simplement.
-== Accéder à l'éditeur ==
-L'éditeur Elementor "remplace" l'éditeur de WordPress. On peut y accéder par différents moyens :
-  * Depuis la liste des articles/pages : lien //modifier avec Elementor//
-  * Depuis la page de création ou modification d'une page/article : bouton //modifier avec Elementor//
-  * Depuis le site en mode connecté : lien //modifier avec Elementor// dans la barre d'outil qui se situe au dessus des menus
-{{ :procedures:sinp-aura:tutoriels:cms:capture_d_e_cran_2021-01-11_a_11.37.30.png?direct&600 |}}
-== Créer des sections et des colonnes ==
-Afin d'organiser votre page ou votre article et aboutir à une présentation ergonomique, Elementor s'appuie sur des **sections** pour créer une **structure de page**.
-Vous pouvez ajouter autant de sections que vous le souhaitez à votre page, et vous pourrez intégrer autant de widgets que vous voudrez à chacune de vos sections ensuite. Les sections sont ajoutées par un petit "+" en bas de page, et peuvent comporter une ou plusieurs colonnes. La largeur de ces colonnes et leur nombre est modifiable par la suite :
-{{ :procedures:sinp-aura:tutoriels:cms:create_sections.webm |}}
-Sections et élements peuvent s'ajouter en parallèle, il n'est pas nécessaire de faire 100% de la structure de la page avant d'y intégrer du contenu.
-== Intégrer des éléments de contenu ==
-Une fois que vous avez créé tout ou partie de la structure de votre page, vous pouvez y intégrer votre contenu sous forme d'**éléments**. Pour ce faire, l'éditeur vous propose **une banque d'éléments** disponibles, que vous pourrez placer dans votre sections par un **simple glisser-coller** (drag & drop).
-Un contenu exemple est alors importé dans votre bloc, et l'éditeur affiche un panneau de configuration de l'élément ajouté pour y personnaliser le contenu, la mise en forme, la position etc.
-Par exemple :
-== Paramétrer les sections ==
-== Paramétrer les éléments ==
-== Paramètres avancés ==
+Des éléments plus aboutis permettent de gérer la mise en page pour des contenus denses, mais doivent être utilisés avec parcimonie : onglets, accordéons, galeries filtrables etc
+Pour schématiser : les conteneurs sont les murs et les étages de votre page, tandis que les éléments (widgets) sont les meubles et la décoration : il est ainsi essentiel de commencer par créer et organiser ses conteneurs, pour pouvoir y intégrer vos widgets.
-=== Importer ou Enregistrer une section réutilisable ===
+Les éléments et conteneurs créés sur une page ou un article peuvent être enregistrés puis réutilisés à d'autres endroits du site, ou être dupliqués sur une page (utile pour conserver une même mise en page pour un même type de contenu par exemple).
+===== Documentation officielle et aides =====
+Une documentation officielle importante est disponible (en anglais) sur le site d'Elementor :
+[[https://elementor.com/help/]]
+De nombreux tutoriels sont disponibles sur youtube, notamment en français.
+Enfin n'hésitez pas à solliciter Flavia APE pour la prise en main ou pour toute demande d'aide.