Abrir enlace del gadget de Imagen en ventana nueva

|

Hay dos formas de poner una imagen en la sidebar, una es con el gadget HTML/Javascript en el cual debemos poner el código de la imagen, y adicionalmente podemos agregarle estilos. Y otra es usando el gadget de Imagen, en el cual cargamos la imagen desde nuestro equipo o entregando una URL; y además podemos ponerle un pié de imagen y un enlace que dirija a otro sitio Web.

Hasta ahí todo está bien, el problema viene cuando usamos el gadget de Imagen y queremos que el enlace abra en una ventana nueva, ya que por defecto el enlace agregado a esta imagen se abre en la misma ventana y como dice mi querida amiga María Rosa, obliga al usuario a abandonar nuestro blog y eso no nos conviene.
Pero esto tiene solución, y es usando el mismo método que usamos para abrir la Lista de links en una ventana aparte, es decir, editaremos el gadget directo en la plantilla y agregaremos el atributo target='_blank'

Cuando quieras que una imagen que hayas subido con este gadget abra el enlace en una ventana nueva entra en Diseño > Edición de HTML, marca la casilla Expandir plantillas de artilugios y busca el código del gadget de la imagen (puedes guiarte por el nombre del gadget que le has asignado).
El código completo del gadget es así:
<b:widget id='Image1' locked='false' title='Imagen' type='Image'>
<b:includable id='main'>
<b:if cond='data:title != &quot;&quot;'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<b:if cond='data:link != &quot;&quot;'>
<a expr:href='data:link' target='_blank'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_img&quot;' expr:src='data:sourceUrl' expr:width='data:width'/>
</a>
<b:else/>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_img&quot;' expr:src='data:sourceUrl' expr:width='data:width'/>
</b:if>
<br/>
<b:if cond='data:caption != &quot;&quot;'>
<span class='caption'><data:caption/></span>
</b:if>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Sólo agrega lo que está en color rojo y listo, el vínculo que le hayas puesto a esa imagen abrirá en una ventana aparte, con lo que evitaremos que el lector abandone nuestra página.

NOTA: Recuerda dejar un espacio en blanco antes de poner el atributo target='_blank'

31 comentarios:

Blogio dijo...

guau potro esto es genial!!
por eso tu blog es el mejor y el que mas visito
salu2!

El Venado dijo...

Muy bueno.
Por cierto donde puedo checar el pagerank.

saludos.

Fran Cruz dijo...

Me lo pillo!! Se puede hacer esto abriendo el nuevo enlace en una pestaña en lugar de una ventana?

Ezequiel dijo...

holass, solo era para decirte que en el link al blog del escaparate capas te confundiste de link y pusiste este http://drgoliamiguel.blogspot.com/, era solo para eso, un abrazo grande y muy bueno el tuto :D

El Potro dijo...

El Venado, hay varios sitios, este es uno de ellos:
http://www.automaticsitemap.com/pagerank-badge.jsp

Fran Cruz, no, en realidad sólo se puede manipular ese comando, si abre en otra pestaña u otra ventana ya es cuestión del navegador :S

Ezequiel, no es ninguna confusión, el enlace es de mi amiga María Rosa, no de Rosa la del Escaparate ;)

Pozo+10 dijo...

Muy bueno Potro!!!
No sabes si hay alguna manera de abrir en ventana emergente pero las imágenes que publico en el blog???

El Potro dijo...

Hola Pozo+10,

Puedes usar el código de este tutorial, es para abrir videos en ventanas emergentes pero igual puedes usarlo para las imágenes, sólo que en lugar de poner la URL del video pon a URL de la imagen.

Saludos.

Ascesino96 dijo...

310, apenas pasaron dos o tres días y ya tienes 10 seguidores más, veo que tu no pararás hasta ser el mejor...
Jajaja, tu blog sigue y sigue creciendo!!! Espero que dentro de 10 años, cada uno siga con sus blogs, quiero ver con ancias tu blog dentro de diez años, o por lo menos dentro de 3 o 4

Maria Rosa dijo...

Buenísimooooo Potro :) :) :)

Ahora lo hago.
Te cuento que para el PageRank tomé un truco de los chicos de La Trucoteca, Germán y Javier, que lo explican en el último post La Trucoteca - Boton de PageRank y la página que ellos dan, además de darte el PageRank, te da opciones de botones para que lo coloques en tu blog: PageRank para tu blog.
Ahora si lo que quieren es solo calcular el PageRank para saberlo, y nada más, este sitio hace eso Cálculo del PageRank pero no da botones.

Gracias por este post Potriiiiis querido. Te adoro !

Y si, mi nombre completo es Maria Rosa Golia :) Pero hubo confusión, claro, porque está El Escaparate de Rosa, pero ella se llama ROSA TORRES :)

Baci per tutti, caro mio !!!! (Besos para todos, querido mio) ;)

cyberbloggero dijo...

mmmm.... fíjate que siempre me complicaba la vida poniendo un elemento HTML y no sabía que el Gadget de imágen permitía vincular una URL...

una pregunta, sólo por curiosidad, si se quisira poner rel="nofollow", se agrega antes de target='_blank'.

Gracias maestro!!!!

Un abrazo!!!

Pozo+10 dijo...

