Thèmes pour Dotclear

dimanche 29 mars 2026

Adèle

Par Kozlika le dimanche 29 mars 2026, 08:37

Voici un prochain thème pour Dotclear. Il s’appelle Adèle et est inspiré du thème de l’Auberge des blogueurs. Il sera livré dans les jours prochains, Franck et Philippe mettent la dernière main au configurateur.

Il ne nécessitera pas de plugin impératif mais le thème est prêt pour l’utilisation de Author Mode, Contact Me et Color Scheme Switcher.

Il est doté d’une variation sombre, qui s’affichera selon les réglages système des visiteurs et visiteuses du site.

Réglages et caractéristiques

Le configurateur permettra différents réglages :

  • La couleur des entêtes varie selon la catégorie ou l’auteurice.
  • L’image de bannière est remplaçable, le thème est livré avec un assortiment mais on peut choisir une autre image dans sa médiathèque.
  • L’accueil présente une « galerie » de billets, on peut choisir de n’afficher que le dernier, en entier.
  • Amorces : dans la présentation en galerie, on peut désigner des catégories pour lesquelles l’amorce texte sera remplacée par la première image.

Voici une galerie présentant différents réglages et bannières. Vous pouvez la parcourir en cliquant sur la première image puis en utilisant les flèches droite et gauche du clavier pour passer de l’une à l’autre.

Galerie

copie d'écran de la présentation par défaut
Par défaut : bannière Audierne et set de couleurs douces (mode clair).
La bannière est une image abstraite aux couleurs saturées, évoquant vaguement des gratte-ciel
Bannière Abstrait, accueil solo (mode sombre).
Variante avec une bannière représentant des chardons violets au premier plan et la mer à l'arrière-plan
Bannière Chardons, set de couleurs vives (mode clair).
La bannière est une photo du poème sur l'eau visible à Hoorn, aux Pays-Bas
Bannière Hoorn, set de couleurs douces (mode clair).
La bannière est une photo d'une plage déserte avec des drapeaux de surveillance, ambiance brumeuse
Avec le choix d’une image personnelle (mode sombre).
Variante aux couleurs vives sur fond clair. Un gros plan sur une main en train d'écrire dans un cahier
Bannière Écrire, set de couleurs vives (mode clair).
Bannière de fleurs aux couleurs éclatantes
Bannière Printemps, set de couleurs douces, accueil solo (mode clair).
L'image représente une série de statuettes de danseuses de la dynastie Tang exposées au musée Guimet
Bannière Tang, set de couleurs douces (mode clair).
Photo de bannière un coucher de soleil sur la mer
Bannière Sunset (mode sombre).
L'image de bannière est un oiseau coloré en plan rapproché au milieu d'épis de blé
Bannière Oiseau, set de couleurs douces, accueil solo (mode clair).

Tester

Pour voir le thème en action, choisissez Adèle dans le menu Changer de thème ou cilquez sur ce lien. Pour le voir en mode sombre, actionnez le bouton correspondant dans le menu Mode clair/sombre. Merci de me faire part des anomalies que vous pourriez rencontrer ou vos suggestions d’amélioration.

3 commentaires

mardi 10 mars 2026

Valadon

Par Kozlika le mardi 10 mars 2026, 13:49

Un nouveau thème pour Dotclear, plutôt destiné aux diaristes je pense. Il est bien entendu adaptable sur toutes les tailles d’écran et également en fonction des préférences système de vos visiteuses et visiteurs pour alterner les modes clair/sombre selon l’heure.

L’image en exergue est le tableau « La Chambre bleue », de Suzanne Valadon, qu’elle a peint en 1923. À son sujet, vous pouvez lire par exemple cet article de Phalène ou le dossier ressources que le Centre Pompidou lui a consacré.

J’aime aussi beaucoup l’affiche que Solidaires en a faite.

Voici une petite galerie du thème avec différentes images et différents réglages. Les deux premières sont les captures du thème tel qu’il est sans personnalisations.

copie d'écran du thème en version de base, mode clair copie d'écran du thème en version de base, mode sombre copie d'écran du thème en version personnalisée, mode sombre une autre copie d'écran du thème en version personnalisée, mode sombre copie d'écran du thème en version personnalisée, mode clair une autre copie d'écran du thème en version personnalisée, mode sombre

Configuration (optionnelle)

Le thème est utilisable tel quel ou personnalisable via son configurateur, qui permet :

  • De changer l’image mise en valeur dans la bannière.
  • De modifier le texte qui se situe dans le cartouche sous cette image, avec lien possible, ou de laisser le cartouche vide.
  • De choisir une autre couleur d’accompagnement pour le mode clair et/ou le mode sombre.

copie d'écran du configurateur

Si vous n’utilisez pas l’une des couleurs prédéfinies proposées dans le configurateur, faites attention à ce que le contraste résultant de ce choix soit suffisant pour ne pas gêner la lecture. Un lien vers un outil de vérification figure dans les notes au bas de cet article.

À savoir

Sidebar

Les widgets sont tous situés en bas des pages. Ceux rangés dans « Volet de navigation » et « Volet d’extra » sont affichés en boîtes encadrées, ceux placés dans « Volet supplémentaire » sont intégrés au footer. Sur mobile ces blocs sont repliés.

copie d'écran du pied de page du thème en version de base, mode clair aperçu du thème sur mobile

Menu simple

Si le nombre des éléments du « Menu simple » (partie droite de la bannière) est supérieur à quatre, seuls les trois premiers s’affichent, une flèche permet de dérouler la suite.

Pour le voir en action si ça n’est pas celui qui s’affiche chez vous cliquez ici ou choisissez-le via le menu Changer le thème. Il sera également sur le blog de démo de Dotclear incessamment sous peu, dès que je l’aurai déposé (dans les tout prochains jours).

Notes et crédits
  • Le style appliqué aux boîtes de bas de page lorsqu’elles sont repliées est inspiré de ce tutoriel de Geoff Graham sur CSS-tricks.
  • La taille des titres varie en fonction de la largeur d’écran. Je me suis servie de cet outil pour les formules magiques.
  • Les icônes ont été puisées sur icones.js et sur CSS-shape.
  • Les valeurs de contraste ont été vérifiées grâce à Contrast Finder, un outiil qui permet non seulement la vérification mais aussi des suggestions si le contraste est insuffisant.
  • Les petits coins des encadrés, en pur CSS, sont dérivés de ce code pen.

6 commentaires

dimanche 8 mars 2026

Ductile 2026 v1.0

Par Kozlika le dimanche 8 mars 2026, 13:40

Le thème Ductile 2026 est prêt. Il fera partie de la distribution lors de la prochaine version de Dotclear, le 13 mai prochain. L’ancien Ductile sera supprimé des thèmes par défaut mais restera dans les thèmes disponibles sur votre installation. Libre à vous d’activer le nouveau via « Apparence du blog » ou de rester sur l’ancien.

Aperçu du thème Ductile 2026
Aperçu du thème, page d’accueil. Cliquez sur l’image pour la voir en plus grand.

L’activation de Ductile 2026 n’empêchera pas de revenir sur Ductile « tout court » si finalement vous préfériez l’ancien.

2 commentaires