Cambiar links de navegación entradas antiguas - entradas recientes - página principal

Debajo de las entradas solemos encontrar enlaces de navegación del tipo: Página principal, Entradas antiguas, Entradas más recientes.

Se puede dejar tal cual o hacer variantes:

A. Cambiar el diálogo

1. Diseño>Edición de HTML>expandimos artilugios

2. Control+F y buscamos la línea con el código:


<b:includable id='nextprev'>


3. Debajo de la línea anterior colocamos el código que hará los cambios:


<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>


4. Ahora se trata de sustituir en el código anterior el texto que queramos mostrar en cada link de navegación:


<data:newerPageTitle/> (Entradas más recientes)



<data:olderPageTitle/> (Entradas antiguas)



<data:homeMsg/> (Página principal)




5. Guardar Cambios.

B. Cambiar los links de navegación por iconos

Tal como tengo en el blog se trata de modificar "entradas antiguas", "página principal" y "entradas recientes" por unos iconos o imágenes.

1. Diseño>Edición de HTML>expandimos artilugios

2. Control+F y buscamos la línea con el código:


<b:includable id='nextprev'>


3. Una vez localizado sustituyes todo lo que está desde
<b:includable id='nextprev'> a </b:includable>(ambos incluidos) por el código:


<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-izquierda'/></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-derecha'/></a>

</b:if>

<a class='home-link' expr:href='data:blog.homepageUrl'>

<img src='url-inicio'/></a>

</div>

<div class='clear'/>

</b:includable>


4. Opcional: Se aplica CSS si el resultado hace que los iconos salgan juntos.



#blog-pager-older-link {

float: right;

}



#blog-pager-newer-link {

float: left;

}

#blog-pager {

text-align: center;

}




5. Guardar Plantilla.


Más en Enlaces de navegación códigos para recuperarlos