POP UP! Abrir una ventana Emergente en Blogger

Hola compañeros blogueros, a continuación les mostrare como abrir sus propias ventanas emergentes también conocidas como pop up!, si no sabes te doy un ejemplo: como bien lo dice el nombre la ventana emergente al dar click a un enlace por ejemplo abre una nueva ventana del navegador a parte de la que ya esta abierta, esto mas que todo cuando se necesita denotar alguna información importante, función o simplemente para la comodidad del lector.

Aquí te doy un ejemplo ilustrativo de una pop up en funcionamiento

Ventanas abriendo un vídeo de youtube:

Spoken: Through It All Starset: Let It Die ATG: I fooled you

También puedes ver como ejemplo los botones sociales para compartir que tengo, le das click y despliegan las ventanas emergentes. Así, se pueden abrir todo tipo de cosas, como una imagen, otra pagina, un enlace de descarga, en fin mucha utilidades.

Mira este ejemplo abriendo un simple enlace: Abrir enlace

Puedes ver el procedimiento también en vídeo si prefieres:

No siendo mas procedamos a implementar el código, en tu entrada en el apartado HTML pega este código:

<a href="javascript:void(0);" onclick="window.open('URL que abrira',  'popup', 'top=100, left=200, width=853, height=480, toolbar=NO, resizable=NO, Location=NO, Menubar=NO,  Titlebar=No, Status=NO')" rel="nofollow">Abrir enlace</a>

Bien como vieron solo peguen ese código y cambien lo que dice abrir enlace por el texto que quieran mostrar y donde dice URL que abrirá colocan el enlace que se abrirá en la ventana emergente, también pueden cambiar los valores en color verde para cambiar el tamaño de la ventana si quieren.

Para abrir vídeos de Youtube pop up

1. Para abrir vídeos de youtube usamos este código en la parte donde dice "URL que abrirá":



http://www.youtube.com/watch_popup?v=xJtBYAKBByk



2. La parte en rojo corresponde a la ID del vídeo, cuando tengas tu vídeo copia lo que esta después del "=" y lo reemplazas en en código.

Abrir la ventana emergente con una imagen.

Ademas de esto también podemos mostrar una imagen, que al darle click abrirá la ventana emergente, miren este ejemplo:

Solo cambian en el codigo inicial lo que dice Abrir enlace por este codigo:

<img src="URL de la imagen" />