Mil Trucos Blogger

Ventanas PopUp en tu blog

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

Pop Up es una ventaja emergente que se abre mostrando algún mensaje,y aquí es donde radica su importancia ya que si pones una imagen para que se abra en un PopUp en lugar de ponerla en el blog tu entrada cargara visiblemente mas rápido.

En la siguiente imagen puedes ver un ejemplo de PopUp


Para agregar esta característica a tu blog ve a  Edición de HTML y antes de </head> pega lo siguiente:

<!-- script pop up -->
<script LANGUAGE='JavaScript'>
function popUp(URL) {
day = new Date();
id = day.getTime();
eval(&quot;page&quot; + id + &quot; = window.open(URL, &#39;&quot; + id + &quot;&#39;, &#39;toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=600,height=400,left = 212,top = 184&#39;);&quot;);
}
</script>
<!-- fin script -->

Puedes cambiar estos valores si quieres mostrar lo siguiente:

Toolbar (barra de herramientas)
Scrollbars (barras de desplazamiento)
Location (barra de direcciones)
Statusbar (barra de estado)
Menubar (barra de menú)
Resizable (modificar tamaño de la ventana)

Solo cambia el 0 por 1 en alguno de los campos anteriores si lo quieres agregar. El tamaño de la ventana (PopUp) lo puedes cambiar donde dice width (ancho) y height (alto).

Ahora en la Edición HTML de una entrada o en un elemento HTML/Javascript añade lo siguiente:

 <a href="javascript:popUp('URL del documento')">Abrir ventana PopUp</a>

Solo cambia URL del documento por la URL de la imagen,documento o pagina que se vaya abrir en el PopUp.

También puedes poner un boton como el siguiente.
 <form>
<input type=button value="Abrir ventana PopUp" onClick="javascript:popUp('URL del documento')">
</form>

O también puedes agregar una imagen.  

Click para abrir el regalo

Como vez es un truco muy fácil de agregar que le ahorrara tiempo de carga al blog.

0
Shares

Relacionados...

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

11 Comentarios

  1. Diciembre 25, 2011    

    Una pregunta juvinao, con respecto al tiempo de carga, la caja de facebook deslizante me quita tiempo de carga?, que es mas aconsejable:

    ¿poner la caja deslizante o tener la normalmente?
    gracias juvinao

  2. Diciembre 25, 2011    

    Chiknaui.Mikistli Joel Molina Reyes te recomiendo poner la caja de facebook normal porque al tenerla deslizante se agregan al blog librerias jQuery que retrazan la carga del blog considerablemente.

  3. Diciembre 26, 2011    

    gracias por el consejo, estuve apunto de poner, el de twitter, facebok, blogger, google plus y youtube, jajajajajjajaja

  4. Diciembre 26, 2011    

    Chiknaui.Mikistli Joel Molina Reyes menos mal no lo pusistes eso hubiera hecho que tu blog perdiera muchos lectores.

  5. Diciembre 27, 2011    

    Muy bueno, a mí me servirá para posts especiales!! Saludos y felices fiestas!!!! =)

  6. Diciembre 27, 2011    

    Merlina que bueno que te haya servido el tutorial,gracias por comentar. 😉

  7. Abril 22, 2012    

    Quiero que abra la ventana pero que abra con un reproductor de musica en ves de una imagen, se puede?

  8. Mayo 7, 2012    

    hola, me gustaria saber que hay que hacer para que la ventana aparezca directamente sin tener que darle a ningun boton?.
    Gracias por el truco y espero esta info.

  9. Febrero 24, 2013    

    Hola como estas, mi pregunta es como generar una ventana popup como esta pero usarla de esta forma, que en lugar de abrir con un enlace lo que uno quiere mostrar en lugar de eso colocar un documento HTML por ejemplo poner ahi un embed html de un video y asi cuando se abra la venta se pueda reproducir el video no ce si me explico pero sera que es posible hacer eso con este codigo o con otro? esperare tu respuesta

  10. Noviembre 2, 2013    

    ovio mientras menos contenido mas rapido la carga
    y si lo se para que contesto con 2 años de retraso :3
    mejor tarde que nunca

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo