Configurer votre WordPress

Aujourd’hui je vais essayer de vous donner les clés pour bien vous lancer dans la création de votre site.

Nous allons voir quelles sont les choses à faire, dans quel ordre les faire et comment les faire.

Ce sera un petit guide pour vous aiguiller, afin que vous ne vous sentiez pas démunis face à ce qui pourrait vous sembler être une « montagne ».

Nous allons passer en revue les différents points assez rapidement. Et vous aurez ensuite l’occasion de revenir plus précisément sur chacun des points lors de la mise en oeuvre de votre site, au fur et à mesure de votre avancement et selon vos besoins.

Créer le contenu

Votre site devra probablement présenter des contenus dits « froids » et d’autres dits « chauds ».

Les contenus froids sont des contenus permanents, qui n’ont pas forcément pour vocation d’être modifiés ou mis à jour régulièrement, comme par exemple la page des mentions légales ou la page contact.

Les contenus chauds sont liés à une évolution plus temporelle, comme les actualités, les formations ou les items de coaching que vous proposerez…

Les pages « statiques »

Certaines pages seront quasiment obligatoire sur votre site. On pourra citer par exemple :

• La page contact,
• la page des mentions légales,
• la page protection des données personnelles,
• probablement une page d’accueil,
• et peut-être d’autres pages, comme « qui sommes-nous ? », « Comment ça marche ? », « Nos tarifs », etc.

Les pages WordPress

Les pages WordPress peuvent posséder une hiérarchie. C’est à dire que certaines pages peuvent dépendre d’autres. On peut imaginer que sur un site vitrine, les pages « Qui sommes-nous » et « Équipe » peuvent dépendre d’une page « À propos ».

Vous pourrez paramétrer cela dans l’encart « Attribut de la page » :

Il est aussi possible d’attribuer un modèle de page aux pages. Grâce à cela, vous pourrez leur conférer un agencement particulier. Cela dépend du nombre de modèles de page proposé par votre thème.

Par exemple, le thème WordPress suivant possède les modèles de page d’accueil suivants :

Là encore, si le modèle par défaut vous convient, pas besoin d’en changer. Si vous avez quelques connaissances en HTML, CSS et PHP vous pourrez créer vos propres modèles de page.

En plus de la hiérarchie, vous pouvez choisir l’ordre de vos pages dans l’administration.

Vous pouvez ainsi mettre en place toute l’arborescence des pages de votre site, que vous avez conçue en amont de cette séance, ou que vous allez concevoir sinon.

Les articles

Typiquement, rédiger des articles permet de constituer un blog ou un fil d’actualité. Ils possèdent :

• une date de publication afin d’être affichés du plus récent au plus ancien (ou le contraire).
• un auteur, 
• une ou plusieurs catégories et éventuellement des mots clés. Ces deux moyens servent à organiser le contenu d’un site.
• un format : Certains thèmes proposent des articles au format vidéo, citation, lien, galerie, etc.
• un fil de commentaires pour inciter les lecteurs à la discussion.
• éventuellement des boutons de partage sur les réseaux sociaux (même si les pages peuvent en avoir, elles ont moins vocation à être partagées).

L’éditeur de contenu dans WordPress

Lors de la création d’une nouvelle page, nous arrivons directement sur l’interface de création.

En haut à gauche de votre interface, vous pouvez trouver les boutons suivants:

• Le bouton « + »: Permet d’ajouter un nouveau bloc
• Les flèches (droite ou gauche) permettent d’annuler ou de rétablir une actions
• Le (i) permet de donner plus d’informations concernant votre article tel le nombre de mots, de titre, de paragraphes et de blocs.

En haut à droite de votre interface, vous pouvez trouver les boutons suivants:

• Prévisualiser : permet d’avoir un aperçu de votre article et/ou page
• Publier : permet la mise en ligne de votre article ou page
• Le bouton représentant un engrenage permet de masquer votre barre latérale.
• Les trois petits points permettent d’avoir accès à diverses options supplémentaires tel qu’un aperçu du code HTML 

Dans la barre latérale, vous avez disposé de deux options, Document et bloc.

• Document : il s’agit des réglages liés à votre publication tel que la visibilité, l’image d’entête et les étiquettes
• Blog : Permet d’effectuer des réglages sur un bloc que vous aurez sélectionné. Chaque bloque de contenus (Texte, Paragraphes, titre, image) dispose de ses propres options.

Les blocs

Les blocs sont censés apporter une grande flexibilité.

Avec les blocs vous pouvez insérer, organiser et mettre en forme du contenu riche avec un minimum de connaissances techniques. Au lieu d’utiliser du code personnalisé, vous pouvez ajouter un bloc et vous concentrer sur votre contenu.

Gutenberg dispose de différents types de blocs de contenus. Afin d’ajouter des blocs, il vous suffit de cliquer sur le petit « + » se trouvant en haut à gauche de votre page. Par défaut, chaque nouveau bloc est ajouté en bas de page. Il existe 5 groupes de blocs qui sont les suivants:

• Communs : Ce sont les blocs de bases (Titres, paragraphes, images)
• Formatage : Il s’agit des formats dans lesquelles vous allez pouvoir rédiger vos différents contenus (Classique, HTML, Code source, texte préformaté).
• Mise en page : Ces blocs vont vous permettre de soigner la mise en page de votre article en utilisant des séparateurs, colonnes, boutons par exemple.
• Widget : Vous pouvez désormais intégrer dans votre article le widget de votre choix
• Embed : Ce sont des contenus d’autres plateforme tel que Youtube, Twitter.

Mais le mieux c’est d’essayer par vous même pour vous familiariser avec cet éditeur, qui sommes-toutes est assez intuitif.

Réglage de la page d’accueil

Vous pouvez décider quelle est la page qui doit être prise en compte comme étant la page d’accueil. Ceci se paramètre dans le menu Réglages → Lecture.

C’est ici que vous pourrez définir si votre page d’accueil doit afficher vos derniers articles – en d’autres termes, l’intégralité (ou une partie) de votre fil d’actualité (blog) –  ou bien si elle doit afficher une page statique.

Si vous choisissez cette deuxième option, vous devrez alors sélectionner la page qui doit être considérée comme page d’accueil et quelle est celle qui affichera vos articles (votre blog). Ces pages devront être créées en amont. Si vous n’avez pas encore créé de pages, vous pourrez revenir ici ultérieurement.

Réglage de la page du blog

De même que pour la page d’accueil, vous pourrez décider quelle est la page qui doit faire apparaître vos articles.

Gestion des menus

Comment configurer un menu dans WordPress ?

Il faut vous rendre dans Apparence → Menus.

Ensuite, vous arrivez sur la page de gestion des menus.

Pour créer le menu de votre site, il faut procéder en deux étapes :

• Donner un nom à votre menu (par exemple : Menu Principal)
• Cliquer sur Créer le menu

