Aprende a Diseñar tus Entradas IV

Visto hasta ahora:

1.- El título. Ver Aquí.

2.- Redacción, estilo y ortografía. Ver Aquí

3.- Videos e Imágenes. Ver Aquí


Hoy vamos a tratar el último de los cuatro puntos con los que empezamos esta serie: 

4.- La optimización del diseño de las entradas en Blogger. 

Que no es otra cosa que esos pequeños detalles que hacen que la lectura de nuestras entradas sea más amena.

Este tema es muy extenso, así que comenzaremos hablando hoy de los títulos ¿vale? 

Ya hemos visto la importancia de usar un buen título y como podemos decorarlo con una imagen al principio del mismo:

♥ Elegir el título de mis entradas.

♥ Poner un icono en el título de mis entradas.

Empezaremos por resolver una duda de Nelebka. En la entrada en la que hablamos sobre los iconos, ella preguntaba si era posible poner una imagen diferente en cada título. ¡Es posible! Y vamos a ver como hacerlo de una manera muy sencilla.

Cómo poner una imagen diferente en el título de cada entrada del blog

1.- En la pantalla de edición de nuestra entrada, situamos el cursor en la parte del título y añadimos delante el siguiente código:

<img src="URL DE NUESTRO ICONO"/>

Necesitamos tener nuestra imagen subida a dropbox, picasa o similar, para añadir el enlace a la misma donde te he indicado.



Así:

2.- Escribimos el título normal de nuestra entrada y si vamos a Vista Previa, el resultado será éste:

De esta manera tan sencilla, podemos poner el icono que queramos delante del título de cada una de nuestras entradas de forma independiente. Las imágenes pueden ponerse en cualquier parte de tu título, no tiene por qué ser al principio.

Otra opción para darle un toque original al título es añadirle diferentes colores, vamos a ver como hacerlo.

Cómo añadir diferentes colores al título de las entradas del blog

1.- En la pantalla de edición de entradas, escribimos nuestro título en la zona donde iría el texto de la entrada.

2.- Le aplicamos en Vista Redacción el formato que queramos.

 3.- Pasamos a Vista HTML y copiamos el código que aparece entre:

<div dir="ltr" style="text-align: left;" trbidi="on"> </div>

En mi caso sería.

Escribir <b><span style="color: #0c343d;">aquí </span></b>el <i><span style="color: #e06666;">texto de la entrada</span></i> que queremos <u><span style="color: #20124d;">colorear</span></u>

4.- Lo pegamos en el título de nuestra entrada y en Vista Previa podemos ver el resultado antes de guardar/publicar.

5.- ¡Y listo! Ya tenemos un título que llama la atención por su originalidad y que despertará la curiosidad de nuestras nuevas visitas.

Espero que te sea muy útil. ¡Ya me contarás!

---

Suscríbete a mis entradas por email ¡para no perderte nada!





♥ Las recibirás en tu bandeja de entrada el mismo día que sean publicadas ♥