Différences

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

--- procedures:sinp-aura:tutoriels:cms:elementor [2021/01/11 11: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 en quelques lignes ===
-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.
+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).
-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.
+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).
+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.
+===== WordPress, Elementor : qui fait quoi ? =====
-=== Des sections et des élements ===
+**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.
-Le composeur d'Elementor s'appuie sur des **sections** qui permettent de **structurer la page**. Ces sections définissent un ensemble de zones au sein desquelles on pourra intégrer notre contenu. Ce contenu est alors mis en forme avec des **é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 ===
-== 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 une structure ==
-Afin d'organiser votre page et aboutir à une page 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 le contenu).
-== Insérer des élements ==
-Une fois que vous avez créé un ou des blocs, vous pouvez y intégrer votre contenu sous forme d'éléments.
-== 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.