Ajouter des éléments dans un menu

Avant de passer à la pratique, je tiens à ouvrir une parenthèse pour vous donner quelques conseils sur ce qu’est un bon menu.

À mon sens, un menu doit posséder 3 caractéristiques :

• Un nombre limité d’éléments
• Des éléments avec des noms concis
• Peu, voire pas de sous-menus

Nous sommes d’accord qu’il peut y avoir des exceptions en fonction des sites (en particulier pour les sous-menus). Toutefois si votre site est un blog ou un petit site vitrine, n’y allez pas trop fort.

Pourquoi ?

Parce que plus vous donnerez de choix à vos visiteurs, plus ils devront réfléchir sur quel élément cliquer, plus cela prendra de temps et au final, ils risqueront d’aller voir ailleurs.

Rappelez-vous donc d’aller droit au but.

Passons désormais à la pratique en voyant comment structurer votre menu.

Ajouter des pages dans votre menu WordPress

Comme le montre l’image ci-dessous, vous trouverez vos pages dans la partie gauche de l’écran de création de votre menu :

Pour ajouter une page dans votre menu, cochez la page à insérer dans le menu puis cliquez sur Ajouter au menu.

Vous pouvez effectuer des tris et des recherches pour trouver la bonne page grâce aux onglets Les plus récentes, Afficher tout et Recherche.

Attention, vos pages doivent exister pour figurer dans votre menu. Si ce n’est pas le cas, allez dans Pages → Ajouter pour les créer.

Répéter l’opération pour ajouter toutes les pages dont vous avez besoin.

Toujours sur la gauche, on remarque qu’il est possible de cliquer sur Liens et Catégories.

Autre éléments du menu

Vous pouvez également ajouter :

• des liens personnalisés, par exemple, un lien vers un site partenaire ou comme on le voit souvent, un lien vers la page d’accueil de votre site
• des catégories, c’est très pratique notamment sur des blogs

Enregistrer votre menu

N’oubliez pas d’enregistrer votre menu pour que WordPress se souvienne de ce que vous avez fait.

Organiser les éléments d’un menu sous WordPress

À ce stade, votre menu n’est pas encore bien structuré. Il embarque plusieurs éléments mais ils ne sont pas forcément agencés comme vous le désirez.

Pour réorganiser votre menu, passez votre souris au dessus d’un élément pour voir apparaitre un curseur avec quatre flèches.

Cliquez et maintenez pour déplacer l’élément en question à l’endroit voulu.

Créer un sous-menu

Si vous avez pas mal d’éléments à ajouter (attention à la surcharge), vous pouvez créer des sous-menus en déplaçant un élément légèrement sur la droite sous un autre élément.

Modifier les éléments d’un menu

Vous l’avez probablement remarqué, chacun des éléments de votre menu possède une petite flèche sur la droite. En cliquant dessus, vous « déplierez » cet élément pour afficher des informations supplémentaires.

Selon le type d’élément que vous déplierez (Page, Lien ou Catégorie), différents champs apparaîtront.

• Titre de la navigation : Le libellé qui s’affichera sur votre site
• Attribut de titre : Le texte qui s’affichera lorsque vos visiteurs survoleront l’élément. Utilisez-le pour décrire ce que contient la page.
• Adresse web : Dans le cas d’un lien, cela correspond à l’adresse du lien

Un lien Supprimer est présent pour retirer un élément de votre menu.

Les options cachées des menus WordPress

Il faut savoir que par défaut, WordPress masque certaines possibilités des menus. Cela permet de gagner en clarté et surtout d’éviter aux débutants d’accomplir de mauvaises actions.

Pour afficher ces fameuses options, vous devez cliquer sur le bouton Options de l’écran en haut à droite du tableau de bord :

Voyons à quoi ces options correspondent :

• Cible du lien : Permet d’afficher une case pour ouvrir la page de destination dans un nouvel onglet. Utilisez cela uniquement si la page de destination est sur un autre site. Il est très désagréable d’avoir de nouveaux onglets qui s’ouvrent lorsque l’on navigue sur un site via un menu.
• Classes CSS : Si vous voulez personnaliser l’apparence d’un élément de votre menu avec du CSS, placez les classes dont vous avez besoin dans ce champ.
• Relation avec le propriétaire du site lié (XFN) : Si vous liez un site et que vous tenez à préciser la relation qui vous lie. Vous pouvez utiliser les propriétés XFN. En pratique, je ne me suis jamais servi de cela. Il y a de grandes chances pour que nous n’en ayez pas besoin.
• Description : Certains thèmes permettent d’afficher une description sous le titre du menu, ils sont toutefois assez rares.

Enregistrer votre menu

Encore une fois, n’oubliez pas d’enregistrer votre menu pour que WordPress se souvienne de ce que vous avez fait.

Les réglages du menu

Une fois que vous aurez ajouté tous les éléments nécessaires pour constituer votre menu, il faudra vous rendre la section consacrée aux Réglages du menu sous les éléments de votre menu.

Plusieurs cases à cocher vous sont proposées :

• Ajouter automatiquement des pages : Cocher cette case ajoutera automatiquement les pages que vous créerez à votre menu. Cela présente peu d’intérêt car votre menu ne sera pas personnalisé. Veillez donc à ne pas cocher cette case.
• Emplacements du thème : Les cases à cocher listées ici permettent de déterminer à quel endroit afficher le menu que vous venez de créer.
  Il est donc très important de cocher une de ces cases pour que votre menu s’affiche sur votre site.
  Les intitulés des emplacements de menus disponibles seront différents en fonction de votre thème. Vous devrez normalement y trouver une case pour le menu principal (main menu ou primary menu en anglais).

Une fois que les réglages seront configurés, cliquez sur Enregistrer le menu pour mettre votre nouveau menu en service.

Note : Un lien pour supprimer votre menu est présent en bas à gauche pour effacer un menu dont vous n’avez plus besoin.

Gérer les emplacements

Vous avez probablement remarqué que la page de gestion des menus comporte deux onglets. Pour le moment nous nous sommes intéressés qu’au premier : Modifier les menus.

Intéressons-nous à ce que propose le second onglet nommé Gérer les emplacement.

Comme son nom le suggère, cet onglet va vous donner la possibilité d’assigner les menus que vous aurez créés aux emplacements proposés par votre thème.

En fait, cet onglet vous permet de voir où s’affichent vos menus d’un seul coup d’oeil.

Pour attribuer ou modifier le menu pour un emplacement, utilisez le menu déroulant. Si vous avez besoin de créer un nouveau menu cliquez sur le lien Utiliser le nouveau menu.

Un clic sur Modifier vous emmènera sur la page d’édition du menu associé.

Note : La liste des menus présents dans cet onglet sera différente en fonction de votre thème.

