Personaliza el pager de tu blog. (Página principal, entradas antiguas...)

Publicado el 01 octubre 2014 por Lireth
Hace un tiempo, pues igual 3 meses ajajaj, me preguntaban como cambiar el pager de nuestro blog, esto:

Bueno vamos a ver como cambiarlo.
Vamos a editar HTML de la plantilla (hacemos una copia de seguridad por si a caso)
Esto es para las entradas recientes.
Buscamos esto en la plantilla:
<data:newerPageTitle/>
Deberíais encontrarlo entre un texto como este:
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl + &quot;?max-results&quot; ' expr:id='data:widget.
instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
Cuando lo encontréis borráis esto <data:newerPageTitle/>
Y en su lugar pondremos esto: <img src='http://URL_DE_LA_IMAGEN _/'>
O sea debería de quedarnos así:
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl + &quot;?max-results&quot; ' expr:id='data:widget.
instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><img src='http://URL_DE_LA_IMAGEN _/'></a>
</span>
</b:if>
Ahora para cambiar lo de entradas antiguas tendréis que buscar esto:
<data:olderPageTitle/>
Pues hacemos lo mismo que arriba, borramos lo de <data:olderPageTitle/> y pegamos la url de la imagen:
<img src='http://URL_DE_LA_IMAGEN _/'>

Y por último para la Página principal pues es exactamente igual que lo demás, buscamos esto: <data:homeMsg/>
lo borramos y lo sustituimos por la dirección de la imagen:<img src='http://URL_DE_LA_IMAGEN _/'>
Si solamente queréis cambiar el tamaño de la fuente y el tipo de letra, entonces vamos al código CSS de la plantilla, lo desplegamos y abajo de todo, antes de:
</b:skin>
Pegáis esto:
.blog-pager-older-link, .home-link,
.blog-pager-newer-link {
background-color: #FFFFFF; /* Color del fondo, para transparente poned transparent */
padding: 5px;
font: normal normal 16px Arimo; /* Tamaño y tipo de letra *//* LN */
color: #AC5D7B; /* Color de la letra *//* LN */
}
Si abrir la plantilla para hacer este detallito os da miedo, abrir la pestaña de Diseño, la encontraréis en la columna de la izquierda de vuestra página de administración del blog. Luego dais al link que veréis arriba a la derecha donde dice Diseñador de plantillas. Una vez allí le hacéis clic en Avanzado y Añadir CSS.
Pegáis el código que os he dado cuando lo tengáis personalizado a vuestro gusto y le dais a guardar.
Ya está, así de sencillo.
He visto que Celia de El perro de papel también publicó este tutorial, os dejo el link por si os sirve más el de ella o si la entendéis mejor.
Tutorial en el Perro de Papel
Espero que os sirva y os resulte facilito. Muah!
¡Gracias por suscribirte! ❀Lireth❀