Mise en page du blog

Gérer votre site internet

Yumea • juin 12, 2018

Se connecter à l’espace admin

Pour commencer, il faut rajouter  /admin  ou  /wp-admin  à la fin de l’URL de votre site internet.

Exemple : www.nomdevotresite.com /admin

Ensuite vous accédez à un espace de connexion.

1/ 2/ Entrez vos identifiants envoyés par mail

3/ Cliquez sur  Se connecter .

Tableau de bord de WordPress

1/ Dans la barre noire en hauteur, vous verrez une icône de maison : vous pouvez à tout moment rebasculer vers votre site internet

2/ Articles : c’est la partie blog de votre site internet, c’est ici que vous ajouterez, modifierez et supprimerez vos articles de blog

3/ Médis : la bibliothèque de médias de votre site, qui contient toutes les images, contenus (PDF, word) de votre site. Vous pouvez les supprimer, et en ajouter.

4/ Pages : le plus important du site c’est ici que vous gérez  tout le contenu de votre site (à savoir  Accueil, Contact, Blog, etc )

5/ Projets (facultatif) : un mélange entre l’article et la page. Très utile si vous désirez réaliser des études de cas, des témoignages poussés, des avis etc.

1/ Les pages

Voici la page telle que vous la voyez dans votre navigateur

Vous remarquez qu’il y a plusieurs colonnes et plusieurs éléments comme du texte, des icônes, des images, etc.

1/a/ Liste des pages

De retour dans le tableau de bord, allez dans le menu de gauche et cliquez sur  Pages.

Vous accédez à la liste des pages que l’on voit dans le menu horizontal du site internet.

Nous allons reprendre la page que nous avons vu précédemment pour la modifier.

1/b/ Modifier une page

Nous voici dans l’espace de modification de la page en question.

1/ Titre de la page.

2/ URL de la page, elle se créé automatiquement lorsque vous créez une nouvelle page.

Attention ce n’est pas le cas si vous avez déjà créé une page, il faudra penser à modifier l’URL.

3/ Yoast SEO : plugin vous aidant à optimiser votre référencement. Sous la forme de feux tricolores, vous pouvez voir ce que vous pouvez améliorer ou modifier pour obtenir un bon score.

4/ Visibilité de la page : change le statut de la page (public, Privé, mot de passe, brouillon). Vous pouvez la laisser en brouillon si vous voulez la publier plus tard.

5/ Bouton  Mettre à jour  : valide tous les changements de votre page (obligatoire pour mettre à jour ce que vous avez mis)

1/ Voici le  générateur DIVI . C’est la partie violette qui gère le contenu de votre site. Il se présente sous forme de portions de différentes couleurs.

2/  Sauvegarder dans la bibliothèque  : onglet qui permet de sauvegarder votre modèle de page pour l’appliquer

3/  Télécharger le modèle  : onglet qui permet de charger un modèle pré-établi et de l’appliquer à votre page. Vous avez des modèles Divi réalisés par Elegant Themes.

4/  Effacer le modèle :  efface le contenu de votre page

5/ Voici la structure globale de l’organisation de votre contenu :

Zone bleue, la section  : c’est un bloc créé par défaut qui contient les colonnes et les contenus de type image, texte, formulaire, etc.

6/  Zone verte, la colonne :  les colonnes qui vont « couper » votre page en un nombre de colonne défini : 3 colonnes, 4 colonnes, 2/3, 1/2, etc). C’est dans ces colonnes que l’on retrouve le contenu de votre page.

7/  Zone grise, le module :  c’est le contenu de votre site : texte, image, formulaire.

Chaque « zone » a des petits boutons sur la gauche :

Trois barres :  Paramètres

Deux fenêtres collées  : Dupliquer la section/ la colonne/ le module

Trois colonnes  : type de colonnes (uniquement pour la partie verte)

Croix :  supprimer la section/ la colonne/ le module

Vous pouvez faire glisser les modules en gris et les bouger de place avec la souris.

1/ c/ Exemple de page

Voici une  page type contenant :

1 colonne pleine page avec :

1/ Séparateur (trait violet)

2/ Titre (texte grossi)

3/ Texte

3 colonnes contenant chacune :

4/ Un module de type « Personne » : Vous permet d’afficher une image, un titre et du texte pour un membre de votre équipe par exemple + des réseaux sociaux intégrés.

C’est la page telle qu’elle apparaît dans le navigateur.

Nous allons voir dans l’image suivante à quoi elle ressemble.

De retour dans le back-end, voici la page en module, colonnes détaillée :

Chaque module créé possède une « étiquette », correspondant à son type.

1/ Exemple : le module séparateur s’appelle Séparateur et sera présenté comme tel si vous en créez un.

Dans les paramètres du module, il est recommandé de les renommer pour ne pas vous perdre dans la construction de votre page.

2/ 3/ 4/ On retrouve également les trois modules dans les trois colonnes.

Module Séparateur

Nous allons modifier le séparateur (ligne violette).

Après avoir cliqué sur les Paramètres, une fenêtre en popup s’ouvre. La structure telle qu’elle se présente se retrouve dans la majorité des modules. Seules les options varient.

1/ Contenu : gère le contenu de votre module

2/ Style : permet de styliser votre contenu (couleurs, forme, épaisseur, etc)

3/ Les différentes options du module

4/ Sauvegarder et ajouter dans la bibliothèque : Vous permet de sauvegarder votre module dans votre bibliothèque et de le réutiliser dans d’autres pages, articles, projets, etc.

5/ Oeil : affiche un aperçu

