Choux, riz, Ken

On me pose souvent cette question : comment as-tu fais ton système de shuriken ? Et comme je suis sympa, je vais y répondre.

Alors tout d’abord sachez que je n’ai rien inventé, c’était déjà prévu dans k2 sous le nom de « Asides ». Commencez donc par voir si votre système de blog ne propose pas déjà une option de ce genre.

Le principe est de donner un nouveau style CSS à certains posts, pour leur ajouter une image, changer la taille de la police, ou n’importe quoi d’autre. Donc première chose : trouver (ou donner) une classe CSS à nos Asides. Deuxième chose : leur appliquer un style.

Avec k2, il est possible de choisir une catégorie qui sera utilisée pour les Asides : ainsi, chez moi chaque post de la catégorie « shuriken » sera automatiquement doté d’une classe « k2-asides ». Si vous n’utilisez pas k2, il faut savoir que la grande majorité des thèmes et moteurs de blog ajoutent une classe CSS pour chaque catégorie ajoutée à un post. Ainsi, les articles de la catégorie « bioprout » devraient disposer d’une classe « category-bioprout » ou quelque chose du genre. Analysez donc rapidement le code (X)HTML de vos posts pour trouver la classe CSS qui va bien. Ca devrait ressembler à ça (en gras, les classes CSS qui nous intéressent) :

<div id="post-264" class="hentry p5 post publish author-remouk category-3615-mavie category-rigolol category-shuriken tag- y2007 m12 d28 h10 k2-sides alt">

Pour la suite, une fois la classe trouvée ou ajoutée, il suffit d’appliquer le style CSS que vous voulez. Ici, je colle une image et je décale vers la gauche :

#rollingcontent .k2-asides {
background: #FFFFFF url('imagequitue.png') no-repeat left 15px;
padding-left: 40px;
}

Pour mettre le titre et les meta-datas sur la même ligne :

#rollingcontent .k2-asides h3,
#rollingcontent .k2-asides .entry-meta,
#rollingcontent .k2-asides .chronodata,
#rollingcontent .k2-asides p,
#commentlist li .comment-meta {
display: inline;
}

Bien sûr, ces styles CSS correspondent à k2. A vous de les adapter à votre thème !

Voilà, j’espère que c’est assez clair. :) Sinon, n’hésitez pas à mettre plein de mayo sur vos frites ou à poser vos questions ici, en commentaire.