Retour aux articles
21 novembre 2024 Par Jehan

WP Base, mon starter kit personnalisé pour un WordPress de meilleur qualité

Au fil des années, et à force de nombreux projets de sites WordPress sur-mesure réalisés, je me suis constitué un petit catalogue d’outils et de bonnes pratiques à mettre en place sur chaque site, et pour avoir a éviter de partir de zéro à chaque fois.

Cet outil, je l’appelle WP-Base, nom trouvé après une intense réflexion d’au moins 5 secondes et une inspiration à en faire pâlir tous les créateurs de marques.
Blague à part, le nom importe peu, l’important, c’est ce qu’il y a sous le capot.

WP-Base est disponible sur GitHub : https://github.com/jehandev/wp-base

Wp Base

Pourquoi créer un tel starter kit ?

Premièrement, pour palier au principal défaut de WordPress : sa structure technique, qui commence à montrer son âge, et qui n’est pas vraiment en accord avec tous les standards.

Secundo, et c’est lié au premier point, mais la structure technique de WordPress n’invite absolument pas à produire un code respectueux des standards, facile à maintenir, orienté objet, un peu plus optimisé, et agréable à coder (un peu marre des <?php ?> de partout dans les templates, on ne va pas se mentir).

L’idée était donc de regrouper plusieurs outils en un seul endroit, pour améliorer la qualité du code que je produis, de me faciliter un peu la vie, et de limiter le nombre de plugins au maximum.

De quoi est-il composé ?

Le socle de ce projet repose sur deux outils :

  • Bedrock : un modèle standard qui « converti » WordPress en une application PHP moderne, permettant la gestion de dépendances via Composer, l’utilisation d’un vrai fichier d’environnement, une structure de fichiers bien plus logique et fluide, pour les principaux points.
  • Timber : il permet l’utilisation d’un vrai moteur de template connu et approuvé, Twig.

Viennent ensuite mes ajouts, groupés dans un thème parent et un thème enfant :

  • L’utilisation de PostTypes, une classe PHP permettant de créer des Custom Posts Types en toute simplicité en seulement quelques lignes de code
  • Des optimisations diverses (détaillées plus bas)
  • Des ajouts pour renforcer un peu la sécurité des installations (détaillés plus bas)
  • Un module bundler tout droit issu de l’environnement Laravel : Mix (qui sera remplacé par Vite dès que possible)
  • Les quelques plugins qui me semblent obligatoires (détaillés plus bas)

Je ne vais pas rentrer dans les détails techniques concernant Bedrock, Timber, ou certains points techniques, les documentations respectives des premiers étant très bien écrites et fournissent suffisamment d’exemples pour rapidement comprendre leur utilité, et les points techniques (installation, commandes mix, structure des fichiers, etc…) sont évoqués sur le dépôt GitHub du projet.

Les optimisations apportées

  • Suppression des WordPress Emojicons : sérieusement, qui les utilise ?
  • Désactivation de la création de paragraphes automatiques : uniquement pour l’éditeur classique, mais je le laisse car il n’engendre rien et permet aux sites ayant besoin de cet éditeur de produire un code un peu plus clean
  • Ajout du slug de la page en tant que classe dans le <body> : c’est simple, mais cela permet d’avoir des styles particuliers pour chaque page, si le design en ressentait le besoin.
  • Ajoute automatique les meta-informations des images lors de l’upload : WordPress laisse la balise alt vide par défaut, ce qui peut poser des problèmes d’accessibilité. Après il en revient à l’utilisateur de nommer ses fichiers proprement, mais cela devrait déjà être le cas pour le SEO !
  • Désactivation totale des commentaires : cela doit faire 10 ans que je n’ai pas eu une demande concernant des commentaires sur un site. Autant désactiver une feature inutilisée.
  • Désactivation de la vérification email : je parle ici de l’écran qui s’affiche demandant de vérifier l’email de l’administrateur. En général c’est moi, donc je sais ce que je fais et n’ai pas besoin de cela.
  • Suppression de jQuery Migrate : cette librairie est dédiée à aider à l’utilisation d’ancienne fonctions de jQuery, mais vu que je travaille avec des versions à jour, cela n’a aucun intérêt, y compris pour le backend de WordPress.
  • Permet l’upload de SVG : il me semble que cette feature est ou sera fournie par défaut dans WordPress dans un futur proche.
  • Supprimer le chargement de Dashicons si l’utilisateur qui visite le site n’est pas un administrateur : c’est toujours quelques ko de gagnés sur les chargements.

