Agregar una imagen antes del título de las entradas

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en trucos blogger. ! Ve la entrada en su blog original.

Antes del titulo de las entradas... una imagen

Se trata de poner un icono o una pequeña imágen antes del título de una entrada. Hay dos procedimientos para colocar este pequeño icono, yo os lo explico ahora mismo:

Diseño>edición HTML>expandimos artilugios

Buscamos este código:

<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>

Ahora añadimos esto justo después de <a expr:href='data:post.url'>

<img src= "URL DE LA IMAGEN"/>

Sustituye URL DE LA IMAGEN por la dirección de tu imagen.

La otra opción de hacerlo es esta:

Buscamos este código, (expandiendo artilugios) en el CSS de nuestra plantilla:

.post h3 {

Justo después le pegamos esto:

background: url(URL DE LA IMAGEN) no-repeat 0;
padding-left: 20px;

Si queremos cambiar algo, el padding-left nos dice la distancia que habrá del icono al texto, podremos cambiar su valor, según sea el tamaño de nuestro icono.

Debes sustituir URL DE LA IMAGEN por la dirección del icono o la imagen a mostrar.

Ya hemos terminado, podemos ver el resultado en la vista previa.