Une fois que tous les menus seront à leur place, n’oubliez pas de cliquer sur Enregistrer les modifications.

Placer des menus à d’autres endroits

Au delà des emplacements proposés par votre thème WordPress, vous pouvez insérer des menus dans la barre latérale de votre site (si votre thème en propose une) et dans le pied de page via le widget Menu Personnalisé.

Pour cela, créez un nouveau menu et ne lui attribuez pas d’emplacement.

Ensuite, rendez-vous dans Apparence > Widgets et ajoutez un widget Menu Personnalisé à la zone de widgets de votre choix.

Aller plus loin

Vous pourrez si nécessaire créer de nouveaux emplacements pour vos menus, n’importe où dans vos pages. Nous verrons cela un peu plus loin, lorsque nous aborderons la question de la personnalisation des thèmes.

Les thèmes

Les thèmes WordPress, c’est l’habit qui fait le moine !

Un thème, c’est l’habillage de votre site, c’est lui qui déterminera le rendu visuel de votre WordPress.

Pour le projet qui nous concerne, vous aurez un choix limité aux thèmes de base proposés par WordPress. Vous devrez donc choisir parmi les thèmes suivants :

• Twenty Fifteen
• Twenty Sixteen
• Twenty Seventeen
• Twenty Nineteen
• Twenty Twenty

Mais généralement vous aurez la possibilité de choisir parmi la foule de thèmes proposés pour WordPress.

Où trouver des thèmes pour WordPress ?

On peut utiliser des thèmes gratuits ou payant, certains thèmes gratuits sont parfois des versions freemium (vous utilisez la version de base gratuitement mais vous devrez payer une licence pour débloquer des fonctionnalités supplémentaires).

1/ Sur le répertoire WordPress ou depuis votre administration WordPress, vous trouverez des thèmes gratuits et freemium. C’est également ici que vous trouverez les thèmes par défaut de WordPress à savoir les Twenty (ten, eleven, twelve…. correspondant aux années de sortie).

2/ Sur les plateformes spécialisées de type Themeforest, AppThemes et d’autres, vous trouverez des thèmes premium donc payants. Le prix peut varier de 39 à 99€ et plus pour les frameworks.

Attention, un thème premium ne garantit pas qu’il est plus sûr qu’un thème gratuit, généralement les thèmes premium offrent plus de fonctionnalités de personnalisation ou des thématiques “prêtes à l’emploi” selon l’activité recherchée.

Comment bien choisir votre thème ?

Certains points, qui doivent guider votre choix, sont primordiaux :

• Le visuel, qualité de design, de lisibilité.
• L’originalité, trouver la perle rare et l’adapter.
• La qualité du code, vérifiez le code et les temps de chargement, préférez un thème “accessibility ready” .
• Les commentaires, se faire une idée sur les retours positifs ou négatifs.
• La traduction, préférez un thème “translation ready”.
• Le support, vérifiez qu’il existe un vrai support ou une FAQ et un mode d’emploi.
• La compatibilité, pensez à la compatibilité avec les dernières versions WP.
• La sécurité, évitez les thèmes gratuits trouvés au hasard du web.

Installer un thème

Comment installer un thème gratuit du répertoire

Pour installer un thème gratuit du répertoire depuis votre Back-Office WordPress, rendez-vous dans Apparence >> Thèmes.  Puis cliquez sur le bouton “Ajouter“.

Choisissez parmi les thèmes proposés (vous pouvez filtrer: Mis en avant, Populaires, Derniers en date, Favoris, Filtre de fonctionnalités)

Une fois installé, il vous faut encore activer le thème.

Comment installer un thème premium / payant

Si vous avez opté pour un thème premium, vous devez avoir téléchargé sur votre ordinateur un fichier depuis la plateforme au format ZIP.

Nota: Si votre fichier ZIP provient de chez Themeforest, il y a de grandes chances pour qu’il contienne, en plus du thème, la documentation, les fichiers sources et le contenu exemple. Vous devrez envoyer vers votre WordPress uniquement la partie contenant le thème.

Ouvrez l’archive ZIP et vérifiez ce qu’elle contient. Dans l’exemple ci-dessous, nous voyons, les dossiers theme, template, sample, psd,… Cliquez sur theme.

Pour ajouter votre thème premium, procédez comme suit: Rendez-vous sur Apparence >> Thèmes, cliquez sur “Ajouter”

Puis ensuite cliquez sur “Mettre un thème en ligne”

Enfin, cliquez sur “Choisissez un fichier“, sélectionnez votre thème au format .ZIP, cliquez sur le bouton “Installer“, ensuite il ne vous restera plus qu’à l’activer.

Comment installer un thème gratuit ou payant via FTP

Si pour une une raison quelconque vous ne pouvez pas utiliser les méthodes ci-dessus, vous pouvez toujours envoyer et installer votre thème par FTP (File Transfer Protocol). Cette méthode d’installation par FTP est commune aux thèmes du répertoire et aux thèmes premium/payants.

Pour installer votre thème WordPress par FTP, procédez comme suit :

1. Depuis votre PC ou Mac, décompressez le fichier .ZIP du thème
2. Une fois ce dernier décompressé, connectez-vous à votre serveur via FTP avec les identifiants fournis par votre hébergeur
3. Dans le répertoire FTP de /wp-content/themes/, transférez le dossier du thème décompressé (comme montré dans l’animation GIF ci-dessous)
4. Enfin, attendez que le transfert soit terminé !

Une fois que le transfert FTP du thème est complet, rendez-vous dans votre administration WordPress sur Apparence >> Thèmes, et activez-le !

Désinstaller / Supprimer un thème WordPress

Installer un thème, c’est bien mais ne gardez pas inutilement des thèmes installés et non utilisés. Pour désinstaller un thème WordPress non utilisé, vous avez deux options :

1. Par FTP, comme vu plus haut, il vous suffit de supprimer tout le dossier du thème non utilisé depuis /wp-content/themes/
2. Via votre administration WordPress, rendez-vous sur Apparence >> Thèmes, en passant la souris sur l’image du thème à supprimer vous verrez apparaître un bouton “Détails du thème“, cliquez, une nouvelle fenêtre s’affiche, en bas à droite de cette dernière vous trouverez le bouton “Supprimer“.

N’oubliez surtout pas !

Le plus dur est fait ! Et l’on doit bien reconnaître que ce n’était pas si difficile 😉

Maintenant que votre thème WordPress est correctement installé et activé, n’oubliez surtout pas :

• de prévoir un thème enfant,
• de vérifier que tout fonctionne correctement,
• de configurer les options de votre thème,
• de lire le mode d’emploi, si il y en a un,
• de supprimer les thèmes que vous n’utilisez pas,
• de toujours, toujours mettre à jour votre thème !

Les thèmes « enfants »

N’oubliez surtout pas le thème enfant