Gracias Potro algo nuevo que aprendo.
Pero lo que yo te pregunte no fue eso, jejejeje, por ahí me exprese mal, perdón.
Yo lo que quiero saber es como hago para que una imagen que subo a blogger sin tener que cambiarle el código se abra en una nueva ventana en el buscador, no en Popup, solo cambiando algún código de la plantilla, ej. mira este post Planeta Gran DT 2010: Todos los pateadores de tiros libres y penales, yo lo que quiero es que esa imagen se abra en una nueva ventana, como ya te dije sin modificar ese código y modificando algo en la plantilla. Sabes si se puede???
Muchas gracias!!!
Abrazo!

El Potro dijo...

Ascesino96, jajaja, 10 años es muuuucho, será mejor pensar cómo serán nuestros blogs en 10 meses :)

Maria Rosa, tendrás que ponerte tu identificación en la blusa como los niños del prescolar para no olvidar el nombre completo, jajaja. Gracias por compartir la info. Te quiero mucho!

brother, pues antes o después, en ese caso el orden de los factores no altera los caprichos de Blogger :) Un abrazo!

Pozo+10, forzosamente se tiene que editar el código, puedes ver info en este post, casi al final se explica cómo hacer para que la imagen abra en otra ventana, pero no se agrega nada en la plantilla. Para eso hay un script que hace que los links se abran en otra ventana pero aplica a tooodos los enlaces del blog, no sólo imágenes. Un abrazo.

Maria Rosa dijo...

Jajajajjajjajaj Siiii

A tu comentario final: Me too. :)

Rosa dijo...

Perdón... no es Rosa Torres, sino Rosa María Torre... Torre sin ese...je,je

Un saludo a todos!!!

Pozo+10 dijo...

Muchas gracias por todo Potro!!!
Ahora si jejeje.
Abrazo compañero!

Ezequiel dijo...

aaaa, que tonto soy, mi intencion era ayudar espero no te enojes :)

un abrazo grande y disculpa de nuevo :)

Arny Joaquín dijo...

¡Hola amigo Potro!

Tremendo consejo este. En esta forma invitamos a que el visitante permanezca en nuestro blog, o se retire de él, pero a su propia elección, y no obligatoriamente. Y ya nos habías aconsejado algo similar con la lista de enlaces.

¿Y en caso de querer hacerlo con todos los enlaces que haya en el blog? Si ya publicaste sobre esa posibilidad por favor dispénsame, y regálame un enlace hacia ese post amigo mío.

¡Abrazos!

El Potro dijo...

Hola Arny Joaquín,

Aún no lo he publicado pero ya lo tengo programado. Seguro que será una mejor opción ya que el lector será quien decida cómo se abren los enlaces del sitio.

Un abrazo!

Laura dijo...

Me sale esto: No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: Element type "a" must be followed by either attribute specifications, ">" or "/>". no se porque, busco con Ctrl+F < b:if cond='data:link != ""' > y abajo esta la linea que dices lo puse y me quedo asi < a expr:href='data:link'target='_blank' >
no se me habre...

El Potro dijo...

Hola Laura,

Recuerda que antes de target='_blank' debe haber un espacio.
Inténtalo de nuevo y verás que funciona.

Saludos.

Laura dijo...

Si me funciono pero solo encontre 4 lugares donde ponerlo es decir 4 widgets y te quiero preguntar si en flash vortex por ejemplo abajo de la imagen esta la publicidad, tiene algo que ver darle click a la imagen o a la palabra publicitaria propiamente, porque cuando lo hago abandona mi pagina, pero en otro widget cuando lo hago en la imagen si habre una ventana nueva... Ah y tambien quiero saber si se puede quitar el enlace de la imagen en un post, porque no quiero que en la entrada la imagen se abra si le dan click, la quiero como en el sidebar que no se puede acceder a ella... Espero tu respuesta

El Potro dijo...

Hola Laura,

Sobre los demás gadgets no podemos manipularlos ya que están hechos en otros formatos como flash o Javascript.
Para saber cómo eliminar el enlace de la imagen sigue este enlace.

Saludos!

d-Santos dijo...

hola potro la verdad que tus post siempre me an servido

pero te vengo a molestar; lo que pasa es que kiero tener asi como un album de fotos (agrege el gadget de "IMAGEN" pero solo me deja poner una imagen)[ a lo que yo eh checado] :D   yo quisiera que me ayudaras para poner un gadget de album de fotos [ asi de ese mismo tamaño]

ah" y otra cosa lo que pasa es que vi aqui mismo como poner 2 columnas de gadgets (una en la izquierda y la otra a la derecha)

me podrias orientar en esto ;)

BUENO ESPERO CONTAR CON TU APOYO

A POR SIERTO MI BLOG ES http://asiposzi.blogspot.com

chekalo para lo del album

.....SALUDOS

d-Santos dijo...

hola de new. aki ando para decirte que ya pude hacer elk album...

sî asi es no busque bien en tu web, pero ya estoy en eso.

AHORA si no es mucha molestia me podrias orientar donde esta el articulo de crear dos columnas de gadgets

.aDIOS

SEGUIRE NAVEGANDO POR AKI

El Potro dijo...

s-Santos, por aquí en el blog hay una entrada que explica lo que querías, no sé si la hallaste. Para la sidebar de dos columnas mira la explicación de Rosa.

Lynx Empleo, me alegro que te haya servido :)

Publicar un comentario en la entrada

Gracias por tus comentarios. Si tienes una consulta sobre tu blog deja la dirección del mismo.

 

Ciudad Blogger. Copyright 2008 All Rights Reserved Revolution Two Church theme by Brian Gardner Converted into Blogger Template by Bloganol dot com

Ir arriba Ir abajo