Vous êtes sur la page 1sur 32

Procédure Wordpress

Comment installer WordPress?

 1. Télécharger les fichiers de WordPress et les décompresser (site officiel de WordPress).

 2. Créer de la base de données (Elle contient toutes les informations liées au site (contenus, réglages et utilisateurs).

 3. Déposer les fichiers de WordPress à l'emplacement désiré sur le serveur Web

 4. Exécuter le Script d'Installation (http://www.exemple.com)

 5. Une fois l’installation terminée, se connecter au Back-Office avec les éléments renseignés lors de l’installation
(http://www.exemple.com/wp-admin) et qui seront identiques au Log (Identifiant -> incomm.wordpress@gmail.com
/ MDP -> celui créé dans le log).

 6. Supprimer et désinstaller les pages d’exemple, les articles et les extensions installés par défauts et qui
encombrent.

 7. Ensuite on passe aux réglages expliqués dans la page suivante.


Structure d’un site Wordpress

Les sites WordPress ont tous la même structure.


À la racine, vous trouverez les dossiers wp-admin, wp-content, wp-includes et les fichiers WordPress.

1. Le dossier wp-admin contient l’ensemble des fichiers concernant l’administration du site. Il ne faut pas modifier
des fichiers dans ce dossier.

2. Le dossier wp-content contient l’ensemble des fichiers des thèmes, des extensions et des médias. C’est dans ce
dossier que s’effectuent les modifications et personnalisations du site.

3. Le dossier wp-includes contient l’ensemble des fichiers du core de WordPress (classes, fonctions, scripts…). Il ne
faut pas modifier des fichiers dans ce dossier.

4. Le fichier wp-config.php est un fichier généré lors de l’installation de WordPress, à partir du fichier wp-config-
sample.php. Les informations qui ont servi à la configuration du site se trouvent dans ce fichier : le nom de la base
de données, le mot de passe, l’URL de la base de données, le préfixe des tables, les clés de sécurité, les
langues… Ce fichier est modifié lors du changement d’hébergeur, lors de l’optimisation du site, du débogage,
lors d’un changement de langue… La suppression du fichier wp-config.php réaffiche la page de configuration.
Le dossier wp-content

Le dossier wp-content est le dossier servant à la création de thèmes,


d’extensions, de fonctions. Il contient les dossiers languages, plugins, themes et le
fichier index.php.

D’autres dossiers apparaissent lors d’ajout d’images, comme le dossier uploads,


et lors de mises à jour, tel le dossier upgrade.

D’autres dossiers peuvent encore apparaître selon l’installation de certaines


extensions, comme le dossier cache.
Le dossier wp-content (suite)

Le dossier languages contient les fichiers de langue de WordPress. L’installation manuelle s’effectue en
téléchargeant par FTP les fichiers de langue dans ce dossier.

Le dossier plugins contient l’ensemble des extensions installées.

Le dossier themes contient l’ensemble des thèmes installés.

Le dossier uploads contient l’ensemble des médias téléchargés. Pour les images, WordPress crée trois formats
d’image et les classe selon les paramètres entrés dans l’administration. Par défaut WordPress classe les
médias dans des dossiers ayant pour nom l’année, avec à l’intérieur des dossiers ayant pour nom les mois en
chiffres (01, 02, … 12). Certaines extensions y créent parfois des dossiers pour y stocker divers fichiers.

Le dossier upgrade accueille les fichiers compressés des mises à jour de thèmes ou d’extensions. Avant leur
décompression, WordPress les télécharge dans ce dossier. Si la mise à jour se passe mal, vous retrouvez le
fichier compressé dans ce dossier.

Le fichier index.php sert uniquement à la sécurité du dossier wp-content. Ce fichier vide permet d’afficher
une page blanche au lieu de l’arborescence du site en cas de dysfonctionnement.
Désactivation mises à jour Wordpress

Désactivation de la mise à jour


automatique de Wordpress après
l’installation de Wordpress.

Code à insérer dans le fichier wp-


config.php ligne 86 situé à la racine
du site. (le petit bout de code est sur
le FTP -> code_wp-config)
Réglages de Wordpress

Le menu Réglages de WordPress est


décliné en 6 sous-onglets :

 1. Général : Réglages généraux de votre site WordPress

 2. Écriture : Réglages inhérents à la rédaction et à la


publication

 3. Lecture : Options pour la lecture et l’affichage de vos


articles

 4. Discussion : Options concernant les échanges avec vos


lecteurs

 5. Médias : Taille et organisation de vos médias

 6. Permaliens : Choix du permalien et des préfixes


Étape 1 : le sous-onglet Général

1. Le Titre du site : par défaut, «WordPress» est déjà renseigné dans ce champ. Changer cela par le nom du site.
2. Le Slogan : comme pour le champ Titre, le champ Slogan présentera la mention par défaut. Indiquer plus en
détail la vocation du site. (Reste optionnel)
3. Adresse web de WordPress : Ce champ est, par défaut, déjà renseigné grâce aux informations fournies lors de
l’installation (! Ne pas modifier les informations inscrites ici).
4. Adresse web du site : de même que pour le précédent champ, ne pas modifier ce paramètre (uniquement si
passage en HTTPS).
5. Adresse de messagerie : par défaut, lors de l’installation de WordPress, vous avez renseigné une adresse mail, elle
sera donc inscrite ici. Cette adresse mail sera régulièrement utilisée par WordPress ainsi que par certains plugins.
6. Inscription : Cette option permet à n’importe quel internaute de s’inscrire sur le site et d’avoir un accès plus ou
moins limité au backoffice (ne pas cocher par défaut)
7. Rôle par défaut de tout nouvel utilisateur : Choisir le niveau d’accès des futurs inscrits. Il est fortement conseillé de
laisser le menu déroulant sur Abonné
8. La langue du site : Choix de la langue du site qui sera utilisée dans votre administration ainsi que sur la totalité de
votre site. ( ! Attention, cela n’a aucun rapport avec la gestion du multilingue).
9. Le fuseau horaire : Par défaut « Paris »
10. Format de la date et de l’heure : Défini le format -> CHOISIR 20/10/2018 et pour l’heure 11:45
11. La semaine débute le : généralement c’est le lundi…
12. Enregistrer les modifications : Sauvegarder tous les changements effectués.
Étape 2 : le sous-onglet Écriture

L’onglet Écriture permet d’effectuer les


réglages inhérents à la rédaction et à la
publication d’articles. Tant qu’il n’y a pas
d’articles, ce sous-menu n’a pas d’utilité pour
les Prédevs.
Étape 3 : le sous-onglet Lecture

l’onglet Lecture permet de paramétrer toutes


sortes d’options pour la lecture et l’affichage
des articles.

À la création des 1ères pages, le menu 1


devient actif. C’est ici que l’on vient déclarer
à Wordpress quelle sera notre page
d’accueil. En dehors de cet aspect, ce sous-
menu n’a aucun intérêt pour les Prédevs.
Étape 4 : le sous-onglet Discussion

Discussion, permet de paramétrer toutes les options concernant les


échanges avec les lecteurs. Cela concerne les commentaires, les
abonnements au blog, les notifications etc…

Là aussi, tant qu’il n’y a pas de blog ce sous-menu ne représente


aucun intérêt pour les Prédevs.
Étape 5 : le sous-onglet Médias

L’onglet Médias concerne les médias téléchargés


dans la bibliothèque et la taille de leur miniatures
(thumbnails). Il est purement indicatif.

1. Les tailles des images : par défaut, trois type de miniatures


appelées également thumbnails. Possibilité de paramétrer la
taille des images miniatures, moyennes ou grandes. Pour que
ces modifications soient prisent en compte, il faudra installer le
plugin Regenerate Thumbnails
2. L’envoi de fichier : une seule option à cocher qui permet de
classer les téléchargements de médias par mois et par années. Il
sera plus facile de retrouver les images dans les dossiers de
sauvegardes.
3. Enregistrer les modifications : ne pas oublier de sauvegarder tous
les changements effectués.
Étape 6 : le sous-onglet Permaliens

Le réglage des permaliens est primordial avant


toute écriture d’article ou de page car il faudra
les paramétrer de façon définitive.

1. le plus simple et le plus efficace est “Titre de la


publication”, ce qui génèrera le type d’URL
suivant : http://exemple.com/mon-premier-article/. Ce type
d’URL est propre.
Plugins à installer de base

 User Role Editor (permet de changer facilement les rôles et les capacités des utilisateurs ou de créer de nouveaux
rôles > Gérant)

 WPS Hide Login (plugin très léger qui vous permet de changer facilement et en toute sécurité l’url de la page de
formulaire de connexion > wp-admin > kameleon)

 Smart Slider 3 (Création de diaporama)

 Yoast SEO (plugin pour le référencement) > Ne pas activer pour les prédev

 WP Super Cache (plugin de mise en cache le plus populaire avec plus de 6 millions de téléchargement) > Ne pas
activer pour les prédev

 Cookie Notice for GDPR > Ne pas activer pour les prédev

 Duplicate posts (permet de dupliquer les pages)


Plugins à installer de base (suite)

Le back-office au niveau des extensions devrait ressembler à l’image ci-dessous

S’assurer que toutes les


extensions soient à jour.
Sinon effectuer les mises à
jour.
Plugins à installer ponctuellement

 Really Simple SSL (il configure le site web pour fonctionner en HTTPS)

 All-in-One WP Migration (Ce plugin exporte un site WordPress, y compris la base de


données, les fichiers multimédias, les plugins et les thèmes)

 WooCommerce (Extension eCommerce gratuite)

 Wordfence Security (Permet de sécuriser Wordpress)

 D’autres plugins peuvent être installés pour répondre à certains besoins spécifiques, voir
au cas par cas.
Installation de « Divi » et du thème enfant

Une fois ces 3 étapes effectuées,


Installer sans activer le thème Divi, puis
installer et activer le thème Divi-child
puis supprimer tous les autres.
Structure du thème enfant

Un thème enfant se compose uniquement des 2 fichiers principaux (listés ci-dessous). C’est uniquement
dans ces 2 fichiers que se feront toutes nos modifications CSS et PHP.

Un fichier style.css Un fichier function.php


Installation du thème enfant (suite)

Une fois le thème enfant installé et activé, le BO doit ressembler à l’image ci-dessous

Si le thème Divi n’est pas à jour,


effectuer la mise à jour du thème.

Il faudra pour cela que vous rentriez la


clè API de (disponible sur FTP) dans les
options du thème :

Divi > option du thème > onglet Update


Création des droits « Gérant » sur WP

Création du rôle « Gérant » :


Depuis le menu Utilisateurs > User Role Editor > Ajouter un
rôle :
id = gerant
nom = Gérant
Ne cocher que les cases listées sur les 2 images (capture
sur le FTP -> service developpement -> wordpress -> droits
gérant)

Configuration par défaut à mettre en place pour tous les


sites.
Création des droits WP (suite)
Réglages Divi (option du thème > Général)

1. Logo => C’est ici que vous pourrez


télécharger le logo du site.
2. Barre de navigation fixe (sticky) => par
défaut, la barre de navigation fixe est
activée.
3. Activer la galerie Divi => Remplace le
style par défaut de WordPress par son
propre style.
4. Palette de couleurs par défaut => lorsque
vous travaillez sur un projet web, vous avez
des codes couleurs à respecter et cette
option vous permet de pré-définir jusqu’à 8
couleurs.
5. Saisir la première image de l’article
=> « l’image à la une » de chaque article
sera remplacée par la première image
contenue dans votre article.
6. Mode style de blog => Ce n’est pas
recommandé de l’activer pour le SEO.
Réglages Divi (option du thème > Général)

8. Sidebar Layout et 9 – Gabarit boutique => Dans ces


deux options, vous pourrez choisir l’emplacement de
la barre latérale de blog et de boutique (sidebar).
Vous déciderez alors de la faire apparaitre à droite
ou à gauche.
10. Clé API et Script de Google Map => Saisir ici la clé
API et décider de mettre les script en file d’attente
pour améliorer la performance du site.
De 11 à 14. Icônes des réseaux sociaux => Pour
chaque réseau social, vous pouvez décider de faire
apparaitre son icône en pied de page du site. (pour
en ajouter d’autres, voir le code sur FTP > codes-
divers)
De 15 à 18. URL des réseaux sociaux => en fonction
des icônes que vous aurez activé dans les étapes de
11 à 14, vous devrez saisir les URL correspondantes.
Concernant le flux RSS du site, vous pourrez saisir
l’adresse suivante : https://exemple-site.com/feed
Réglages Divi (option du thème > Général)

De 19 à 23. le nombre des archives => les


pages d’archives sont des pages générées
automatiquement par WordPress. Que ce soit
les archives des produits e-commerce, les
archives de catégories, la page de recherche
ou les archives de tags, Divi vous propose de
paramétrer page par page le nombre
d’élément à afficher.
24. Format de la date => vous pouvez définir ici
le format de la date des articles.
25. Utilisation des extraits => si vous désactivez
cette option, les extraits ne seront pas utilisés.
Réglages Divi (option du thème > Général)

26. Shortcodes réactifs => activer


l’option « shortcodes réactifs » permet d’afficher les
éléments de shortcode de manière responsive.
27. Sous-ensemble Google Fonts => cette
fonctionnalité active les polices de Google pour les
autres langues que l’anglais.
28. Retour haut de page => scroll To top
29. Défilement fluide => cette option permettrait de
proposer un défilement plus fluide lorsqu’on scrolle…
30. Désactiver les traductions
=> certaines « strings » peuvent être traduites si vous
activez cette option.
31. Javascript => cette option permet de minifier et
de combiner certains fichiers de javascript
32. CSS => pareil que pour le Javascript
33. Personnaliser CSS => Pareil que Apparence >
Personnaliser > CSS additionnel.
34. Sauvegarder => n’oubliez pas de sauvegarder vos
changements !
Réglages Divi (option du thème > Navigation)

1. Exclusion de pages : il vaut mieux passer par


les options qu’offre WordPress depuis
l’onglet Apparence > Menu
2. Menus déroulants : si cette option est
désactivée, seules les pages de premier
niveaux seront prisent en compte.
3. Lien d’accueil : si vous avez défini votre page
d’accueil dans l’onglet Apparence >
Personnaliser > Page d’accueil statique, cela
créera un doublon. À désactiver
4. Classement des liens : il vaut mieux passer
par l’onglet Apparence > Menu
5. Ordre de classement : il vaut mieux passer
par l’onglet Apparence > Menu
6. Nombre de niveaux dans les menus
déroulants : profondeur d’un menu
7.Sauvegarder : n’oubliez pas sauvegarder!
Réglages Divi (option du thème > Navigation 2)

1. Exclusion de catégories : il est plus pertinent de


faire cela depuis l’onglet Apparence > Menu
2. Menus déroulants : si le blog détient des
catégories-enfant et que vous souhaitez les faire
apparaitre automatiquement, vous pouvez
activer cette option.
3. Catégories vides : Par défaut, les catégories qui
ne contiennent aucun article ne seront pas
affichées. Si vous désirez quand même les afficher,
vous pouvez désactiver cette option.
4. Niveaux du menus déroulant : tout comme les
menus déroulants des pages, vous pouvez
décider de la profondeur du menu déroulant des
catégories.
5. Classer les liens : vous pouvez filtrer le classement
des liens de la navigation de catégorie
6. Ordre de classement : vous pouvez les classer
selon un tri ascendant ou descendant.
7. Sauvegarder : n’oubliez pas de sauvegarder !
Réglages Divi (option du thème > Créateur)

1. Génération de fichier CSS : le fait d’activer cette


option permet de gagner en performance, c’est à
dire en rapidité. Les styles CSS générés par le Divi
Builder seront mis en cache, comme le fait le
plugin de cache WP Super Cache.
2. Déclaration des styles : avec les versions
précédentes du Divi Builder, les styles CSS des
modules étaient affichés en ligne (inline) dans le
pied de page. Activez cette option si vous
souhaitez restaurer ce comportement.
3. Visite du produit : il s’agit de la visite virtuelle
du Divi Builder. Si vous l’activez, elle se lancera
automatiquement à chaque activation du Divi
Builder en mode visuel.
4. Sauvegarder : toujours pareil, n’oubliez pas de
sauvegarder.
Réglages Divi (option du thème > Layout)

1. Section « info » des articles : Choix des éléments qui


apparaîtront dans la section « info » de chaque article.
C’est la zone, habituellement placée sous le titre de
l’article, où sont affichées les informations générales. Il
suffit de cliquer sur Auteur / Date / Catégories /
Commentaires pour les activer ou les désactiver.

2. Commentaires dans les articles : si on souhaite que les


lecteurs interagissent avec le partenaire.

3. Vignettes d’articles : les « vignettes dans les articles »


sont une mauvaise traduction de « thumb » c’est à dire
« thumbnail » soit « image à la une ». Si on désactive
cette option, l’image n’apparaitra pas en haut de
l’article mais l’ « image à la une » sera quand même
utilisée lors des partages des articles sur les réseaux
sociaux.

4. Sauvegarder :
Réglages Divi (option du thème > Layout)

1. Vignette dans les pages : tout comme les articles,


on peut décider ici de faire apparaitre, ou non, les
« images à la une » des pages, en haut du contenu. Si
on désactive cette option, les pages n’afficheront
pas les images à la une.

2. Commentaires dans les pages : c’est une option


générale qui permet de ne pas accepter les
commentaires sur les pages. Si on doit faire du cas
par cas, il vaut mieux passer par le menu de
WordPress : Pages > Toutes les pages > survoler les
pages avec la souris > cliquer sur Modification Rapide
> choisir d’activer ou non les commentaires.

3. Sauvegardez.
Réglages Divi (option du thème > Layout)

1. Section info de l’article : je n’ai toujours pas compris


la différence entre l’option « section info de
l’article » disponible dans l’onglet « paramètres
généraux » et l’option « choisir les éléments à afficher
dans la section infos de vos articles » disponible dans
l’onglet « modèle d’article » que nous avons vu
précédemment…

2. Vignettes dans les index : on peut activer ou non


l’affichage des vignettes, c’est à dire des « images à
la une » (ou Thumbnails) des articles sur les pages
d’archives.

3. Sauvegarder : toujours pareil, sauvegarder.


Réglages Divi (option du thème > Layout)

1. Activer les bannières : avec cette option, on peut


tout simplement activer ou désactiver les bannières
publicitaires le site. Celles-ci apparaitront alors à la fin
des articles, juste au dessus de la section des
commentaires.

2. Sélectionner la bannière : il faudra insérer l’URL


d’une image au format 468*60 pixels.

3. URL de destination de la bannière : étant donné


qu’il s’agit d’une bannière publicitaire, on peut choisir
l’URL de destination lorsque l’utilisateur cliquera
dessus. Par convention, on insèrere une URL
d’affiliation.

4. Google Adsense : si on n’utilise pas l’affiliation, on


peut insérer le code d’une publicités générées
depuis un compte Adsense.
5. Sauvegarder : enregistrez les modifications.