Les thèmes WordPress sont par nature déjà personalisables, leur installation simple, les possibilités offertes sont nombreuses mais il y a toujours de petites choses que nous voulons changer. Une couleur ici, une taille de police là-bas, peut-être utiliser un autre appel à l’action, bref nous voulons modifier le CSS de notre thème WordPress et bien plus encore…

Le seul hic, c’est que la modification, même infime, d’un thème vous empêche de faire sa mise à jour vers une nouvelle version à l’avenir, parce que si vous mettez à jour, alors vous perdez toutes vos modifications :/

Les thèmes enfants résolvent ce problème en vous permettant d’utiliser toutes les fonctionnalités de votre thème tout en vous laissant mettre à jour ce dernier, sans peur de perdre vos modifications.

Un thème enfant, c’est quoi  ?

Un thème enfant est un thème basé sur votre thème parent. Il en reprend toutes les fonctionnalités sans jamais le modifier. Ainsi vous pouvez apporter des modifications à votre enfant et en cas de mise à jour du parent, vous ne les perdez pas!

Tout fichier placé dans le thème enfant et portant le même nom que dans le thème parent, surchargera, c’est à dire prendra le dessus et écrasera le fichier d’origine (sauf le functions.php).

A noter : de nombreux thèmes premium de nouvelle génération, embarquent dans leur zip un thème enfant prêt à l’emploi. Dans ce cas, il vous suffit juste de mettre en place ce dernier. Attention, il faut bien évidemment installer le thème parent (sans l’activer), puis installer le thème enfant et enfin activer ce dernier.

Comment mettre en place un thème enfant ?

Pour faire un thème enfant, nous avons besoin du thème d’origine que l’on qualifie de thème parent et de 2 fichiers que nous allons créer. Il faudra également créer un répertoire pour y placer les fichiers du thème enfant.

La première des choses à faire est donc de créer un dossier pour votre thème enfant dans le FTP. Il vous suffit d’aller créer le dossier du thème enfant dans /wp-content /themes /nomdevotrethemeenfant/.

Nous allons maintenant créer les deux fichiers dont nous avons besoin et que nous placerons dans le dossier de notre thème enfant :

1. un fichier functions.php
2. un fichier style.css

Pour l’exemple, je vais me baser sur un thème parent qui porte le nom de Twenty Nineteen, ayant pour nom de dossier « twentynineteen » dans le FTP.

Dans le fichier functions.php, nous allons intégrer le code qui va permettre de combiner ou d’écraser le fichier style.css du parent autrement qu’avec le fameux @import css (on déconseille l’@import car cela ajoute une requête inutile cf: https://codex.wordpress.org/)

Voici donc le code à mettre dans le fichier functions.php du thème enfant :

<?php
/**
** activation theme
**/
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
 wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
 
}

Une fois ceci fait,  nous avons déjà la partie qui va nous permet d’appeler notre fichier style.css. Il ne nous reste plus qu’a créer le fichier style.css du thème enfant. Voyons ce que doit obligatoirement contenir ce fichier :

/*
Theme Name: Theme enfant
Description: Theme enfant MMI
Author: Arnaud - MMI
Author URI: https://www.reaccess.fr
Template: twentynineteen 
Version: 1.0
*/

Description ligne par ligne du fichier style.css :

• Theme Name : Le nom que je veux donner a mon thème enfant
• Description : La description de mon thème enfant celle qui apparaîtra dans mon gestionnaire de thème WordPress
• Author : L’auteur du thème enfant, en l’occurrence c’est vous
• Author URI : L’url du site de l’auteur parce qu’un peu de pub ne fait pas de mal
• Template : Le nom du thème parent en l’occurrence le nom du répertoire tel qu’il est écrit sur le FTP
• Version : La version de votre thème enfant à titre indicatif

Petits détails à ne pas oublier sinon votre thème enfant ne fonctionnera pas :

• Ne jamais mettre d’espace avant les deux points. Theme Name: fonctionnera mais Theme Name : ne fonctionnera pas
• Pour l’attribut Template : Si votre thème dans l’admin se nomme par exemple “Twenty Nineteen” mais que le nom affiché dans le répertoire FTP est “twentynineteen” alors il faudra obligatoirement respecter la casse et écrire « twentynineteen » et non  » Twenty Nineteen »
• Pour le reste, vous pouvez ne rien mettre, cela fonctionnera quand même !

Afin d’égayer un peu votre gestionnaire de thèmes WordPress, vous pourrez aussi mettre un fichier screenshot.jpg (600 × 450 px conseillés) qui affichera la miniature de votre thème enfant dans le gestionnaire de thèmes.

Voilà, votre thème enfant est prêt !

Vous pouvez maintenant ajouter toutes vos modifications CSS dans le fichier style.css du thème enfant et vous ne les perdrez plus en cas de mise à jour du thème parent (n’oubliez pas de les commenter, ça aide parfois;).

Désormais, si vous voulez modifier votre single.php ou votre header.php, rien de plus simple! Copiez-les du parent vers le thème enfant et modifiez-les ! 

Vous pouvez également ajouter des fonctions dans le functions.php de votre enfant.

La structure hiérarchique des fichiers template

Pour savoir sur quel fichier intervenir afin de modifier tel ou tel élément de votre site, vous devez connaitre l’organisation des templates WordPress.

Les fichiers modèles (« templates ») sont des fichiers modulaires, réutilisables, utilisés pour générer les pages Web sur votre site WordPress. Certains fichiers modèles (tels que le modèle d’en-tête et de pied de page) sont utilisés sur toutes les pages de votre site, tandis que d’autres sont utilisés uniquement dans des conditions spécifiques.

WordPress utilise la chaîne de requête pour décider quel modèle ou ensemble de modèles doit être utilisé pour afficher la page. La chaîne de requête est l’information contenue dans le lien vers chaque partie de votre site Web. Il vient après le point d’interrogation initial et peut contenir un certain nombre de paramètres séparés par des esperluettes.

En d’autres termes, WordPress parcourt la hiérarchie des modèles jusqu’à ce qu’il trouve un fichier de modèle correspondant. Pour déterminer quel fichier template utiliser, WordPress:

Fait correspondre chaque chaîne de requête à un type de requête pour décider quelle page est demandée (par exemple, une page de recherche, une page de catégorie, etc.);

Sélectionne le modèle dans l’ordre déterminé par la hiérarchie du modèle;

Recherche les fichiers modèles avec des noms spécifiques dans le répertoire du thème en cours et utilise le premier fichier modèle correspondant spécifié par la hiérarchie.

À l’exception du fichier de modèle index.php base, vous pouvez choisir si vous souhaitez implémenter un fichier de modèle particulier ou non.

Si WordPress ne peut pas trouver un fichier modèle avec un nom correspondant, il passera au fichier suivant dans la hiérarchie. Si WordPress ne trouve aucun fichier de modèle correspondant, le fichier index.php du thème sera utilisé.

Les extensions

Les plugins (ou extensions en français) font partie de ce que préfèrent les utilisateurs WordPress.

Ces petits bouts de codes, capables d’ajouter des fonctionnalités à notre CMS favori, sont une des raisons du succès de WordPress.

Il y a des plugins pour tout ou quasiment pour tout ! Du plugin SEO, en passant par le plugin de formulaire, de cache, d’antispam…. Vous trouverez nécessairement votre bonheur !

Installer une extension

Où trouver des Plugins à installer ?

On trouve les plugins sur le répertoire officiel de WordPress (et donc depuis notre administration WordPress) et sur certaines plateformes spécialisées telles que CodeCanyon.

Pour information, sur le répertoire WordPress en juin 2017, il y avait pas moins de 50 719 extensions disponibles gratuitement. Difficile donc de faire son choix. En effet, plusieurs extensions sont similaires dans le titre et parfois dans les fonctions.

Faites donc bien attention aux nombres d’installations, aux dates de mise à jour et aux avis des utilisateurs.

Sur CodeCanyon, tous les plugins sont payants. Attention, cela ne signifie nullement qu’ils sont meilleurs, mieux codés ou plus sécurisés, juste que l’auteur souhaite en tirer profit et de facto, il ne l’a pas mis à disposition gratuitement sur le répertoire WordPress.

Pour accéder directement aux plugins WordPress de Codecanyon, allez sur https://codecanyon.net/category/wordpress/, vous pouvez également filtrer vos recherches.

Nota : évitez de télécharger un plugin WordPress trouvé sur le web ou une copie d’un plugin premium cracké, c’est souvent un nid à malwares et vous risquez de vous en mordre les doigts très rapidement.

Comment installer un Plugin depuis le répertoire WordPress

Le moyen le plus simple d’installer un plugin, c’est de le faire depuis son administration WordPress. 

Commencez par vous rendre dans votre admin WordPress, puis dans le menu “Extensions >> Ajouter”.

Vous verrez tout d’abord, les extensions “Mise en avant” par WordPress mais vous pouvez aussi filtrer par “Populaires“, “Recommandés” ou “Favorites“.

Si vous cherchez une extension particulière, saisissez dans la case “Mot-clé” le plugin recherché.

Vous pouvez également vous servir des “étiquettes populaires” si vous ne savez pas vers quel plugin vous orienter.

Il vous suffit ensuite de cliquer sur “Installer” puis à nouveau de cliquer sur le bouton “Activer” qui va apparaître tout de suite après l’installation.

Le plugin est désormais installé et activé, il ne vous reste plus qu’à vous occuper de ses réglages spécifiques.

Comment installer un Plugin premium / payant

Si vous avez opté pour un plugin premium/payant sur Codecanyon ou ailleurs, généralement votre téléchargement contient un fichier ZIP.  

Pour l’installer, rendez-vous dans votre back-office WordPress, Extensions >> Ajouter, mais cette fois-ci, cliquez sur “Mettre une extension en ligne”.

Vous allez maintenant devoir envoyer le fichier .ZIP à votre WordPress qui va le télécharger puis le décompresser.

Choisissez le fichier .ZIP du plugin à installer depuis votre PC ou Mac, indiquez-le à WordPress, cliquez sur “Installer” puis activez-le !

Voilà, c’est tout simple !

Faites vos réglages et configurez le plugin comme indiqué dans le mode d’emploi de ce dernier (s’il est fourni).

Installer un Plugin (gratuit ou payant) par FTP

Cette méthode d’installation par FTP est commune aux plugins du répertoire et aux plugins premium/payants.

Vous devez pour cela posséder un logiciel de FTP (File Transfer Protocol) et être en possession de vos identifiants FTP (généralement fournis par votre hébergeur). FileZilla est un logiciel de FTP gratuit et populaire qui fonctionne aussi bien sous Mac que sous PC.

Pour installer votre plugin WordPress par FTP, procédez comme suit :

1. Depuis votre PC ou Mac, décompressez le fichier .ZIP du plugin
2. Une fois ce dernier décompressé, connectez-vous à votre serveur via FTP avec les identifiants fournis par votre hébergeur
3. Dans le répertoire FTP de /wp-content/plugins/, transférez le dossier du plugin décompressé (comme montré dans l’animation GIF ci-dessous)
4. Enfin, attendez que le transfert soit terminé !

Une fois que le transfert FTP du plugin est complet, rendez-vous dans votre administration WordPress sur Extensions >> Extensions installées, et activez le plugin !

Les extensions indispensables

Fonctionnalités

Formulaire de contact

Personnalisation

RGPD

Performances

Sécurité

SEO

Les extensions incontournables selon vos besoins

E-commerce

Multi-linguisme

Gestion des rôles

Aller plus loin

Sauvegarder WordPress

La sauvegarde d’un site WordPress est primordiale, en effet, une erreur, une faille de sécurité ou pire encore, un piratage et tout est perdu…

Il existe plusieurs façons de sauvegarder WordPress, manuellement via FTP + MySQL, ou à l’aide de nombreux plugins de sauvegarde.

Pour le moment, vous pouvez ne retenir que l’extension courante et efficace : « Updraft Plus » .

La sécurité sur WordPress

La sécurité de WordPress est un sujet crucial et essentiel pour tout administrateur système soucieux de préserver son site.

Quand on réalise le temps de travail, d’écrits, et de réflexions que représente la création d’un site, il est dangereux d’être approximatif en ce qui concerne sa protection.

Mesures de sécurité essentielles à WordPress

1- Le compte Admin : En premier lieu, quelque soit la méthode d’installation choisie, créez toujours un nouveau compte ADMIN avec un login + mot de passe ultra sécurisé. Si possible évitez de choisir un login avec votre prénom ou la racine de votre domaine.

2- Mot de passe : Il faut toujours utiliser des mots de passe complexes associant lettres, symboles et chiffres. Il vous faut employer de préférence un générateur de chaîne aléatoire de plus de 8 caractères. Vous aurez ainsi un login bien plus sûr.

3- Pensez à restreindre le nombre d’essais d’identification : Plusieurs plugins permettent de vous protéger des attaques par “force brute”, c’est-à-dire les tentatives pour deviner votre mot de passe par une recherche de toutes les combinaisons possibles.

4- Pensez à masquer la version de votre WordPress, car elle donne des informations aux hackers pour trouver d’éventuelles failles de sécurité. Dans le fichier function.php de votre thème, ajoutez ce bout de code :

remove_action("wp_head", "wp_generator");

Le numéro de version WP se trouve également dans le fichier readme.html situé à la racine de votre WordPress (fichier à supprimer également)

5- Faites des sauvegardes : Les backups du système sont à effectuer au moins toutes les semaines pour prévenir un piratage ou un crash disque.  Il vaut mieux prévenir que guérir !

