Páginas

28/8/13

Personalizar con texto o imágenes las entradas recientes,entradas antiguas y página principal. Para formato de plantilla nuevo en blogger.

Seguimos personalizando nuestro blog así que ahora toca cambiar el aspecto de las entradas recientes,antiguas y página principal.


Me ha costado un poco publicar este tutorial  porque encontraba tutoriales con la plantilla antigua pero ya he dado con la solución, lo único que os recomiendo es que hagáis todo según lo explico para que funcione.

El primer paso es elegir las imágenes o texto para subirlas a un servidor de imágenes, yo utilizare imageshack.





Os dejo las imágenes que hice en Photoshop.









Ahora iremos a Diseño y seleccionaremos Plantilla.
Es recomendable hacer una copia de seguridad de nuestro blog por si algo sale mal poder restablecer la plantilla.







Ahora seleccionaremos Editar HTML.



En una zona en blanco haremos clic con el botón izquierdo del ratón y presionaremos a la vez las teclas Control F para que nos aparezca la barra de búsqueda adicional.
(recordad que el signo más no se aplica a la hora de presionar ambas teclas).





Entradas más recientes:

Ahora copiáis y pegáis este código para buscarlo desde la barra adicional de búsqueda.

<data:newerPageTitle/>

Ahora con mucho cuidado de no eliminar nada más lo sustituis por este otro código.

<img src='URL de la imagen'/>

Para que os sea más cómodo sustituirlo , eliminar solamente el texto  data:newerPageTitle/  dejando < > y pegar el texto del código que lo sustituira  img src='URL de la imagen'/ . 

De está forma evitaremos que se descoloque la plantilla y os de error.








Ahora copiaremos y pegaremos el enlace directo de la imagen que subimos a imageShack donde pone URL de la imagen.
Os lo he dejado resaltado en color rojo.

<img src='URL de la imagen'/>







 Entradas antiguas.

Sustituiremos de la misma forma que el anterior este código:

<data:olderPageTitle/>

Por este otro:

<img src='URL de la imagen'/>

Recordad utilizar la barra adicional de búsqueda para que os sea más fácil en este paso y en el siguiente de abajo.

Si queréis ver como queda podéis verlo desde vista previa de la plantilla.





Página principal.

Al igual que en los anteriores cambiaremos este código:

<data:homeMsg/>

por este otro:

<img src='URL de la imagen'/>


Ahora solo hay que guardar plantilla y clic en ver blog.
Ya estarán los cambios aplicados.

8 comentarios :

  1. Muchas , muchas gracias por la entrada me sacaste de muchas dudas
    Muchas Gracias
    Myrian Salinas

    ResponderEliminar
  2. Muchas Gracias por la entrada me ha servido mucho, usare tus consejos , muchas gracias , Cariños
    Myrian

    ResponderEliminar
  3. no encuentro ese codigo como hago?? avecesn o me aparece :'c

    ResponderEliminar
    Respuestas
    1. Hola muchas gracias por la visita.
      Vuelve a probar según los pasos del tutorial tiene que aparecerte el código, sino es así intenta buscar algún otro tutorial por la web a ver si te sirve, un saludo

      Eliminar
  4. Muchas gracias por tomarte el trabajo de hacer estos tutos! son super útiles y no podrían estar mejor explicados n.n

    ResponderEliminar
    Respuestas
    1. Gracias a ti por visitar mi blog me alegra este tipo de comentarios y ver que mi trabajo os es grato y os sirve un saludo

      Eliminar
  5. ¿Cómo hiciste para que el texto en la pestaña tenga movimiento?

    ResponderEliminar
    Respuestas
    1. Mira en este enlace.

      http://decoratublogconlucia.blogspot.com.es/2013/04/aplicar-movimiento-al-titulo-de-nuestro.html

      Eliminar