Introduction

Pour débuter ce nouvel article de blog, nous te conseillons de consulter, si ce n’est pas déjà fait, l’article de blog de la semaine dernière où nous évoquons avec toi comment réserver ton hébergement et ton nom de domaine à l’aide de la plateforme OVH et comment y intégrer WordPress et Divi.

Divi qu’est-ce que c’est ?

Divi permet de créer visuellement ton site internet, c’est l’un des éditeurs de sites web les plus connus sur le marché. Son principal avantage est de pouvoir créer sans codes informatiques, ni connaissances en programmation. Si tu souhaites aller plus loin, il est en effet possible d’ajouter du codage pour rendre encore plus authentique et spécifique ton site internet, mais ce n’est pas une obligation.

Comment fonctionne Divi ?

Divi te permet de mettre en place ton site internet grâce à des templates déjà intégrés sur Divi ou de construire ton site internet de zéro pour le rendre plus unique. Avant de commencer à créer des pages avec Divi il est nécessaire d’effectuer les premiers réglages sur ton WordPress et aussi sur Divi, que nous allons te présenter ci-dessous. 

Les étapes une fois Divi installé

  • Télécharger l’extension “Really Simple SSL” pour sécuriser ton site internet et le passer en HTTPS (sécurisé), il faut bien évidemment auparavant, l’avoir activé sur ton hébergement.
  • Enregistre ta licence Divi en te rendant sur ton compte Divi > En cliquant sur Compte > Puis clé API et nom d’utilisateur > Copie les 2 éléments > Ensuite il faut te rendre de nouveau sur ton WordPress > Cliquer sur divi > Mise à jours > Colle les informations.
  • Ensuite sur ton WordPress rends-toi sur le menu de gauche dans la section “Mises à jour” et mets à jour ton thème Divi, WordPress et l’ensemble des extensions s’il y a besoin. Pour effectuer les premières mises à jour de ton site WordPress, rendez-vous dans la rubrique “Réglages” puis modifie le titre de ton site en mettant le nom de ton entreprise et modifie le slogan par le tien. Ensuite dirige-toi dans la rubrique “Permaliens” et sélectionne “Titre de la publication”, cette fonction permet de personnaliser le nom de tes pages au niveau des URL 
  • Pour paramétrer Divi, il te suffit de te rendre sur l’onglet “Divi” puis “Options du thème”
    Logo : Insère ton logo au format horizontal et en PNG pour qu’il puisse être visible sur ton site
    Autres : Pour le reste, tu peux choisir de laisser activé ou désactivé la barre de navigation fixe en haut de ton site internet puis sélectionner ta palette de couleurs et tu peux terminer par activer ou désactiver la présence de réseau sociaux sur ton site internet. Moi j’ai tendance à tous les désactiver pour pouvoir ajouter ensuite à l’endroit où je le souhaite les icônes réseaux sociaux et pas uniquement au niveau du footer (le bas de page du site internet). 

Modifier l’apparence de ton site Divi

Pour modifier l’apparence de ton site internet, tu dois te rendre dans l’onglet “Apparence” sur ton menu de gauche, puis “personnaliser”. Une fois arrivé sur cet espace, tu vas devoir t’occuper de l’ensemble des onglets indiqués sur ta gauche.

Pour commencer : Paramètres généraux 

  • Identité du site : Le titre et le slogan sont normalement déjà modifiés, alors dirige-toi vers “Icône du site” et importe un symbole qui représente ton entreprise au format carré 512 x 512 pixels au format PNG
  • Paramètres de mise en page : Cet espace est principalement consacré aux réglages de la mise en page du site internet, dimensions, hauteurs, couleur d’accent du thème. Généralement sur cette partie je m’occupe uniquement de la couleur d’accent du thème à sélectionner car l’ensemble des autres éléments sont déjà réglés. 
  • Typographies : Dans cette partie tu peux choisir la taille de tes textes, pour le titre 1, titre 2… Tu peux également sélectionner les polices que tu souhaites avoir sur ton site (l’idéal est de mettre celle de ton identité visuelle), ça te permettra de gagner du temps au moment de la rédaction. Pour terminer avec cette section tu peux également choisir les couleurs pour tes textes et tes liens. 
  • Fond : tu peux choisir une couleur ou une image

En-tête et navigation : Dans cette rubrique, tu peux voir l’ensemble des éléments qui concernent le format de l’en-tête , la disposition de ton menu ainsi que ses dimensions et sa couleur. De même pour la barre du menu primaire puis du menu secondaire et la barre supérieure. Ensuite tu peux te diriger dans la rubrique “Eléments de l’en-tête”, dans laquelle tu peux ajouter quelques options comme afficher les icônes réseaux sociaux, un icône de recherche, ton numéro de téléphone et aussi ton adresse email.

Boutons : Cet espace te permet de personnaliser les boutons sur ton site internet, tu peux choisir d’ajouter des effets au survol, choisir la couleur, la taille, la typographie, la couleur du contour, un petit icône.

Styles sur mobiles : Ici tu peux comparer le visuel de ton site internet sur ta tablette, ton téléphone, le menu sur mobile. Cet espace est important si tu souhaites effectuer des réglages en fonction des supports utilisés par les internautes.

Palettes de couleurs : Comme nous avons déjà paramétré notre palette de couleurs sur WordPress précédemment, nous n’avons pas besoin d’interagir avec cette section. 

Menu : Cet espace est très important car il te permet de mettre en avant sur ton site internet les pages souhaitées et de cacher celles que tu ne désires pas rendre visible. En te rendant sur l’onglet “Menu principal”, ici tu peux y ajouter des éléments en effectuant un glisser-déposer. En bas de cette rubrique tu disposes d’un espace “Options du menu”, tu peux ajouter directement toutes les pages que tu vas créer à ton menu, automatiquement (c’est un gain de temps car ça t’évite de devoir revenir à chaque création de page à cet endroit). Je te le déconseille de cocher cette case si tu effectues par exemple des landings page, ou des pages de formation avec ton site internet par exemple qui ne doivent être accessibles qu’à un certain nombre de personnes. 

Réglage de la page d’accueil : C’est la dernière catégorie la plus importante car elle te permet de contrôler la disposition de ta page d’accueil, si tu souhaites créer uniquement un blog, alors je te conseille de sélectionner “Les derniers articles”. Cependant si tu souhaites créer un site complet, je te conseille de sélectionner une page statique. Pour terminer il te suffit de sélectionner ta page d’accueil au niveau de l’onglet “Accueil” et ta page avec tes articles de blog, au niveau de la “page des articles“ (si tu n’en as pas, laisse vide).

Si tu souhaites voir en vidéo, comment fonctionne le paramétrage complet, je te redirige vers la vidéo ci-dessous où je te montre étape par étape comment paramétrer WordPress et Divi en fonction de tes besoins.

Tu as également envie de faire évoluer le référencement de ton référencement SEO : accède ici à ta formation SEO gratuite d’1h00.

Introduction

Pour débuter ce nouvel article de blog, nous te conseillons de consulter, si ce n’est pas déjà fait, l’article de blog de la semaine dernière où nous évoquons avec toi comment réserver ton hébergement et ton nom de domaine à l’aide de la plateforme OVH et comment y intégrer WordPress et Divi.

Divi qu’est-ce que c’est ?

Divi permet de créer visuellement ton site internet, c’est l’un des éditeurs de sites web les plus connus sur le marché. Son principal avantage est de pouvoir créer sans codes informatiques, ni connaissances en programmation. Si tu souhaites aller plus loin, il est en effet possible d’ajouter du codage pour rendre encore plus authentique et spécifique ton site internet, mais ce n’est pas une obligation.

Comment fonctionne Divi ?

Divi te permet de mettre en place ton site internet grâce à des templates déjà intégrés sur Divi ou de construire ton site internet de zéro pour le rendre plus unique. Avant de commencer à créer des pages avec Divi il est nécessaire d’effectuer les premiers réglages sur ton WordPress et aussi sur Divi, que nous allons te présenter ci-dessous. 

Comment fonctionne Divi ?

 

  • Télécharger l’extension “Really Simple SSL” pour sécuriser ton site internet et le passer en HTTPS (sécurisé), il faut bien évidemment auparavant, l’avoir activé sur ton hébergement.
  • Enregistre ta licence Divi en te rendant sur ton compte Divi > En cliquant sur Compte > Puis clé API et nom d’utilisateur > Copie les 2 éléments > Ensuite il faut te rendre de nouveau sur ton WordPress > Cliquer sur divi > Mise à jours > Colle les informations.
  • Ensuite sur ton WordPress rends-toi sur le menu de gauche dans la section “Mises à jour” et mets à jour ton thème Divi, WordPress et l’ensemble des extensions s’il y a besoin. Pour effectuer les premières mises à jour de ton site WordPress, rendez-vous dans la rubrique “Réglages” puis modifie le titre de ton site en mettant le nom de ton entreprise et modifie le slogan par le tien. Ensuite dirige-toi dans la rubrique “Permaliens” et sélectionne “Titre de la publication”, cette fonction permet de personnaliser le nom de tes pages au niveau des URL 
  • Pour paramétrer Divi, il te suffit de te rendre sur l’onglet “Divi” puis “Options du thème”
    – Logo : Insère ton logo au format horizontal et en PNG pour qu’il puisse être visible sur ton site
    – Autres : Pour le reste, tu peux choisir de laisser activé ou désactivé la barre de navigation fixe en haut de ton site internet puis sélectionner ta palette de couleurs et tu peux terminer par activer ou désactiver la présence de réseau sociaux sur ton site internet. Moi j’ai tendance à tous les désactiver pour pouvoir ajouter ensuite à l’endroit où je le souhaite les icônes réseaux sociaux et pas uniquement au niveau du footer (le bas de page du site internet).

Modifier l’apparence de ton site Divi

Pour modifier l’apparence de ton site internet, tu dois te rendre dans l’onglet “Apparence” sur ton menu de gauche, puis “personnaliser”. Une fois arrivé sur cet espace, tu vas devoir t’occuper de l’ensemble des onglets indiqués sur ta gauche.

Pour commencer : Paramètres généraux 

  • Identité du site : Le titre et le slogan sont normalement déjà modifiés, alors dirige-toi vers “Icône du site” et importe un symbole qui représente ton entreprise au format carré 512 x 512 pixels au format PNG
  • Paramètres de mise en page : Cet espace est principalement consacré aux réglages de la mise en page du site internet, dimensions, hauteurs, couleur d’accent du thème. Généralement sur cette partie je m’occupe uniquement de la couleur d’accent du thème à sélectionner car l’ensemble des autres éléments sont déjà réglés. 
  • Typographies : Dans cette partie tu peux choisir la taille de tes textes, pour le titre 1, titre 2… Tu peux également sélectionner les polices que tu souhaites avoir sur ton site (l’idéal est de mettre celle de ton identité visuelle), ça te permettra de gagner du temps au moment de la rédaction. Pour terminer avec cette section tu peux également choisir les couleurs pour tes textes et tes liens. 
  • Fond : tu peux choisir une couleur ou une image

En-tête et navigation : Dans cette rubrique, tu peux voir l’ensemble des éléments qui concernent le format de l’en-tête , la disposition de ton menu ainsi que ses dimensions et sa couleur. De même pour la barre du menu primaire puis du menu secondaire et la barre supérieure. Ensuite tu peux te diriger dans la rubrique “Eléments de l’en-tête”, dans laquelle tu peux ajouter quelques options comme afficher les icônes réseaux sociaux, un icône de recherche, ton numéro de téléphone et aussi ton adresse email.

Boutons : Cet espace te permet de personnaliser les boutons sur ton site internet, tu peux choisir d’ajouter des effets au survol, choisir la couleur, la taille, la typographie, la couleur du contour, un petit icône.

Styles sur mobiles : Ici tu peux comparer le visuel de ton site internet sur ta tablette, ton téléphone, le menu sur mobile. Cet espace est important si tu souhaites effectuer des réglages en fonction des supports utilisés par les internautes.

Palettes de couleurs : Comme nous avons déjà paramétré notre palette de couleurs sur WordPress précédemment, nous n’avons pas besoin d’interagir avec cette section. 

Menu : Cet espace est très important car il te permet de mettre en avant sur ton site internet les pages souhaitées et de cacher celles que tu ne désires pas rendre visible. En te rendant sur l’onglet “Menu principal”, ici tu peux y ajouter des éléments en effectuant un glisser-déposer. En bas de cette rubrique tu disposes d’un espace “Options du menu”, tu peux ajouter directement toutes les pages que tu vas créer à ton menu, automatiquement (c’est un gain de temps car ça t’évite de devoir revenir à chaque création de page à cet endroit). Je te le déconseille de cocher cette case si tu effectues par exemple des landings page, ou des pages de formation avec ton site internet par exemple qui ne doivent être accessibles qu’à un certain nombre de personnes. 

Réglage de la page d’accueil : C’est la dernière catégorie la plus importante car elle te permet de contrôler la disposition de ta page d’accueil, si tu souhaites créer uniquement un blog, alors je te conseille de sélectionner “Les derniers articles”. Cependant si tu souhaites créer un site complet, je te conseille de sélectionner une page statique. Pour terminer il te suffit de sélectionner ta page d’accueil au niveau de l’onglet “Accueil” et ta page avec tes articles de blog, au niveau de la “page des articles“ (si tu n’en as pas, laisse vide).

Si tu souhaites voir en vidéo, comment fonctionne le paramétrage complet, je te redirige vers la vidéo ci-dessous où je te montre étape par étape comment paramétrer WordPress et Divi en fonction de tes besoins.

Tu as également envie de faire évoluer le référencement de ton référencement SEO : accède ici à ta formation SEO gratuite d’1h00.

Site internet wordpress avec Divi sur wordpress, divi theme.
Téléchargez votre formation gratuite identité visuelle pour vous permettre d'avoir une identité visuelle impactante et convertir vos prospects