6- Faites des mises à jour régulières du site car cela permet d’avoir les tous derniers correctifs des failles de sécurité. Encore une fois avant toute mise à jour, pensez à sauvegarder votre WP.

7- Protégez vos fichiers et bloquez la navigation dans vos dossiers WordPress. Par défaut, n’importe qui peut accéder au contenu de vos dossiers WordPress (wp-content) via un simple navigateur.

Pour protéger le fichier wp-config via votre .htaccess, ajoutez :

<Files wp-config.php>
 order allow,deny
 deny from all
</Files>

Pour cacher les répertoires sensibles toujours via le .htaccess :

Options All -Indexes

Enfin pour protéger le fichier .htaccess lui-même :

<Files .htaccess>
 order allow,deny 
 deny from all 
</Files>

En bonus, retrouvez ci après 3 solutions pour renforcer la sécurité de WordPress:

• Passer votre WordPress en HTTPS, c’est la meilleure façon de protéger les données de vos utilisateurs et de vous défendre contre l’usurpation d’identité. Les sites sécurisés via SSL bénéficient en outre, d’un avantage pour leur référencement dans les pages de résultats de recherche.
• Enfin, l’antivirus que je préfère : WordFence. C’est un plugin freemium, c’est à dire que les options de base sont gratuites et certaines réservées aux utilisateurs premium. Très efficace et performant.

Créer un emplacement de menu

Pourquoi ajouter une nouvelle zone de menu ?

Il est certain que vous pourriez tout à fait modifier l’apparence d’un fichier de votre thème avec du code écrit en dur et des liens que vous insèreriez dans une zone propice comme dans le footer, si on reprend cet exemple. Cette méthode peut faire l’affaire mais signifie également que ce code ne pourra pas être accessible depuis l’administration de votre site, si vous avez des changements à effectuer, vous devrez alors éditer le fichier en question.

L’option d’ajouter une nouvelle zone de menu dans votre thème vous permettra de modifier les éléments qui composent la navigation par un simple glissé-déposé directement depuis l’onglet adéquat (Apparence > Menu). Cette méthode sera alors plus saine et surtout pourra être accessible par d’autres administrateurs de votre site.

Comment ajouter une nouvelle zone de menu ?

Pour cela vous aurez besoin :

• de créer un thème enfant, si ce n’est pas déjà le cas,
• d’avoir un accès aux fichiers du thème parent,
• d’un éditeur de texte,
• d’un FTP.

Enregistrez votre nouvelle navigation dans le fichier functions.php

Pour commencer, vous devrez éditer le fichier functions.php contenu dans le dossier de votre thème enfant. Vous le trouverez dans les dossiers de votre site à www > wp-content > themes > votre-theme-enfant > functions.php

Ouvrez ce fichier et ajoutez le code ci-dessous :

//ajouter une nouvelle zone de menu à mon thème
function register_my_menu() {
  register_nav_menu('footer-menu',__( 'Menu Footer' ));
}
add_action( 'init', 'register_my_menu' );

Ce morceau de code va permettre à votre thème d’enregistrer et de faire apparaitre un nouvel emplacement de menu dans le back-office, c’est à dire à l’onglet Apparence > Menu. Pour cet exemple, ce nouveau menu s’appellera Menu Footer.

Toutefois, ce code n’est valable que si vous souhaitez ajouter une seule nouvelle navigation, si vous ajoutez plusieurs menus à la suite avec une succession de ce même code, vous aurez obtiendrez une erreur.

Donc, si vous souhaitez ajouter plusieurs nouvelles navigations, vous devrez passer par la création d’un “tableau” (array) avec le code suivant :

// s'il y a plusieurs menus à rajouter, voici le code :
function register_my_menus() {
 register_nav_menus(
 array(
 'private-menu' => __( 'Menu Privé' ),
 'footer-menu' => __( 'Menu Footer' ),
 )
 );
}
add_action( 'init', 'register_my_menus' );

Avec ce nouveau code, votre thème enregistrera deux nouvelles zones de menus : l’une nommée Menu Privé et l’autre nommée Menu Footer. Avec cette méthode, vous pouvez créer autant de menus que vous le souhaitez et vous pourrez les nommer comme bon vous semble.

À présent, vous pouvez sauvegarder votre fichier functions.php et le renvoyer par FTP dans le dossier de votre thème enfant.

Faites apparaitre votre nouvelle navigation.

Pour l’instant, votre thème a bien pris en compte votre nouvelle navigation, vous aurez aussi pris soin de bien créé votre nouveau menu, mais il va falloir que ce dernier apparaisse.

L’idée est que ce menu pourrait s’afficher n’importe où, c’est vous qui décidez : au dessus du header, sur une page spécifique, dans vos articles, dans le footer, dans la sidebar etc. Il faudra simplement modifier le fichier désiré.

Pour mon exemple, j’ai décidé de faire apparaitre ma nouvelle navigation dans le footer de mon site. J’ai donc dupliqué le fichier footer.php du thème parent pour l’ajouter dans le dossier de mon thème enfant.

Pour faire apparaitre la nouvelle navigation, vous devrez ajouter ce code à l’endroit désiré dans le fichier à modifier :

<?php 
 wp_nav_menu ( array (
 'theme_location' => 'footer-menu' ,
 'menu_class' => 'my-footer-menu', 
 ) ); ?>

Ce simple bout de code fonctionne mais vous pourriez très bien aller plus loin en ajoutant une condition telle que “si le Menu Footer existe, alors, affiche-le”. Le code utilisé serait alors :

<?php if ( has_nav_menu( 'footer-menu' ) ) : ?>
 <?php 
 wp_nav_menu ( array (
 'theme_location' => 'footer-menu' ,
 'menu_class' => 'my-footer-menu', // classe CSS pour customiser mon menu
 ) ); ?>
 <?php endif; ?>

Les widgets

Les widgets WordPress sont incroyablement utiles. Ils vous permettent d’ajouter toutes sortes de contenus supplémentaires à votre site web à l’extérieur du corps de l’article ou de la page, encourageant les utilisateurs à obtenir des informations, à suivre des liens ou à agir.

Que sont les widgets WordPress ?

Dans WordPress, les widgets sont des contenus qui vivent en dehors du contenu de la page ou de l’article.

Les widgets contiennent des informations, une navigation ou des médias qui sont distincts d’un article ou d’une page. Dans la plupart des cas, chaque widget sera affiché sur chaque page du site, mais vous pouvez également enregistrer des zones de widgets pour des pages spécifiques telles que la page d’accueil.

Pour ajouter un widget à votre site, vous devez l’ajouter à une zone de widgets. Les zones de widgets sont créées par votre thème car elles se rapportent à la conception et à la mise en page de votre site et non à sa fonctionnalité.

La plupart des thèmes WordPress ont des zones de widgets dans la barre latérale et le pied de page, bien que certains aient de multiples zones de widgets à de nombreux endroits, comme en dessous ou au-dessus du contenu ou dans l’en-tête.

WordPress est livré avec un ensemble de widgets préchargés afin que vous puissiez les utiliser sans avoir à installer des extensions ou écrire du code. Mais vous pouvez aussi ajouter beaucoup d’autres widgets en installant des extensions ou en codant les vôtres.

Ceux-ci peuvent couvrir un large éventail de types de contenu, tels que les médias, les flux de réseaux sociaux, la navigation, la recherche, des cartes et bien d’autres encore. Il y a très peu de choses que vous pourriez vouloir sur votre site pour lesquelles vous ne pouvez pas trouver de widget. En fait, le plus grand défi consiste souvent à choisir entre toutes les options et à ne pas aller trop loin.

Quand utiliser les widgets WordPress

Vous devez utiliser un widget chaque fois que vous voulez ajouter du contenu supplémentaire à une ou plusieurs pages de votre site (et quand je dis page, j’inclus les articles, les archives, etc.), mais qui ne fait pas partie du contenu de cette page. Ils sont particulièrement utiles pour le contenu que vous souhaitez afficher sur chaque page du site, comme la liste de vos derniers articles, un panier d’achat, ou un bouton d’appel à l’action.

Pensez au nombre d’utilisateurs qui devront avoir accès à chaque widget et à l’importance de l’endroit où vous le placerez. Les widgets de la barre latérale seront plus visibles que ceux du pied de page, que certains utilisateurs ne verront peut-être même pas.

Il serait donc préférable d’afficher les derniers articles ou les appels à l’action dans la barre latérale, où les gens ont plus de chances d’interagir avec eux, tandis qu’un flux de réseaux sociaux pourrait figurer dans le pied de page.

Si votre thème comporte également des zones de widgets spéciales pour la page d’accueil, vous pouvez les utiliser pour la navigation dans les services de votre site, les listes de contenus pertinents ou les médias tels qu’une vidéo accueillant les gens sur le site.

Exemples de widgets dans WordPress

La meilleure façon de comprendre les possibilités offertes par les widgets WordPress est d’en examiner quelques exemples. Jetons un coup d’œil sur onze types de widgets que vous verrez fréquemment sur les sites WordPress.

• Widget des articles récents
• Widget des commentaires récents
• Widget d’appel à action
• Widgets de navigation
• Media Widgets
• Widgets de réseaux sociaux
• Widget de formulaire
• Widget de carte
• Widget de connexion
• Widget de recherche

Comment ajouter des widgets à votre site WordPress

Une fois que vous avez décidé du type de widgets dont vous avez besoin pour votre site WordPress, il est temps de les installer.

Ne soyez pas tenté d’en ajouter trop. Plus ils sont nombreux, moins les utilisateurs sont susceptibles de les remarquer. Concentrez-vous plutôt sur deux ou trois widgets clés pour la barre latérale. Vous pouvez en ajouter au bas de page, où ils sont de toute façon moins importants.

Et si vous avez des zones de widgets supplémentaires dans votre thème, décidez quels sont les widgets à y mettre. Veillez à ce qu’ils s’adaptent à la mise en page et au design de votre site.

Il y a trois façons d’ajouter des widgets :

• Utiliser les widgets qui sont déjà fournis avec WordPress.
• Ajouter un widget tiers à partir du répertoire des extensions.
• Acheter une extension premium qui inclut un widget.

Trouver des widgets pour votre site WordPress

Il existe une vaste gamme de widgets disponibles, il peut donc être difficile de choisir lequel installer. Examinons les différentes options et voyons ensuite comment vous pourriez choisir celle qui vous convient le mieux.

Widgets fournis avec WordPress

Si l’un des widgets préinstallés fait ce que vous voulez, utilisez-le. Cela vous fera gagner du temps et vous permettra de réduire le code utilisé sur votre site.

Ajouter des widgets avec une extension

Le répertoire des extensions de WordPress contient des milliers d’extensions de widgets gratuites qui vous permettront de choisir parmi un plus grand nombre de widgets.

En outre, de nombreuses autres extensions comprennent également des widgets, telle qu’une extension de commerce électronique qui vous donne un widget de panier et plus encore.

Si le répertoire des extensions ne contient pas l’extension dont vous avez besoin, vous pouvez décider d’ajouter une extension premium. Parfois, celles-ci offrent plus de fonctions ou une interface plus intuitive. Mais il arrive que vous trouviez les mêmes fonctionnalités dans une extension gratuite, alors faites une bonne recherche dans le répertoire des extensions avant de payer pour des extensions.

Quel que soit le widget que vous choisissez, vous devrez le tester pour vérifier qu’il fonctionne comme vous le souhaitez. Si vous achetez des extensions premium, je vous recommande d’en acheter une avec une garantie de remboursement ou une période d’essai gratuite au cas où elle ne vous conviendrait pas.

Les widgets ne sont pas seulement pour la barre latérale

La plupart des thèmes ont des zones de widgets dans la barre latérale et le pied de page. Mais certains en ont aussi à d’autres endroits, comme en dessous ou au-dessus du contenu ou dans l’en-tête.

Ajouter un widget à une page spécifique

Certains thèmes comprennent des zones de widgets qui ne sont destinées qu’à des pages spécifiques, comme la page d’accueil. Mais que faire si vous souhaitez ajouter un widget à une seule page de votre site ?

Vous pouvez le faire dans l’éditeur de page et d’article Gutenberg.

Ajoutez un nouveau bloc de la manière habituelle, puis sélectionnez le type de bloc Widgets.

Vous pouvez ensuite choisir parmi les nombreux widgets que vous avez activés pour votre site et l’ajouter au contenu de votre article ou de votre page. Ceci est très utile si vous souhaitez ajouter un widget de formulaire, un widget d’appel à l’action ou une liste de vos derniers articles.

Ajouter une nouvelle zone de widgets à votre thème

Création de la zone de widgets dans votre fichier de fonctions du thème

La première étape consiste à configurer la zone de widgets à l’aide de la fonction register_widget().

Commencez par ouvrir le fichier functions.php de votre thème, et ajoutez ce code.

