fbpx

Bons plans Alpa14 | Des offres et des réductions intéressantes à découvrir 😃

Comment créer une page blog sur votre site WordPress avec Divi ?

Comment insérer un blog sur votre site Web ?

Dans ce nouveau tutoriel Divi, je vais vous montrer comment placer un blog dans votre site WordPress.
Le blog peut être un module intéressant à activer sur votre site Intenet, car il va vous permettre d’organiser vos articles et de faire réagir vos lecteurs grâce aux commentaires.
Dans cette vidéo nous utiliserons Divi et son Visual Builder qui va nous permettre de construire visuellement et facilement nos pages.

Licence Divi
Amelia booking plugin
.

Dans ce tutoriel, nous partirons d’un site fictif que j’ai réalisé. Il s’agit d’un site d’unboxing qui présentera le déballage d’objets technologiques et les commentaires associés. Ces objets technologies seront regroupés sous 4 catégories.

  1. Ordinateur portables
  2. Smartphones
  3. Appareil photos
  4. Divers.

En ce début de tutoriel,  le site est constitué de 3 pages, une page « Accueil », une page « Qui sommes-nous ? » et une page « Contact ».
Nous avons donc besoin d’une page où seront regroupés et classés tous les articles unboxing de notre site. Le blog sera donc ici la plateforme parfaite pour faire et organiser ces présentations.
Nous allons donc insérer un blog dans notre site WordPress sur une page de présentation des articles intitulée « Unboxing ».

Site unboxing

Etapes pour création et l’insertion de notre page Blog sur notre site WordPress

1) Création de quelques articles pour illustrer notre Blog.

A noter que dans WordPress, les articles de Blog vont se créer dans la rubrique « Articles » et non « Pages ».
Quand vous créez un article, dans la marge de droite, il vous est possible de définir des catégories et d’y placer l’article concerné en cochant la case correspondante.
Vous pouvez également choisir une image présentée à cet endroit. C’est l’image principale de l’article. C’est cette image qui apparaîtra avec un court extrait de votre article sur la page blog que nous allons créer. C’est également cette image qui apparaîtra si vous partagez le lien URL votre article via les réseaux sociaux.

 

MalerLite
menu wordpress

2) Enregistrement de la section bannière

Afin d’aller plus vite dans la création de cette nouvelle page, je vais tout d’abord récupérer la bannière de la page d’accueil pour la placer sur notre nouvelle page, j’enregistre la section de ma page « Accueil » (la contenant) dans ma librairie (en cliquant sur la flèche dans le cercle). Une autre solution serait lors de la création de notre page Blog de cloner la page d’accueil pour conserver la bannière puis d’effacer ensuite les modules inutiles.

Création de la page Blog (dans notre cas nous l’appellerons « Unboxing ») sur laquelle seront placés des extrait de chaque article avec leur « image présentée » respective. Pour cela, allez sur « Pages » dans le menu de gauche.

Menu section Divi
Divi Elegant Themes

3) Insertion des modules Blog et Barre latérale

Sur cette nouvelle page, dans la 2ème section, sous la section de la bannière, créez une rangée 3/4  1/4. Placez dans la colonne de gauche (3/4) le module Blog. Veuillez noter au passage que les extraits et les images présentées des articles apparaissent. Puis dans la colonne de droite (1/4), placez le module « Barre latérale »

rangée Divi

4) Apportez le style souhaité à votre Blog et à votre barre latérale

A noter que vous pouvez vraiment modifier l’apparence classique de votre Blog en allant dans les paramètres du Blog, sur l’onglet « Style » et en choisissant le modèle « Grille » dans la partie « Modèle ».

Disposition Grille Blog Divi
Apparence Blog Divi

5) Ajoutez la nouvelle page créée au menu du header

Pour cela rendez-vous dans le menu de gauche « Apparence » puis « Menus », sélectionnez à gauche « Voir toutes les pages » puis cochez la page à ajouter puis l’ajouter. Dans notre cas, ce sera ici « Unboxing ». Réorganisez les pages du menu (si nécessaire) par glisser/déposer.

Menu Divi WordPress

6) Paramétrage de la barre latérale

Pour modifier les éléments de votre barre latérale, rendez-vous dans le menu de gauche dans « Apparence » puis « Widgets ». Il vous suffira d’ajouter des éléments à votre barre en glisser/déposer ou d’en retirer.
Il est également possible de paramétrer la barre latérale en passant (toujours menu de gauche) par « Divi » puis « Personnaliseur de Thème »

Barre latérale WP
Widget WP

7) Déclarez la lecture des pages

Pour indiquer à WordPress quelles pages il doit afficher en premier, il faut aller les déclarer. Pour cela, rendez-vous dans « Réglages » puis « Lecture ». Dans réglages de lecture, choisissez l’option « Une page Statique ». Dans « Page d’accueil » déclarer la 1ère page sur laquelle arriveront les internautes en écrivant ou en cliquant sur votre nom de domaine (votre-site.fr). Pour nous ce sera « Accueil »
Attention, pour « Page des articles » ne choisissez pas votre page de Blog, sinon WordPress affichera une page Blog par défaut sans le design de Divi. Laissez sur « Sélectionner »

Divi Elegant Themes
Déclarer la lecture des pages

8) Créer un gabarit pour les pages catégories avec le Thème Builder

En cliquant sur une catégorie de votre barre latérale, vous constatez que le Design Divi réalisé pour la page d’affichage de Blog n’est pas conservé. Pour modifier cela, nous allons construire une page catégories avec une titre  dynamique.

Pour cela, rendez-vous dans le menu de gauche, choisissez « Divi » puis « Thème Builder ». Choisissez une case vide et cliquez sur « Ajouter un nouveau modèle » puis cochez la case « Toutes les catégories pages » puis cliquez au bas sur « Créer un modèle ». Ensuite cliquez sur « Ajouter un corps personnalisé » puis « Construire un corps personnalisé »

Divi Theme Builder
Divi Titre dynamique

Dans la création de la nouvelle page sélectionnez « Cloner une page existante » puis choisissez de cloner votre page d’affichage de votre blog. Pour nous ce sera la page « Unboxing ».
Dans le module d’affichage de votre bannière, dans « Titre » cliquez sur les petits disques empilés pour utiliser un contenu dynamique, puis choisissez « Poster/Titre de l’archive ».
En paramétrant ainsi, le titre de la catégorie appelé apparaîtra automatiquement à cet emplacement et ce de manière dynamique.
Ensuite dans les paramètres du module Blog, onglet « Contenu » puis dans « Catégories incluses », cochez « Catégorie actuelle ». Enregistrez le tout.

Réglage Blog Divi

Félicitations ! Votre Blog est en place.
Vous avez sans doute remarqué que l’affichage de votre article lui-même conserve l’affichage classique de WordPress. Pas de panique :)
Dans un prochains tutoriel, je vous montrerai comment créer un gabarit personnalisé de page d’article en y incluant des modules cools disponibles dans le Divi Builder !

MalerLite

Par où commencer pour créer son site Internet ?

Toute personne disposant d’un ordinateur et d’une connexion Internet peut créer son propre site Web. Il existe de nombreux outils en ligne qui facilitent le processus. Les sites Web peuvent être utilisés pour promouvoir votre entreprise, communiquer avec les clients et partager vos idées.

Dans cette vidéo qui est qui est une retransmission d’un Webinar, Léopoldine la fondatrice de la société Webmyday, explique les différentes étapes à suivre et les bonnes questions à se poser pour créer son premier site web professionnel. Elle passe en revue les services et les outils nécessaires à la conception Web et propose des conseils pour créer un site Web efficace.

Cette vidéo est une excellente ressource pour les débutants qui souhaitent en savoir plus sur les étapes à suivre dans la conception Web ou pour les propriétaires d’entreprise qui ont besoin de créer un site Internet pour leur activité. 

Sommaire de la vidéo

0:00 Introduction
2:41 La formation Webmyday qu’est-ce que c’est ?
6:22 Faire ou faire faire son site Internet ?
16:31 Solutions pour faire son site soi-même
18:24 Solutions pour faire faire son site
22:33 Coût d’un site Internet
25:55 Un CMS, qu’est-ce que c’est ?
26:46 Les CMS les plus connus
32:57 Le nom de domaine
33:39 L’ hébergement
34:54 Quelques hébergeurs
38:35 4 choses que doit comprendre votre hébergement
40:01 WordPress qu’est-ce que c’est ?
40:29 Différence entre WP.com et wp.org
43:00 Les différentes composants de WP
46:33 En résumé les étapes pour travailler avec WordPress
47:47 Conclusion

Sommaire de la vidéo

Vous serez peut-être également intéressé par ces articles …

Enregistrer son écran pour créer des formations

Enregistrer son écran pour créer des formations

Vous recherchez un logiciel de capture pour filmer l’écran de votre PC ou de votre Mac ? Vous souhaitez créer des démos de logiciels, des démos de jeux, des tutoriels ou des vidéos de formation d’aspect professionnel ? Alors vous avez sans doute besoin de DemoCreator de Wondershare !

lire plus
Divi Supreme : Module Text Path

Divi Supreme : Module Text Path

Divi Supreme possède un excellent nouveau module intitulé Text Path qui vous permet de créer de magnifiques chemins de texte. Avec ce module, vous pouvez facilement créer des motifs et des dessins complexes dans votre texte.

lire plus
Créer un pop-up sur un site Divi

Créer un pop-up sur un site Divi

Ce tutoriel vous propose une solution simple et pratique pour créer un pop-up. En effet, je vous présente un plugin gratuit pour Divi intitulé « Popups for Divi » qui vous permettra de transformer toute section de votre site web en fenêtre pop-up.

lire plus
Offrez-moi un café! Merci :)