L’amélioration de la sécurité

  • Supprime les Pingback : Un pingback est fondamentalement un commentaire automatisé qui est créé lorsqu’un autre blog est relié à un site. Je n’ai jamais vu cette feature utilisée et elle pourrait être utilisée dans le cas d’une attaque DDOS. Aucun intérêt de la garder.
  • Désactivation du XML-RPC : Liée aux pingback, supprimer cette feature inutilisée permet en plus de réduire légèrement l’utilisation du CPU, sans aucune contrepartie visible.
  • Obfuscation de la version de WordPress : pour des raisons évidentes, si un WordPress n’est pas mis à jour, il est à risque, mais il l’est encore plus si la version de WordPress est visible par les attaquants ou des robots malicieux. Il est bon de rester cacher.
  • Suppression de diverses informations présentes dans le header : principalement des liens rss superflus (le principal est gardé) ainsi que des informations de maillage interne automatique mais pouvant porter à confusion.

Support forcé de certains options utiles des thèmes

  • html5
  • post-thumbnails
  • custom-logo
  • responsive-embeds

Plugins intégrés par défaut

C’est le point où mon outil n’est pas neutre, j’utilise systématiquement ces plugins lors de mes installations, mais ils peuvent être supprimés sans aucun problème :

  • Contact Form 7 : formulaires de contact basiques, mais efficaces. Il est rare d’avoir besoin de plus.
  • Ewww Image Optimizer : compresse les images publiées sur WordPress dès leur mise en ligne, et sans utiliser un service tiers, tout est fait localement. Peut aussi les convertir en webp. Un must.
  • Query Monitor : je ne peux plus vivre sans cet outil de développement.
  • Regenerate Thumbnails : très pratique lors du développement pour re-créer les miniatures des images. Le créateur de ce plugin étant malheureusement décédé il y a quelques temps, je vais devoir le remplacer car il n’est plus vraiment mis à jour.
  • WordFence : elle fourni un pare-feu rudimentaire, ainsi que la possibilité d’activer l’authentification à deux facteurs, ce qui devrait être OBLIGATOIRE sur tous les sites WordPress pour des raisons évidentes de sécurité.
  • WP Mail SMTP : permet de configurer l’envoi des mails de WordPress via un SMTP plutôt que la fonction native de PHP, qui évite aux mails envoyés de tomber dans les spams.
  • WPS Hide Login : si changer l’url de connexion par défaut n’offre qu’une impression de sécurité relative, c’est toujours un bonus bon à prendre pour éviter d’avoir des petits malins qui tentent un une qttqaue par bruteforce.
  • Yoast SEO : le plugin de référence pour le SEO.

Le bonus apporté par l’utilisation d’un module builder (Laravel Mix)

Pour faire très simple, voici l’idée d’un module builder : il permet de gérer soi-même la séparation et la compilation des fichiers de styles et de scripts, et de les minifier, sans intervention externe.

Le résultat ? Pas besoin de plugin de cache !
Tout ce boulot est effectué en amont lors des déploiements, ce qui évite bon nombre de problèmes.

Pour l’instant j’utilise Laravel Mix, mais je passerais dès que possible sur Vite.

Conclusion

J’ai passé pas mal d’heures à compiler et mettre en place tout cela, et c’était vraiment intéressant de déstructurer WordPress pour le mettre un peu en état de marche comme un projet moderne.

Le résultat m’a aussi donné raison, puisqu’en supprimant toutes les choses non-nécessaires, mes sites ont temps de chargement bien plus rapide par rapport au même site sur une installation standard, et nous savons tous à quel point Google aime les sites rapides.

Si vous avez des questions ou que vous souhaitez travailler avec moi, n’hésitez pas à me contacter sur LinkedIn ou via mon formulaire de contact !

Un barbu qui fait un boulot de barbu

Je vous accompagne à tous les niveaux
pour vos projets web

Me contacter