Ductile blog

Franck, mon ami,

J’ai commencé comme convenu à reprendre les fichiers de structure pour les améliorer (en tout cas c’était mon but). Tu verras quelques changements dans la partie visible du blog mais tu en verras surtout dans l’organisation et le contenu des fichiers du dossier tpl. Laisse-moi te les décrire.

Voici la liste des changements opérés (comme d’habitude, tu peux télécharger le thème en pièce jointe). Je te les énonce ci-dessous, puis dans le paragraphe suivant je t’en donnerai quelques explications et exemples d’usage, puis je ferai appel à ta compétence et ton amabilité pour mettre en place quelques trucs chouettes de plus dans le configurateur. Pour finir, je te parlerai d’un autre projet concurrent et/ou complémentaire qui fait l’objet de débats au sein de l’équipe de Dotclear en ce moment au cas où tu aurais zappé les mails de ces derniers jours.

Changeset

(Tu as vu cet intertitre qui tue ? J’aime bien faire ma maline en utilisant vos termes de geek.)

• Le sidebar n’est plus répété à chaque fichier de contexte, il est inséré via l’inclusion de _sidebar.html
• Création de trois modèles d’affichage de billet pour les listes :
  • _entry-full.html : billet complet
  • _entry-short.html : extrait s’il existe, sinon les 300 premiers caractères
  • _entry-title.html : uniquement le titre
• Ajout d’une class sur la div.post selon la typologie du post (full|short|title)
• Ajout d’une div.post-attr englobant post-info et post-tags
• Ajout de spans avec class sur les items du post-info
  • span.post-author
  • span.post-date
  • span.post-cat
• Passage des post-tags de ul.post-tags à p.post-tags
• Déplacement du script mediaqueries dans _footer.html

Explications et exemples d’usage

Le sidebar. Je pense que s’il t’est arrivé de faire des thèmes ou de vouloir en personnaliser un et que tu avais des choses à modifier dans le sidebar, tu as dû – comme nous tous designers d’occasion ou réguliers – pester contre la nécessité de devoir reporter la modif dans tous les fichiers de structure. L’insertion du sidebar via un include d’un fichier commun permet de n’avoir à intervenir qu’une fois, sur le fichier _sidebar.html pour que la modif s’affiche partout.

Les _entry-xxx.html. Cette construction répond à plusieurs objectifs :

Pour le designer ou celui qui personnalise son thème – un peu dans le même esprit que ce que je viens d’expliquer pour le sidebar –, on peut ainsi intervenir sur un seul modèle pour tous les contextes ou il s’affiche. Si par exemple je veux remplacer “Par” par “Auteur” dans le post-info je n’aurai pas besoin de modifier tous les fichiers de contexte. J’en ai profité pour ajouter une class à la div.post afin qu’on puisse appliquer des styles différents si on le souhaite selon le type de liste choisi.

Pour un plugin nécessitant un fichier template comportant une liste, un moyen simple de récupérer les choix du designer ou de l’utilisateur quant à l’affichage de la liste.

Pour Ductile – ou tout autre thème voulant utiliser cette fonctionnalité – la possibilité de laisser le choix au blogueur du format de liste qu’il souhaite voir affichée selon le contexte. Ahem… me vois-tu venir avec mes gros sabots ?

Au fait, je précise que le fait que ces listes toutes prêtes soient disponibles n’interdit évidemment nullement de s’en exonérer et de construire son propre biniou dans un contexte donné, voire de créer un autre format de liste générique et de l’utiliser en include comme ceux proposés ici.

Tu peux voir de toi-même dans les fichiers comment on peut les utiliser. J’ai appelé le modèle entry-full pour le premier billet et le modèle entry-short pour les suivants dans la home ; j’ai appelé le modèle entry-title dans les archives mensuelles.

