Utilizar una imagen como título de los gadgets

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


Utilizar una imagen como título en cualquier gadget de tu blog

Recuerdo que tiempo atrás, una de las primeras modificaciones que le hice a mi blog fue la de reemplazar los títulos de los gadgets por imágenes. Los lectores quedaron encantados y en la mayoría de sus comentarios me pidieron que les explicase la forma de conseguir lo mismo.

Por ello, en esta entrada quiero presentártelo y conseguir que en unos sencillísimos pasos puedas aplicarlo a los elementos de página que tengas tanto en la barra lateral de tu blog como en el pie de este mismo...



Nuestro primer pasó constará de añadir el gadget a personalizar en tu barra lateral o en cualquier sección del blog. Para ello, accede al apartado Diseño>Elementos de la página>Añadir un gadget. Seguidamente, atribúyele el título 'Mi gadget imagen'.

Guárdalo y sigue estos pasos:

Diseño>Edición de HTML>expandimos artilugios

Pulsando las teclas Ctrl y F para abrir el buscador de tu navegador, encuentra el título que acabas de introducir.

Una vez localizado, notarás que el código es muy similar a este:

<b:widget id='HTML1' locked='false' title='Mi gadget imagen' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

En mi caso, seleccioné el gadget html-javascript y por tanto el código es más corto aunque esto no tiene nada que ver con nuestro truco dado que variará según tu elección.

Ahora, reemplaza la línea resaltada en color verde por esto:

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

Sustituye URL DE TU IMAGEN por la dirección de la imagen que actuará como título.

Haz vista previa para comprobar el resultado y guarda la plantilla para terminar.