Come sostituire con immagini i link "Post più recenti/vecchi"

Al fondo del nostro blog (mi riferisco a Blogger), dopo tutti i post, ci sono tre link: Post più recenti, Home e Post più vecchi (come nell'immagine qui sotto). 

Se lo si desidera, questi link possono essere facilmente sostituiti con immagini create da noi. Per esempio io li ho sostituiti con le due scritte newer e older realizzate con lo stesso font usato per il titolo del blog (come potete vedere anche nell'immagine qui sotto) e ho tolto il link Home perché in basso a sinistra ho già un bottone che svolge la stessa funzione.

Naturalmente la prima cosa da fare sarà creare le immagini che vogliamo utilizzare (possono essere per esempio scritte, come nel mio caso, oppure semplici frecce...) servendoci di programmi come Photoshop o Gimp (ognuno può scegliere di lavorare con quello con cui si trova meglio). 

Una volta create le nostre immagini dobbiamo inserirle in Photobucket (o simili) perché di esse ci servirà l'URL. Secondo me però la soluzione più rapida per ottenere l'URL di un'immagine è quello di caricarla in un post (esattamente come faremmo se dovessimo pubblicare un post sul nostro blog) e quindi cliccare sopra l'immagine con il tasto destro del mouse e scegliere Copia indirizzo. Ovviamente il post non dovrà essere pubblicato ma conservato nell'archivio.  

Adesso, in Blogger, possiamo andare in Modello > Modifica HTML. La striscia di codice che dobbiamo cercare è questa: <b:includable id='nextprev'> (e cliccando Ctrl + F la potremo trovare rapidamente). Questa linea di codice dovrà essere sostituita con il codice riportato qui sotto:

<b:includable id='nextprev'>
<div id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<a expr:href='data:newerPageUrl' expr:title='data:newerPageTitle' id='blog-pager-newer-link'>
<img src='URL FRECCIA SINISTRA'/></a>
</b:if>
<b:if cond='data:olderPageUrl'>
<a expr:href='data:olderPageUrl' expr:title='data:olderPageTitle' id='blog-pager-older-link'>
<img src='URL FRECCIA DESTRA'/></a>
</b:if>
<a class='home-link' expr:href='data:blog.homepageUrl'>
<img src='URL HOME PAGE'/></a>
</div>
<div class='clear'/>
</b:includable>

Ora non resta che andare a sostituire le parti in rosso con l'URL richiesto. E se per caso si volesse eliminare il link Home come ho fatto io basta non inserire alcun URL al posto della scritta in rosso URL HOME PAGE.