Imagen en la sidebar que funciona como link

Todos sabemos que en Blogger podemos añadir con facilidad una imagen en la sidebar, directamente desde nuestro PC, si al "añadir un elemento de página" escogemos la opción "imagen".



Esta tarde, en un comentario Agustín me pregunta como podría hacer que esa imagen subida al blog desde su PC funcione como link, ya que Blogger no incluye esta opción.
He conseguido hacerlo de forma un tanto "artesanal", así que tal vez no sea la manera más correcta, pero lo he probado y funciona.

[1] Una vez añadida la imagen a través de "añadir un elemento de página", nos situaremos en la parte de "edición-HTML" de nuestra plantilla, expandimos los artilugios y localizamos el widget de nuestra imagen:

<b:widget id='Image1' locked='false' title='' type='Image'>
<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_img"' expr:src='data:sourceUrl' expr:width='data:width'/>
<br/>
<b:if cond='data:caption != ""'>
<span class='caption'><data:caption/></span>
</b:if>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>


[2] Dentro de este código, he señalado en negrita la parte que pertenece a la imagen. Colocaremos ese código dentro del que usamos a menudo para un link cualquiera:

<a href='Dirección_del_enlace'><img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_img"' expr:src='data:sourceUrl' expr:width='data:width'/></a>

[3] Para abrir el enlace en página nueva, usaremos el "target":

<a href='Dirección_del_enlace' target='_blank'><img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_img"' expr:src='data:sourceUrl' expr:width='data:width'/></a>