function montheme_register_widgets() {
 register_sidebar( array(
  'name' => __( 'After Content Widget Area', 'montheme' ),
  'id' => 'after-content-widget-area',
  'description' => __( 'Widget area after the content', 'montheme' ),
  'before_widget' => '<div id="%1$s" class="widget-container %2$s">',
  'after_widget' => '</div>',
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
}
add_action( 'widgets_init', 'montheme_register_widgets' );

Enregistrez maintenant votre fichier functions.php. Si vous allez sur votre écran de widgets ou dans la personnalisation, vous trouverez la nouvelle zone de widgets disponible pour vous permettre d’ajouter des widgets.

Mais si vous faites cela, ils n’apparaîtront pas vraiment sur la page. En effet, vous devez ajouter du code à votre fichier de modèle de thème.

Ajouter un widget à un fichier modèle de thème

Une fois que vous avez identifié le fichier modèle que vous devez modifier et l’endroit exact où vous devez avoir le code pour la zone de widgets, ajoutez le code suivant.

<?php if ( is_active_sidebar( 'after-content-widget-area' ) ) { ?>
 <aside class="after-content widget-area full-width" role="complementary">
  <?php dynamic_sidebar( 'after-content-widget-area' ); ?>
 </aside>
<?php } ?>

Les codes courts (ou shortcodes)

Les codes courts de WordPress sont une fonction puissante qui permet de faire des trucs sympas avec peu d’efforts. On peut faire à peu près n’importe quoi avec eux. Avec les codes courts, l’intégration d’éléments interactifs ou la création de mises en page complexes est aussi simple que l’insertion d’une seule ligne de code.

Les codes courts éliminent le besoin de scripts compliqués. Même si vous avez peu ou pas de compétences en programmation, vous pouvez ajouter du contenu dynamique sans effort avec leur aide.

En général, les codes courts utilisent des balises entre crochets [] pour définir leur utilisation. Chaque code court remplit une fonction particulière dans un site. Elle peut être aussi simple que la mise en forme du contenu ou aussi complexe que la définition de la structure du site web dans son ensemble.

Par exemple, vous pouvez utiliser des codes courts pour intégrer des diaporamas, des formulaires, ou les tableaux de tarifs. Vous pouvez même les utiliser pour créer des modèles de design de pages réutilisables.

Les codes courts par défaut de WordPress

WordPress est livré avec 6 codes courts par défaut :

• audio : Intégrez des fichiers audio sur votre site web. Il comprend des commandes de lecture simples comme Play & Pause.
• caption : Enveloppez votre contenu avec des légendes. Il est surtout utilisé pour ajouter des légendes d’images, mais vous pouvez l’utiliser pour n’importe quel élément HTML.
• embed : Développe la fonctionnalité oEmbed par défaut. Ce raccourci vous permet de définir différents attributs à vos incorporations, comme la définition de leurs dimensions maximales.
• gallery : Insérez une simple galerie d’images sur votre site. Vous pouvez utiliser des attributs pour définir quelles images sont utilisées et personnaliser l’apparence de la galerie.
• playlist : Affichez une collection de fichiers audio ou vidéo avec ce code court à fermeture automatique. Vous pouvez lui donner un mode « dark » avec son attribut de style.
• video : Intégrer un fichier vidéo et le lire à l’aide d’un simple lecteur vidéo. Ce code court permet d’intégrer des vidéos dans ces formats : mp4, webm, m4v, webm, ogv, wmv, flv.

Pour plus de détails sur la manière d’utiliser les codes courts par défaut et sur les attributs qu’ils prennent en charge, vous pouvez vous référer aux documents du Codex liés.

Utiliser les codes courts

Dans les pages et les articles

Tout d’abord, allez dans l’éditeur de page ou d’article où vous voulez insérer le code court.

Si vous utilisez l’éditeur Gutenberg, vous pouvez ajouter la balise de code court dans le bloc autonome Codes courts. On peut la trouver dans la section Widgets.

Dans les widgets de la barre latérale

Des codes courts peuvent également être insérés dans les widgets de la barre latérale. Pour les ajouter, allez dans Apparence » Widgets et ajoutez un widget Texte dans la section où vous voulez ajouter le code court.

Collez le code court dans le widget Texte et enregistrez-le. Vous pouvez visiter l’interface publique de votre site et voir le résultat du code court dans votre barre latérale.

Ailleurs dans votre thème

Les codes courts de WordPress sont en général destinés aux pages, aux articles et aux widgets. Mais vous avez un moyen facile d’insérer des codes courts n’importe où dans votre site.

Disons que vous voulez ajouter un bouton d’appel à l’action dans votre pied de page, ou dans tous vos articles avant la section des commentaires. La fonction de callback do_shortcode() s’avère utile ici.

Vous devez ajouter le code suivant à l’un de ses fichiers de modèle :

<?php echo do_shortcode("[name_of_your_shortcode]"); ?>

Le code court sera alors affiché à l’endroit où vous l’avez inséré.

Codes courts de WordPress : Avantages et inconvénients

Les avantages

• Les codes courts simplifient l’ajout de fonctionnalités complexes dans les sites WordPress. Vous pouvez ajouter presque tout en saisissant une seule ligne de code.
• Les codes courts automatisent le flux de développement. Ils éliminent la nécessité d’écrire des scripts complexes chaque fois que l’on veut insérer un certain élément.
• Les codes courts sont plus conviviaux que l’ajout de code HTML ou de scripts PHP.
• Les codes courts peuvent être regroupés dans des extensions. Même si vous mettez à jour WordPress ou si vous modifiez/mettez à jour votre thème, les codes courts resteront valables et continueront à fonctionner comme avant.
• Le regroupement des codes courts à l’intérieur des extensions les rend faciles à utiliser sur plusieurs sites WordPress. Si vous êtes un développeur qui gère de nombreux sites, le fait d’avoir tous vos codes courts personnalisés prêts à l’emploi est un atout majeur.
• Comme les codes courts acceptent également des attributs, les utilisateurs peuvent modifier le comportement du même code court en modifiant simplement les options de ses attributs.

Les inconvénients

• L’utilisation des codes courts n’est pas intuitive pour l’utilisateur final, surtout si un grand nombre d’entre eux sont utilisés sur une page. Dans ce cas, ils sont plus adaptés aux développeurs.
• Il est difficile de dire ce qu’un code court fait simplement en le regardant. L’équipe centrale de WordPress les a judicieusement nommés « mystery meat embed codes» pour cette raison précise.
• Les codes courts qui sont intégrés avec des thèmes cesseront de fonctionner si vous changez de thème.
• Les codes courts sont ambigus quant à leur syntaxe. Par exemple, certains d’entre eux sont favorables à la fermeture facultative, de sorte que vous pouvez les utiliser soit comme fermeture automatique, soit comme fermeture, voire les deux s’ils sont emboîtés. Vous pouvez deviner comment cela peut devenir très rapidement super confus.
• Les codes courts peuvent casser le HTML en raison de balises conflictuelles ou de problèmes d’interopérabilité. Il n’est jamais bon de les voir sur l’interface publique d’un site.
• Les codes courts ajoutent une charge supplémentaire sur votre serveur. Plus le nombre de codes courts sur votre page ou vos articles augmente, plus cette charge augmente. Trop de codes courts peuvent amener votre site web à ramer (par exemple, l’affichage de la plupart des constructeurs de pages).

À vous de jouer !