Modificar Texto "Entradas Antiguas" al pie de Pagina Blogger

El nuevo Blogger incorpora tanto en la página principal, etiquetas y entradas idividuales un pie de navegación, es decir, enlaces a “Entrada más reciente”, “Entradas antiguas” y “Página principal” sin formato y sin estilo. En este artículo te mostraremos como personalizarlo.

1. Entra a la pestaña “Plantilla” o también llamada “Diseño” desde el escritorio y después a la opción “Edición de HTML”.


2.Activa la opción “Expandir plantillas de artilugios” y en el campo de texto busca el siguiente código:



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





Este es el código encargado de mostrar los enlaces de navegación. Sí te das cuenta corresponden aca uno de los links:


<data:newerPageTitle/> - Corresponde al texto “Entrada más reciente”

<data:olderPageTitle/> - “Entradas antiguas”

<data:homeMsg/> - “Página principal”


3. Personalización:Cambiar el texto por otro. Para remplazar el texto por otro de nuestro agrado sólo remplazamos la etiqueta correspondiente a cada enlace por nuestro texto, por ejemplo, para el link de entradas recientes sustituimos completamente “” por “Artílos más recientes” directamente.Cambiar texto por imagen. Para sustituir el texto por una imagen podemos seguir metodología anterior y remplazar cada etiqueta por su imagen correspondiente. A continuación te damos un ejemplo creado por Blogyweb y que puedes usar libremente con sólo remplazar el código inicial con este:





<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 alt='data:newerPageTitle' src='http://bp0.blogger.com/_Zuzii37VUO4/Rf4lJS031KI/AAAAAAAAAfc/JItp8PeZF1U/s1600/botong_atras.gif' /></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 alt='data:olderPageTitle' src='http://bp2.blogger.com/_Zuzii37VUO4/Rf4lEy031JI/AAAAAAAAAfU/iu3bL2eUbhM/s1600/botong_adelante.gif'/> </a>

</span>

</b:if>



<b:if cond='data:blog.homepageUrl != data:blog.url'>

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

<img alt='data:homeMsg' src='http://bp1.blogger.com/_Zuzii37VUO4/Rf4lMi031LI/AAAAAAAAAfk/m7Qpa985MY0/s1600/botong_home.gif'/> </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>




Dar formato a los links. Si lo único que quieres es darles un mejor formato a estos enlaces modifica los atributos de las siguientes clases:


#blog-pager-newer-link - Para “Entrada más reciente”

#blog-pager-older-link - Para “Entradas antiguas”

#home-link - Para “Página principal”

7 comentarios:

Administrador dijo...
22 de marzo de 2010, 22:19

gracias si me sirvio un poco

Ani dijo...
25 de marzo de 2010, 2:04

Hola:
Me ha ayudado tu entrada graciassss!!!
un saludo

María de los Ángeles dijo...
27 de julio de 2010, 22:13

Quedó perfecto en mi blog, muchas gracias.

Peluca dijo...
6 de enero de 2011, 9:39

Muy bueno :D

pasate por el blog para reirte un rato
http://el-peluca.blogspot.com

Killzone66 dijo...
4 de mayo de 2011, 11:06

buenisimo como ha quedado (y sobre todo funciona), le he puesto unas imagenes que quedan muy bien: www.descargaps3.es

Gran tutorial!! GRACIAS MADRIGAL

EGO dijo...
3 de junio de 2011, 7:33

Excelente. Era justo lo que necesitaba.

Vietnamitas en Madrid dijo...
18 de septiembre de 2011, 23:47

Umm,
Parece que con el nuevo interfaz de blogger esto ya no funciona :(
Gracias de todas formas
Vietnamitas en madrid

Publicar un comentario