6/ Sauvegarder et quitter :  sauvegarde les changements opérés sur le module.

Ne pas oublier après avoir cliqué dessus de cliquer sur Mettre à jour en haut de page.

Module Texte

Nous retrouvons le même affichage et la même disposition.

1/ dans l’espace blanc, vous avez un outil de traitement de texte semblable à Word qui vous permet de mettre en gras ou en italique, de faire des titres, etc.

Module Personne

Le Module personne est un module spécial permettant d’afficher un portrait de la personne avec sa poto, sa fonction, ses coordonnées et ses réseaux sociaux.

1/ Nom de la personne

2/ Poste au sein de la société

3/ URL

4/ Adresse email

Si vous voulez changer l’image de la personne, il faut cliquer sur Charger une image

2/ Ici vous avez l’aperçu de l’image.

Après avoir cliqué sur le bouton, une fenêtre popup appraît.

C’est la bibliothèque de médias de WordPress qui contient toutes les images et autres médias de votre site internet.

Vous n’avez plus qu’à choisir une image si elle est présente dans cette bibliothèque.

Si l’image en question est sur votre ordinateur, il suffit de glisser votre image de votre ordinateur dans cette fenêtre. Elle s’ajoutera automatiquement dans la bibliothèque.

2/ Articles

Nous sommes sur une page type blog.

La zone entourée est un  module blog . Il permet d’afficher les  articles  de votre site internet sous la forme d’un cartouche sur trois colonnes.

Dans  Articles,  vous retrouvez toute la liste de tous les articles de votre site internet.

1/ Le bouton  Ajouter  vous permet d’ajouter un article.

2/ Vous voyez le titre de l’article il faut cliquer dessus pour le modifier.

1/ Titre de l’article

2/ URL de l’article

3/ Yoast SEO : pour le référencement

4/ Bouton mettre à jour pour  valider les changements

La mise en place pour les articles est la même pour les pages.

1/ Catégorie de l’article : sur votre site internet, vous pouvea créeez plusieurs catégories pour votre blog.  Bien cocher l’article dans la bonne catégorie pour commencer, puis sur la page Blog, vous pouvez choisir dans le module Blog quelle catégorie afficher.

2/ Image mise en avant : c’est la vignette que l’on voit en aperçu. Il est recommandé   de ne pas mettre une image trop petit (160x160px était le maximum), pas bon pour le référencement, ou trop grand (ne pas dépasser 52 Ko de taille et 1024 px de dimension)

Réserver les grandes images (qui ne doivent pas non plus dépasser 1500px) pour les fonds, les panoramas.

3/ Même espace d’édition que sur les pages.

3/ Projets

Voici l’option Projets de Divi. Il s’agit d’un mélange entre un article et une page. Il sert plutôt pour les entreprises voulant montrer des projets client, pour des portfolios, pour des études de cas, témoignages approfondis, mises en situation, etc…

L’avantage est que vous pouvez afficher en aperçu plusieurs de vos projets sur une page sans avoir à créer des colonnes, avec des images, etc.

1/ Titre du projet

2/ URL du projet

3/ Yoast SEO : pour le référencement

4/ Bouton mettre à jour pour  valider les changements

La mise en place pour les projets est la même pour les pages et articles.

1/ Catégorie du projet : sur votre site internet, vous pouvea créeez plusieurs catégories pour vos projets.  Bien cocher l’article dans la bonne catégorie pour commencer, puis sur la page de votre choix, vous pouvez choisir dans le module Portefeuille quelle catégorie afficher.

2/ Image mise en avant : c’est la vignette que l’on voit en aperçu. Il est recommandé   de ne pas mettre une image trop petit (160x160px était le maximum), pas bon pour le référencement, ou trop grand (ne pas dépasser 52 Ko de taille et 1024 px de dimension)

Réserver les grandes images (qui ne doivent pas non plus dépasser 1500px) pour les fonds, les panoramas.

3/ Même espace d’édition que sur les pages.

Sur la page de votre choix, vous pouvez activer le module  Portefeuille  et tous vos projets seront présentés en version « aperçu » (juste un titre et une image)

Vous pouvez comme avec le module Blog afficher certaines catégories.

CECI PEUT VOUS INTÉRESSER

17 avr., 2024
Les engagements pour l’écologie font partie des green flags que vous pouvez brandir à vos prospects pour les convaincre d’opter pour vos produits et services. Que ce soit pour réduire vos factures énergétiques ou bien pour avoir une image de marque extrêmement positive, le choix de solutions plus écologiques a de fortes chances de donner un impact positif à votre stratégie marketing. Découvrez-en plus grâce à notre article.
par Alexandra Dumas 18 oct., 2023
Vous êtes une entreprise en quête de succès sur le web ? Pour marquer votre présence en ligne, il est essentiel de confier votre image de marque à une agence de communication compétente. Chez Yumea, nous sommes spécialisés dans trois domaines clés : la création de site internet, la création de logo et le community management sur Instagram. Dans cet article, nous allons explorer ces services essentiels et comment ils peuvent propulser votre entreprise vers de nouveaux sommets en ligne.
par Alexandra Dumas 04 sept., 2023
🍁 L'été touche à sa fin, les feuilles commencent à tomber, et la rentrée est à nos portes. C'est le moment idéal pour revoir votre stratégie de communication digitale ! Chez Yumea, votre agence de communication lyonnaise de confiance, nous sommes là pour vous guider dans cette transition en douceur vers une communication plus efficace et impactante. 🌟
Plus de posts
Share by: