mercredi 18 février 2026

Rafraîchissement de Ductile : phase 2

Comme la lectrice avertie l’aura subodoré à la lecture du billet précédent de ce matin, je vais poursuivre les travaux en parallèle avec Franck et pour ce faire, nous avons créé un dépôt de code commun et j’ai fait une installation sur mon ordinateur pour pouvoir récupérer ses modifs au fur et à mesure — et lui les miennes.

Il ne sera donc pas possible de voir les changements en live pour le moment. En revanche, je vais tâcher de continuer ici à indiquer au fur et à mesure ma liste en vrac des modifs. Elles seront d’ailleurs de deux ordres : les améliorations de l’existant (ce sera plutôt moi) et le configurateur (plutôt Franck).

Je remettrai le thème à jour ici quand nous aurons une version distribuable ou proche de la distribution.

Modifs de la phase 2

  • Templates: il y avait un souci avec l’intégration de la description du blog dans l’entête, correction du template du top.
  • Templates : la liste des billets d’une catégorie inclut ceux des sous-catégories éventuelles1.
  • Templates : réintégration des widgets blogcustom dans la sidebar.
  • CSS : amélioration de l’affichage des images (petite réserve tout autour, fond légèrement grisé).
  • CSS : correction du chapo qui était collé au premier paragraphe du corps du texte.
  • CSS : présentation du code et texte préformaté, correction pour ne pas souligner chaque ligne en cas de pre + code.
  • CSS : archives : la présentation en arbre des catégories et sous-catégories est désormais en full css sans images.
  • CSS : distribution des blocs d’archives par catégorie et par tags améliorée.
  • CSS : améliorations diverses et variées du rendu sur mobiles et petits écrans.
  • CSS : les listes sont en pure CSS, sans images.
  • CSS : présentation des blocs aside ainsi que des details/summary.
  • Couleurs : harmonisation couleur du fond des stickers, des icônes de flux et des boutons de prévisu/validation, suppression des dégradés.
  • Images : optimisation, passage en svg chaque fois que possible.
  • Tech : regénération du screenshot (petite image de prévisu du thème pour l’admin).

  1. C’était d’ores et déjà possible via un réglage des paramètres du blog, checkbox Inclure les sous-catégories dans la page des catégories et dans les flux de billets pour une catégorie mais c’est ici en dur parce que neuf utilisateurices sur dix ne savent même pas que ce réglage existe et qu’il me semble que le texte “Filtrer par sous-catégorie” au lieu de l’actuel “Sous-catégories” est plus clair. ↩︎

Pense-bête pour déménagement de blog

Le déménagement d’un blog (ou sa copie) est, dans le beau pays de Théorie, plutôt facile. On exporte les billets et les médias via l’item Import / Export puis on les importe sur le blog cible grâce au même item.

Attention cependant, il peut y avoir des ajustements à faire, comme ce fut le cas pour moi. J’ai créé un environnement de travail sur mon ordinateur pour poursuivre le travail de rafraîchissement du thème Ductile en m’appuyant sur les billets et médias du blog de démo des thèmes pour Dotclear.

Mon Dotclear local est basique, sans ajout d’aucun plugin, afin de reproduire l’environnement d’un·e utilisateurice venant tout juste d’installer son bébé. Or le blog de démo est augmenté du plugin MarkdownSyntax, qui comme son nom l’indique permet la saisie des billets en syntaxe Markdown. Il en est résulté que les billets écrits dans cette syntaxe sur le blog de démo sont arrivés dans mon blog local restitués en texte brut au lieu de la mise en forme qu’elle permettait.

Autre souci, plus difficile à gérer si l’on a beaucoup de médias dans le blog : les constructions respectives des URLs menant vers les médias peuvent différer entre le blog d’origine et le blog cible. Ainsi, dans mon blog local l’url relative est /dotclear/public/<chemin_du_fichier> alors que sur le blog de démo c’est /blogfiles/dc-demothemes/public/<chemin_du_fichier>. Plus aucune image ne s’affichait donc sur mon blog local. En l’occurrence, comme c’est un petit blog j’ai pu corriger les chemins à la main mais sur un gros blog cela peut demander un gros travail d’aller tout corriger…

Je ne sais pas s’il serait possible d’améliorer le plugin Import / Export pour faciliter ce type de tâche mais ce serait une amélioration non négligeable. Par exemple on pourrait offrir le choix entre sauvegarde simple et export en vue de migration avec un champ dédié pour le nouveau public_url ?

lundi 16 février 2026

Rafraîchissement de Ductile : phase 1

Histoire de me remettre dans le bain, je replonge dans le thème Ductile pour le rafraîchir. Ceci est un billet que je compléterai au fil de mon travail, une sorte de journal de bord, tant pour redécouvrir la mécanique des thèmes de Dotclear que réveiller ma mémoire côté CSS… et me remettre progressivement à jour de mes connaissances.

Les retours et suggestions sont évidemment plus que bienvenus dans les commentaires.

Environnement de travail

Pour pouvoir tester ici, j’ai commencé par dupliquer le thème Ductile. C’est sur cette copie que je vais travailler. Dans le fichier _define.php, je remplace le nom créé automatiquement (Ductile (copie)) par Ductile 2026.

Work in progress en live

On peut comparer ancienne et nouvelle version grâce au plugin Arlequin installé ici qui permet d’afficher un bloc « Changer le thème » dans le sidebar. L’ancienne continue de s’appeler Ductile et la nouvelle se nomme Ductile 2026.

Modifs CSS non visibles

  • Fusion des règles css dans un seul fichier : au lieu des include, copie-colle les règles dans des @layer {}.
  • Ajout de variables pour les fontes.

Modifs visibles

  • remplacement du logo par le même mais en svg et sombre pour rééquilibrer sombre/clair dans l’entête ;
  • remplacement des stickers png par des sitckers svg, même fond que la feuille ;
  • sur mobile, fond du titre du blog en bleu ;
  • famille de caractères : conservation du serif, mais remplacée par une serif dite transitionnelle ;
  • taille de base des caractères un peu augmentée (de 100% à 105%) ;
  • taille du titre du blog légèrement augmentée aussi et un peu plus d’espace au-dessus de la baseline ;
  • suppression des text-shadow en différents endroits (titre du blog
  • augmentation de l’interlignage de base de 1.5 à 1.6 ;
  • réduction des marges de côté pour la zone principale sur les écrans de largeur supérieure à celle des tablettes ;
  • réduction légère de la taille des titres de billet, de 2.5em à 2.25em ;
  • augmentation de la marge entre les billets (dans les présentations en liste) à 2em au lieu de 1em ;
  • appels de note en bleu, en gras, un peu décollés du texte ;
  • notes : filet de séparation un poil plus large ; marge au-dessus un peu plus grande ;
  • augmentation légère de l’espace intérieur des boîtes de la sidebar ;
  • suppression du hideux dégradé du bandeau de navigation de billet en billet ;
  • bandeau de navigation : précédent à gauche et suivant à droite au lieu des deux centrés ;
  • correction du débordement du post-info lorsque le nom de la catégorie ou du tag est trop long ;
  • soulignement des liens un poil moins collé, grâce à text-underline-position: from-font; et text-underline-offset: .2em; ;
  • remplacement du set d’icônes (et passage au format svg) ;
  • ajout de styles pour l’élément aside.

dimanche 1 février 2026

Réveil des ateliers

Je ranime ce blog pour bosser sur des thèmes. Je n’efface pas les billets anciens mais je les ai tous classés dans une catégorie « Grenier », pour mémoire.

Nonobstant, **tous les billets antérieurs au présent billet sont considérés obsolètes.**