Comment utiliser des images pour naviguer entre les billets ?

Un hack blogger très connu. Le but étant simplement d'avoir une navigation en image entre les billets. C'est plus agréable pour les yeux :)
Cette astuce est pour tout les niveaux car il n'y a aucune connaissance particulière à avoir.
Allez dans votre Tableau de bord > Mise en paage > Modifier le code HTML > cocher Développer des modèles de gadget.
Cherchez (CTRL-F) dans le code:
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class='clear'/>
</b:includable>
Copiez et remplacez le bloc par:
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><img expr:alt='data:newerPageTitle' src='http://i33.tinypic.com/24gku93.png'/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><img expr:alt='data:olderPageTitle' src='http://i36.tinypic.com/mrzad3.png'/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img expr:alt='data:homeMsg' src='http://i34.tinypic.com/15mzpkx.png'/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img expr:alt='data:homeMsg' src='http://i34.tinypic.com/15mzpkx.png'/></a>
</b:if>
</b:if>
</div>
<div class='clear'/>
</b:includable>
On obtient ceci:

Pour personnaliser les images, remplacez les liens suivants par vos liens dans le code à insérer.
- Message plus récent: http://i33.tinypic.com/24gku93.png
- Message plus ancien: http://i36.tinypic.com/mrzad3.png
- Accueil, home: http://i34.tinypic.com/15mzpkx.png
Voilà, simple n'est-ce-pas ? :)