Ajout de class diverses et variées. Elles permettront bien sûr de pouvoir affiner la présentation via les CSS. D’ores et déjà, sur Ductile, tu peux voir que j’ai ainsi pu mettre une icône sur la mention de la catégorie du billet. Il m’a fallu pour cela diviser le post-info en trois spans, l’un pour le nom de l’auteur, l’autre pour le jour de publication et le dernier pour la catégorie. Je ferai de même dans le contexte du billet ou de la page seul(e) en ajoutant également un span pour le lien permanent.

Création d’un bloc post-attr. Je regroupe le post-info et les post-tags dans une div englobante, là encore pour permettre des choses comme ce que tu peux voir sur les écrans larges de Ductile^[1], mais ça pourrait être aussi pour ajouter un fond de couleur ou une bordure ou que sais-je encore.

Je ne trouvais pas logique que les éléments du post-info soient dans un paragraphe et les tags dans une liste. Une revue quasi complète des thèmes déposés sur Dotaddict montrant que tout le monde ou presque présente les tags les uns à la suite des autres, j’ai donc suivi le mouvement et placé les tags dans un paragraphe.

Tant que j’y étais et sur les conseils de Tomtom, j’ai déplacé dans le footer l’appel du script de compatibilité d’IE9 avec les mediaqueries. Il paraît que c’est mieux pour les perfs.

Et donc, disions-nous…

Ce qui te fait donc un petit tout petit vraiment tout petit travail en plus, si tu es d’accord bien sûr et en échange de ma reconnaissance éternelle et d’un bisou. Je verrais bien dans l’onglet « Contenu » du configurateur la liste des contextes proposant une liste et un menu déroulant pour choisir le modèle d’icelle. Tu veux bien dis ? J’aimerais autant que possible éviter à l’utilisateur du thème d’avoir à mettre le nez dans les fichiers sans pour autant être limité à des choix de présentation CSS.

Dans les coulisses

En coulisses, sur la liste mail de l’équipe de Dotclear, j’ai parlé de mes projets de modifications des fichiers html. C’est là que Bruno d’une voix tonnante s’est exclamé : « Bandes de nazes, êtes-vous en train de me dire que vous foutez ma super idée à la poubelle ? » « Je crois que vous n’avez pas eu le temps de lire la proposition très construite que je fis jadis sur le forum. »

Enfer et damnation, c’est à ce moment que j’ai dû avouer que je l’avais lue… et n’avais pas trop compris l’affaire ou du moins compris l’idée mais pas réussi à m’imaginer concrètement la mise en œuvre de cette idée. D’ailleurs tu dois t’en souvenir car quand sur son injonction je suis retournée lire son message sur le forum et que tu en faisais autant assis à côté de moi, nous avons prononcé à peu près en même temps : moi « iféchié cé 1 truckdegeekimbittable », toi « c’est intelligent ! »

Depuis il a pris le temps de réexpliquer dans ses mails et je trouve ça un peu moins imbittable, toujours aussi geek et je redoute que cette solution offre plus de simplicité apparente (moins de copier-coller pour créer un nouveau contexte ou en modifier un existant) mais moins de compréhension intuitive et par là-même moins accessible aux novices. Mais, me diras-tu, tu disais déjà ça pour les thèmes quand on est passés de Dotclear 1 à Dotclear 2 – et je ne pourrai pas te dire le contraire…

Nous doutons donc tous, chacun dans son coin, ou nous pestons contre l’Ennemi, ça dépend de l’humeur. On argumente, on donne des exemples, des contre-exemples, on essaie de dessiner ce qu’on a compris pour y voir plus clair. Tous les dev de l’équipe sont emballés par la proposition de Bruno et je comprends bien que côté code elle est élégante. En tout cas, la discussion n’est pas tranchée et il s’ensuit que nous allons continuer à travailler sur Ductile mais sous l’angle d’un thème à distribuer hors Dotclear, quitte à l’y rapatrier quand la discussion autour de la refonte des templates sera aboutie.

Bien évidemment je compte sur nos visiteurs pour apporter leur pierre à la discussion ouverte par Bruno sur le forum et/ou ici.

J’espère avoir bientôt de tes nouvelles et t’embrasse bien fort.