Typo : ajout d'une "barre sociale" & d'un sommaire

J’avais déjà vu des articles sur le site Dev411 concernant l’ajout d’une barre de bookmarking ainsi que l’ajout d’un sommaire des billets de la page courante, c’est maintenant fait.

La barre ressemble à ça, à ceci près que je l’ai passée en noir & blanc :

Ce que j’aime lorsque j’arrive sur une page c’est d’avoir un sommaire des articles de la page, cela évite de parcourir toute la page et avoir en un clin d’oeil les titres des billets, un peu comme delicious. C’était aussi l’occasion ^{de mettre un peu les mains dans Typo, et de modifier quelques scripts (index.rhtml et modèles rails) de mon thème scribbish : _article.rhtml, _article_toc.rhtml, _article_notable.rhtml}

Il reste à appliquer un style maison pour habiller le sommaire.

#articles_toc
{
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
background-color:#EEEEEE;
padding-left:5px;
border-color:#B7B7B7;
border-style:solid solid dotted;
border-width:1px;
}

#articles_toc a
{
display:block;
}

Outil que j’utilise pour les images écran : Screenshot captor, logiciel qui permet en outre d’habiller ou de manipuler la capture.

¹ A faire : mettre en place un vserver pour typodev…

² Scribbish, en plus d’une assez belle charte, apporte une sémantique aux pages grâce à l’utilisation du microformat hAtom.