Elementor
Votre site utilise le plugin Elementor pour la gestion de contenu. Il est disponible autant pour les circuits que pour les articles et les pages.
Nous allons vous expliquer dans cette section comment il fonctionne, de manière non-exhaustive, tant il serait complexe de tout détailler ici.
Vous trouverez la documentation complète sur ce site. N’hésitez-pas à le consulter pour voir quelles sont les possibilités de création de contenu proposées.
Accéder à l’éditeur
Pour accéder à l’éditeur de contenu, vous avez 2 possibilités :
Dans la liste de pages, survolez la page que vous souhaitez modifier, puis cliquez sur « Modifier avec Elementor ».
Ou
Quand vous êtes dans l’édition de la page (en cliquant sur le nom de la page ou sur le lien « Modifier »), cliquez sur le bouton « Modifier avec Elementor.
Interface d’utilisation d’Elementor
- Zone des Widgets : c’est ici que vous retrouvez tous les types de contenu que vous pouvez insérer dans la page
- Barre d’outils et mise à jour : cette barre vous permet de gérer les paramètres, le navigateur, l’historique, la navigation responsive, l’aperçu. C’est grâce au bouton « Mettre à jour » que vous publierez vos contenus.
- Zone de contenu : cette zone permet d’avoir un aperçu en live de vos modifications
Détail des zones de l’interface
Barre d’outils
La barre d’outil comprend :
- Les paramètres : vous pourrez gérer les paramètres du plugin pour votre site, comme les couleurs et typos principales
- Le navigateur : ouvre une fenêtre de visualisation en liste des contenus de la page
- L’historique : ouvre une liste des actions que vous avez effectuées, ce qui vous permet de revenir sur vos modifications
- Vision responsive : permet de basculer entre un affichage pour ordinateur, tablette ou mobile
- Aperçu : permet de visualiser vos modifications sans les publier
Zone du contenu
C’est la zone dans laquelle vous allez voir vos modifications et glisser-déposer les widgets que vous souhaitez ajouter.
Zone des Widgets
Vous retrouvez ici les blocks que vous allez pouvoir ajouter à vos pages, articles, circuits, etc…
Un simple glisser-déposer permet de positionner le block à l’endroit où vous le souhaitez.
Ajouter des contenus à votre site
Pour ajouter des contenus à votre site, vous pouvez glisser-déposer des blocks là où vous le souhaitez; la zone bleue vous permet de visualiser l’endroit où le block va s’insérer.
Vous pouvez aussi, avant celà, et si la section que vous souhaitez n’existe pas, cliquer sur la zone qui se trouve au bas des contenus :
Quand vous cliquez sur le bouton +, Elementor vous propose de créer une section en choisissant le nombre de colonnes que vous souhaitez.
Ensuite, glissez-déposez vos blocks dans les colonnes ainsi créées.
Les différents types de blocks
| Section interne | permet de créer une ou plusieurs colonnes dans une section ou une autre colonne déjà créée |
| Titre | crée un titre, de n’importe quel niveau ( de 1 à 6 ) |
| Image | insère une image |
| Editeur de texte | insère une zone de texte formattable |
| Vidéo | insère une vidéo |
| Bouton | insère un bouton |
| Séparateur | insère une barre horizontale avec plus ou moins de marge verticale |
| Espaceur | insère une zone vide avec plus ou moins de marge verticale |
| Google Maps | insère une zone de carte interactive Google Maps et d’éventuels marqueur à intégrer dessus |
| Icône | insère un pictogramme |
| Boîte d’image | permet de créer un block avec une image, un titre et un texte |
| Boîte d’icône | permet de créer un block avec une icône, un titre et un texte |
| Notation par étoile | insère une barre d’étoiles pour symboliser une note sur 5 ou 10 |
| Carousel d’images | insère un carousel d’images |
| Galerie basique | insère une collection d’images en grille |
| Liste d’icônes | insère une liste avec des icônes sur la gauche |
| Compteur | insère un compteur automatique animé |
| Barre de progression | insère une barre horizontale présentant un pourcentage |
| Témoignage | insère une boîte avec un texte, un auteur et une image |
| Onglets | insère des onglets paramétrables |
| Accordéon | insère des contenus présentés en accordéon |
| Va-et-vient | insère des contenus présentés en accordéon où plusieurs onglets peuvent être déployés en même temps |
| Icônes réseaux sociaux | insère des icônes de réseaux sociaux |
| Alerte | insère une zone de texte qui peut disparaître en cliquant sur un bouton de fermeture. Cette zone est colorée en fonction de sa nature (info, succes, danger) |
| SoundCloud | insère un widget soundcloud pour l’écoute de piste musicale |
| Code court | insère une zone de code court pour insérer une fonctionnalité WordPress |
| HTML | insère une zone de code HTML pour insérer du contenu personnalisé |
| Ancre de menu | insère un lien ancré nécessitant un ID pour scroller au bon endroit |
| Colonne latérale | insère une colonne latérale (paramétrée dans le thème) dans la page |
| Lire plus | insère un texte « lire la suite… » avec un lien vers la page de l’article |
| Chemin du texte | insère un texte sur une ligne courbe |
Paramétrer un block
Chaque block a ses propres paramètres, en fonction de sa nature. Néanmoins, il y a des choses communes entre tous, et l’interface fonctionne pour tous de la même façon.
Lorsque vous cliquez sur un bloc créé dans votre contenu, sur la gauche vous verrez une zone où l’on vous propose de « Modifier le » avec le nom du block.
Cette zone présente 3 onglets : Contenu, Style, Avancé. Ces 3 onglets sont les mêmes pour tous les blocks, mais leur contenu changera en fonction de son type.
Contenu
L’onglet contenu vous permet de modifier le contenu du block, comme son nom l’indique. Dans l’exemple du titre, nous pouvons modifier le contenu du titre, la balise avec laquelle il est représenté, un lien vers lequel il pourrait envoyer, etc…
Style
L’onglet Style vous permet de modifier l’apparence du block, de la couleur de la police, à la taille, en passant par l’ombre du texte.
Avancé
L’onglet Avancé permet de gérer plus de paramètres, notamment les marges, marges internes, la largeur du block, sa position, son ID et ses class, etc…
Les effets de mouvement permettent d’ajouter une animation à l’entrée du block dans la fenêtre.
Transformer permet de déplacer le block par rapport à sa position initiale. Vous pouvez aussi le faire rotater, le redimensionner, le déformer, ou lui appliquer une symétrie.
Arrière plan permet de mettre un fond au block, coloré ou en image.
Bordure permet d’ajouter un contour au block.
Masque permet de cacher une partie du block selon une forme à choisir.
Responsive permet de choisir s’il faut masquer le block sur certains appareils.
Custom CSS permet d’ajouter du code CSS au block sur la version PRO.
Attributs permet d’ajouter des data sur le block sur la version PRO.