TechDevBlog : le thème qui se fait oublier

Je suis de retour ! Après six ans d’arrêt et un abandon du nom de domaine, l’ancien site emmanuel-vergne.fr revient et deviens YAML & Café ! Je reprends du service en 2026. Et pour célébrer ce retour, il fallait une nouvelle maison.

Pourquoi un thème maison ?

Quand j’ai lancé YAML & Café, j’ai fait comme tout le monde : j’ai parcouru le catalogue de thèmes WordPress. J’en ai trouvé de très beaux. Mais presque tous avaient le même défaut : pour obtenir le rendu de la capture d’écran ou avoir la mise en page que je souhaitais, il fallait installer trois extensions, importer un fichier de démo et passer une soirée dans des panneaux de réglages.

Or ce blog parle de Home Assistant (dans mes prochains articles), de MagicMirror et de Raspberry Pi. Je passe déjà assez de temps à bidouiller mon YAML. Le blog, lui, devait juste fonctionner.

J’avais donc trois exigences simples :

• un rendu agréable à lire, pensé pour des articles techniques parfois longs ;
• un thème qui s’installe et s’oublie, sans dépendances obligatoires ;
• un code lisible et partageable, que d’autres puissent reprendre.

Pourquoi le faire soi-même ?

Il y avait aussi une motivation plus personnelle : le challenge. Après des années loin du code, j’avais envie de m’y remettre, et un thème WordPress était le terrain de jeu idéal.

J’aurais pu tout confier à Claude, l’assistant IA d’Anthropic, et récupérer un thème clé en main. Mais je risquais de passer à côté de fonctionnalités pourtant simples, faute de savoir qu’elles existaient. Le faire moi-même, avec Claude comme copilote, c’était la garantie de comprendre chaque brique.

Le design : une identité avant un thème

Avant d’écrire la moindre ligne de PHP, j’ai commencé par l’identité visuelle de YAML & Café : le nom, le logo, les couleurs, le ton. Le thème est venu ensuite, pour servir cette identité et pas l’inverse.

Le principe directeur : le contenu d’abord. Peu d’effets, beaucoup d’espace, une typographie lisible et des blocs de code qui respirent. Sur un blog technique, le lecteur vient chercher une réponse, souvent un bout de configuration à copier. Tout ce qui le ralentit est de trop.

Pourquoi le format magazine ?

Un blog technique se lit de deux façons : on le parcourt pour voir ce qui est nouveau, puis on lit un article en profondeur. Le format magazine répond aux deux.

Sur la page d’accueil, le dernier article est mis en avant en grand format, comme une une de journal. Suivent les articles précédents sous forme de cartes, six par page, avec une pagination classique. En un coup d’œil, on sait ce qui vient de sortir et ce qui l’a précédé.

Une fois dans un article, tout est fait pour la lecture longue :

• un sommaire automatique, repliable, généré à partir des titres H2 et H3 ;
• un temps de lecture estimé, pour savoir si c’est un article du café du matin ou du week-end ;
• un fil d’Ariane par catégorie et les étiquettes, pour se repérer ;
• la navigation article précédent / suivant et des commentaires en fil de discussion.

Le sommaire automatique est sans doute ma fonctionnalité préférée. Un tutoriel Home Assistant de vingt sections devient navigable sans que j’aie à écrire le moindre lien d’ancre.

La philosophie : le moins de manipulations possible

C’est le fil rouge de tout le projet. Chaque fois qu’une fonctionnalité demandait une manipulation à l’utilisateur, je me suis posé la même question : est-ce que le thème peut le faire tout seul ?

Concrètement, voici ce que cela donne :

