Lorsque vous faites un changement sur vos pages, n’oubliez pas de cliquer sur le bouton « Publier » pour enregistrer vos modifications et les rendre visible sur votre site.
Prise en main de votre site internet WordPress
Dans ce guide vous trouverez le nécessaire pour gérer votre site internet en toute autonomie, peu importe avec quel outil il a été construit. Les modifications les plus courantes sont expliquées de manière claire et simplifiées, étape par étape. N’hésitez pas à vous référer à ce guide à chaque fois que vous en aurez besoin.
Comment savoir quelle partie de ce guide vous concerne ?
Avant de commencer, il est important de savoir quel type d’outil a été utilisé pour construire votre site. Pour le savoir :
1. Connectez-vous avec vos identifiants sur WordPress en ajoutant « /wp-admin/ » à la fin de l’adresse URL de votre site internet
Cliquez sur le bouton correspondant à ce qui est écrit lorsque vous survolez l’une de vos pages :
Modifier mon site avec Elementor
Avant de commencer, il est nécessaire de savoir certaines choses. Elementor est une extension permettant d’organiser les différentes pages du site sous forme de blocs de manière assez intuitive à l’aide de la fonctionnalité « glisser et déposer ». Votre page est constituée de (voir le schéma suivant) :
- Sections : un grand bloc qui occupe souvent toute la largeur de la page et qui sert à regrouper plusieurs autres blocs d’une même partie.
- Colonnes : regroupe plusieurs éléments comme un titre, une description, un bouton ou tout simplement une image et permet de les organiser selon des colonnes.
- Conteneurs : regroupe plusieurs éléments comme un groupe.
- Éléments ayant différentes fonctions possibles comme des titres, des éditeurs de textes, des images, etc.
Lorsque vous changez des éléments de votre page avec Elementor, vous pouvez visualiser ce que vous faites directement en éditant. Cependant, les modifications sont visibles seulement par vous. Ce n’est que lorsque vous cliquez sur le bouton « Publier » que les changements deviennent visibles pour l’ensemble des utilisateurs. N’oubliez pas de cliquer sur le bouton « publier » si vous voulez enregistrer vos changements.
Sur votre site vous pouvez donc assez facilement modifier les différents éléments d’une page. C’est ce que nous allons voir maintenant. Pour modifier une page cliquez sur l’onglet « Pages » puis sur le bouton « Modifier avec Elementor » sur la page que vous souhaitez modifier (comme vu précédemment dans l’introduction). Ensuite, référez-vous aux changements que vous voulez effectuer dans la liste suivante.
I - Les blocs et actions basiques
Découvrir les différents blocs (facile)
Dans Elementor, plusieurs blocs sont disponibles et permettent une personnalisation de vos pages.
Il existe des blocs de titre, de textes, des boutons, des images, ou encore des vidéos pour le contenu. Mais aussi des séparateurs ou des espaceurs pour la mise en forme.
Vous pouvez retrouver tous les blocs sur le bandeau latéral de gauche (voir Figure 1 : cercle rouge). Pour retrouver un bloc facilement, vous pouvez le chercher par son nom dans la barre de recherche (voir Figure 1 : cercle bleu).
Ajouter un nouveau bloc (facile)
Pour ajouter un nouveau bloc,
1. Cliquez avec votre clic gauche sur le bloc voulu pour le sélectionner.
2. Faites glisser vers l’emplacement sur la page que vous souhaitez.
Un trait violet clair apparaîtra pour vous préciser où le bloc sera ajouté (« drag and drop » ou « glisser-déposer » en français).
Attention !
La mise en page d’un bloc de texte par exemple risque d’être altérée,
il vaut mieux privilégier la duplication qui garde les mêmes caractéristiques.
N’utilisez l’ajout que si le bloc n’existe pas déjà dans votre page.
Dupliquer ou supprimer un bloc (facile)
Pour dupliquer ou supprimer un bloc,
1. Cliquez avec le clic gauche sur le petit crayon violet en haut à droite du bloc afin de le sélectionner.
2. Appuyez sur clic droit.
3. Sélectionnez supprimer ou dupliquez en fonction de votre objectif (voir Figure 3).
Lorsque vous dupliquez un élément (un bloc ou un groupe), celui-ci garde toutes les caractéristiques du bloc initial, ce qui est pratique pour garder la même mise en forme globale. Cette technique est à privilégier par rapport à l’ajout d’un nouveau bloc.
Réorganiser les blocs déjà existants (facile mais dangereux)
Sur vos pages vous pouvez réorganiser les blocs assez facilement. Cependant attention, en déplaçant certains blocs, il se peut que la mise en page soit altérée.
Pour changer l’emplacement d’un élément vous devez maintenir clic gauche sur le crayon qui se situe en haut à droite de ce bloc et le déplacer où vous le souhaitez. Vous pouvez prévisualiser où le bloc se placera grâce au repère violet (voir icône ci-contre)
II - Les titres et textes
Il existe deux types de blocs permettant de rédiger un texte : le premier le bloc titre, et le second le bloc éditeur de texte. Ces deux blocs ont des modes de fonctionnement assez similaires mais l’éditeur de texte permet de mettre facilement en forme un long texte, contrairement au bloc titre.
Modifier le contenu d'un texte existant (facile)
Pour modifier le contenu d’un texte, vous devez cliquer sur le bloc, si c’est un bloc titre vous pouvez écrire dans la partie « Titre » du bandeau latéral gauche. (voir Figure 4)
Attention !
La hiérarchie des titres est importante pour le référencement de votre site internet !
Si ce bloc est utilisé pour écrire un texte de paragraphe, veuillez cliquer sur la case « Balise HTML » et changer pour « p ».
A noter que vous pouvez également faire des retours à la ligne en ajoutant : <br/>
Si c’est un bloc éditeur de texte, vous aurez la plupart des mêmes options que n’importe quel éditeur de texte comme Word, Libre Office, etc. Dans le menu latéral gauche et dans « éditeur de texte », vous pourrez donc changer le texte mais également changer sa mise en forme (centrer, changer la couleur d’une partie du texte, mettre en gras ou en italique, etc.) (voir Figure 5).
Changer la couleur, la taille, la police (facile)
Les blocs titres et éditeurs de textes fonctionnent de la même manière ici :
1. Cliquez sur l’onglet « style » dans le menu latéral gauche.
2. Tout en bas vous trouverez une section destinée à la couleur du texte mais aussi du lien (s’il y en a un).
3. De plus, vous pouvez aussi changer la couleur du lien au survol en cliquant sur la sous-partie « Au survol ».
Si vous souhaitez changer la taille ou la police il faudra
1. Cliquer sur le petit icone de crayon à la ligne « Typographie ».
2. Choisir une police dans le menu déroulant « Famille » proposant des polices Google Fonts,
3. Changer la taille du texte ou encore toutes les autres options disponibles comme la graisse ou le style de texte (italique).
Ajouter un lien sur un texte (intermédiaire)
Vous pouvez ajouter un lien sur un texte de deux manières différentes.
Si vous voulez votre lien sur une partie d’un texte dans un éditeur de texte,
1. Sélectionnez la partie du texte qui contiendra le lien
2. Cliquez sur l’icône de chaine dans le bandeau latéral gauche « Insérer / Modifier un lien » (voir Figure 6).
Si vous voulez que votre lien se situe sur un bloc titre, vous utiliserez la ligne « Lien ».
Si vous renvoyez vers un site externe,
1. Entrez le lien de destination
2. Veillez à cliquer sur l’icône de roue crantée « Options du lien »
3. Cochez la case « Ouvrir le lien dans un nouvel onglet »
4. Confirmez avec le bouton « Ajouter un lien ».
Si le lien ne renvoie pas vers un site externe mais vers une page de votre propre site,
1. Cliquez sur l’icône de roue crantée « Options du lien »
2. Sélectionnez dans la liste la page vers laquelle vous voulez que votre texte renvoi
III - Les images
Remplacer une image existante (facile)
Pour remplacer une image :
1. Cliquez sur l’image à changer pour la sélectionner.
2. Cliquez sur votre image dans le bandeau latéral gauche.
3. (facultatif) Importez votre image en la glissant dans la fenêtre « Téléverser des fichiers ».
4. Sélectionnez la bonne image en cliquant dessus.
5. Cliquez sur « Sélectionner ».
IV - Les boutons
Remplacer le contenu texte du bouton ou son lien (facile)
Pour remplacer le contenu texte :
1. Cliquez gauche sur le bouton.
2. Dans la ligne « texte », changez le contenu.
Pour changer le lien du bouton, si vous renvoyez vers un site externe,
1. Cliquez sur le bouton.
2. Entrez le lien de destination.
3. Veillez à cliquer sur l’icône de roue crantée « Options du lien ».
4. Cochez la case « Ouvrir le lien dans un nouvel onglet ».
5. Confirmez avec le bouton « Ajouter un lien ».
Si le lien ne renvoie pas vers un site externe mais vers une page de votre propre site,
1. Cliquez sur l’icône de roue crantée dans le bandeau latéral gauche
2. Sélectionnez dans la liste la page vers laquelle vous voulez que votre texte renvoi
Rajouter un bouton (facile)
Pour rajouter un bouton, il est recommandé de dupliquer un bouton existant pour conserver la mise en forme existante. Sinon vous pouvez en ajouter un comme expliqué ici.
V - La mise en page
Masquer un élément (facile)
Si vous voulez cacher un élément de votre page sans le supprimer :
1. Cliquez sur l’élément que vous souhaitez cacher.
2. Cliquez sur l’onglet « Avancé » dans le bandeau latéral gauche.
3. Cliquez sur l’onglet « Responsive ».
4. Cochez tous les boutons « Masquer sur … » (ordinateur, tablette et mobile).
Dupliquer une section (facile)
Pour dupliquer une section existante vous devez procéder presque de la même manière que pour dupliquer un bloc, il faut :
1. Sélectionner la section à dupliquer en cliquant sur l’icône.
2. Cliquez avec le clic droit sur la même icône.
3. Sélectionnez « Dupliquer ».
Cela placera la section dupliquée juste en dessous de celle qui existait déjà.
Changer la couleur de fond d'une section (facile)
Si vous voulez ajouter ou changer la couleur de fond d’une section :
1. Sélectionnez la section que vous souhaitez changer en cliquant dessus.
2. Cliquez sur « Style ».
3. Si l’option n’est pas déjà cochée, cliquez sur « type d’arrière-plan classique » avec l’icône de pinceau.
4. Cliquez sur l’icône qui se situe à côté de la petite planète.
5. Choisissez votre couleur.
Réorganiser l'ordre des sections (glisser-déposer) (intérmediaire)
Pour changer l’ordre des différentes sections d’une page,
1. Maintenez votre clic gauche sur l’icône de la section (voir icône ci-contre).
2. Déplacez votre curseur jusqu’à l’emplacement que vous souhaitez (vous pouvez vous repérer grâce à la ligne violette qui apparait au déplacement d’un bloc).
3. Relâchez le clic.
Modifier les espacements (padding/margin) (avancé)
Il est important dans un premier temps de différencier les deux termes : margin est l’espacement en dehors du bloc sélectionné tandis que padding et celui à l’intérieur du bloc.
Par exemple dans l’image suivante, on peut voir que le margin du container c’est l’espacement entre son bord et le bord de la colonne, alors que le padding est l’espacement à l’intérieur : entre le bord du container et le bord de l’image.
Peu importe le bloc dont vous voulez changer l’espacement,
1. Sélectionnez le bloc que vous souhaitez changer en cliquant dessus.
2. Cliquez sur l’onglet « Avancé » du bandeau latéral gauche.
3. Vous pouvez changer le margin ou le padding en entrant des valeurs (en pixels) dans les différentes cases.
A noter que lorsque vous rentrez une valeur, elle s’applique sur les 4 côtés de votre bloc. Si vous voulez entrer des valeurs personnalisées à chacun des côtés, vous devez cliquer sur l’icône de chaine qui se situe à droite des colonnes de valeurs.
VI - Les pages
Ajouter une nouvelle page (intermédiaire)
Si vous voulez ajouter une nouvelle page dans votre site, il est conseillé de dupliquer une page existante pour garder le même style de page et pour éviter de devoir tout refaire de zéro. De plus, la page ajoutée sera en « brouillon » et ne sera donc pas visible par les utilisateurs du site. Pour publier une page cliquez sur « Modifier avec Elementor » et publiez la page en cliquant en haut à droite sur « Publier ».
Pour dupliquer une page existante,
1. Rendez-vous dans l’onglet « Pages » de WordPress.
2. Cliquez sur « Dupliquer cela » lorsque vous survolez une page avec votre souris.
Modifier mon site avec l'éditeur WordPress
Certaines parties de votre site peuvent être construites sans Elementor, directement avec l’éditeur natif de WordPress, comme la section « Articles ». Cette section n’est pas toujours utilisée sur tous les sites.
Pour le vérifier, rendez-vous dans l’onglet « Articles » du menu latéral gauche de WordPress. Si vous voyez des articles déjà présents ou des contenus correspondant à ce que vous souhaitez afficher alors cette fonctionnalité est bien utilisée sur votre site et cette partie vous concerne.
Le fonctionnement global
L’éditeur WordPress fonctionne globalement de la même manière que les blocs « Éditeur de texte ». Vous pouvez intégrer du texte, des titres, des images ; les mettre en gras ou soulignés, etc.
Pour modifier l’une de ces pages il faut :
1. Cliquer sur l’onglet « Articles ».
2. Survoler la page à modifier et cliquer sur « Modifier ».
Ajouter un titre sur votre article
Vous pouvez ajouter un titre global à votre article en entrant du texte dans la partie centrale où il est écrit « Saisissez le titre ».
Ajouter le contenu de votre article
Pour ajouter le contenu de votre article,
1. Cliquez dans la partie « SAISIR « / » POUR CHOISIR UN BLOC ».
2. Écrivez « /CLASSIQUE ».
3. Sélectionnez le bloc qui est apparu.
4. Cliquez sur « Modifer les contenus ».
Vous avez maintenant accès à l’éditeur de contenus classique et pouvez désormais :
1. Changer le style du texte que vous écrivez (paragraphe, texte de niveau 1, texte de niveau 2, etc.).
2. Changer la couleur du texte sélectionné.
3. Changer la mise en forme en alignant le texte à gauche, au centre ou à droite.
4. Ajouter des médias (images).
5. N’oubliez pas d’enregistrer vos changements en cliquant sur le bouton « Enregistrer » en bas à droite !
Une fois votre contenu rédigé, vous avez la possibilité d’enregistrer votre brouillon, avec le bouton « Enregistrer le brouillon » afin que la page ne soit pas publiée et visible par tous, ou alors vous pouvez la publier en cliquant sur le bouton « Publier » disponible en haut à droite.