• Aucune extension obligatoire. Le thème fonctionne seul, dès l’activation.
• Des fonctionnalités optionnelles qui se dégradent proprement. Si l’extension Categories Images est installée, chaque page de catégorie affiche son image en bannière. Sinon, la bannière devient simplement une carte sobre. Rien ne casse.
• Une barre latérale gérée par les vrais widgets WordPress. Pas de blocs codés en dur dans les gabarits : un widget « Catégories TechDevBlog » avec compteurs dynamiques, et des blocs HTML personnalisés pour « À propos » ou « Ne rien manquer ». Tout se règle depuis Apparence > Widgets.
• Les textes modifiables sans toucher au code. Le slogan du pied de page et l’invitation au partage se changent dans le Personnaliseur, avec des valeurs par défaut déjà en place.
• Le partage déjà prêt. X, LinkedIn, WhatsApp, Mastodon, e-mail et copie du lien sont intégrés, sans extension de partage.

Résultat : l’installation tient en cinq étapes, dont deux optionnelles.

1. Copier le dossier techdevblog dans wp-content/themes/.
2. Activer le thème dans Apparence > Thèmes.
3. Ajouter le widget « Catégories TechDevBlog » dans la barre latérale.
4. (Optionnel) Créer le menu principal et le menu de pied de page.
5. (Optionnel) Ajuster les textes dans Apparence > Personnaliser.

Pas d’import de démo, pas de page d’options à rallonge, pas de licence « pro » à débloquer.

Sous le capot : Tailwind, mais sans build

La même philosophie s’applique côté code. J’aime la logique de Tailwind CSS, avec ses classes utilitaires directement dans le HTML. En revanche, je ne voulais ni CDN chargé à chaque visite, ni chaîne de compilation Node à maintenir.

La solution : une feuille de style assets/theme.css maintenue à la main, qui ne contient que les classes réellement utilisées par les gabarits. Le site reste léger, ne dépend d’aucun service externe, et le thème s’installe sur n’importe quel hébergement mutualisé.

La contrepartie est assumée et documentée : si on ajoute une nouvelle classe Tailwind dans un gabarit, il faut ajouter la règle correspondante dans theme.css. Un petit effort pour le développeur, zéro effort pour l’utilisateur.

Côté prérequis, rien d’exotique : WordPress 6.0 et PHP 7.4 minimum. Le thème est prêt pour la traduction et gère le logo personnalisé, les images mises en avant, les flux RSS et les fonctionnalités de l’éditeur de blocs.

Partager : un dépôt public sur GitHub

Dès le départ, le thème a été versionné avec Git. Je gère les commits et les versions directement depuis VS Code, ce qui me permet de revenir en arrière en cas de mauvaise idée, et il y en a eu.

Puis la question s’est posée : pourquoi garder ça pour moi ? Toutes les communautés, qu’elles soient sur Home Assistant, Magic Mirror ou Raspberry Pi fonctionnent sur le partage. Les intégrations, les cartes Lovelace, les blueprints : on avance parce que d’autres ont publié leur travail. Il était logique de rendre la pareille.

Le thème est donc disponible publiquement à cette adresse : ici. J’ai voulu que le dépôt soit aussi simple à prendre en main que le thème lui-même :

• un README bilingue, avec les fonctionnalités, l’installation et les prérequis ;
• un CHANGELOG bilingue, pour suivre l’évolution version après version ;
• un code de conduite, pour poser un cadre bienveillant aux contributions ;
• une licence GPL v2, comme WordPress : vous pouvez l’utiliser, le modifier et le redistribuer.

Une suggestion, un bug, une idée d’amélioration ? Les issues et les pull requests sont ouvertes.

Et maintenant ?

TechDevBlog n’est pas fini, et c’est tant mieux. Il évoluera au rythme du blog et de vos retours, toujours avec la même règle : chaque nouveauté doit marcher sans manipulation supplémentaire.

Si vous cherchez un thème sobre et lisible pour votre propre blog technique, servez-vous. Et si vous l’installez, dites-le-moi en commentaire : je serais ravi de voir ce que vous en faites.

Sur ce, je retourne à mon café. Et à mon YAML.