¡Pon un popup en tu vida! Plugin para wordpress

plugin popup wordpress itro

Estaba yo buscando e investigando un poquito sobre plugins para crear Pop Ups con formulario para newsletter en WordPress y al final he dado con uno que cumple todos mis requisitos.

La cuestión es que muchas veces necesitamos incluir en nuestra web un mensaje informativo para los usuarios y la verdad es que crear un Pop Up es la manera más llamativa y efectiva de hacerlo. Eso sí, hay que configurar muy bien sus opciones para que al final no sea una molestia para el usuario sino todo lo contrario.

Plugin para WordPress: I.T.RO. Popup

El plugin ITRO Popup es gratuito y tiene también una versión premium que en mi caso no ha hecho falta. Con este plugin puedes crear un pop up en tu web en wordpress e incluir el HTML que quieras en él. Puedes introducir shortcodes, imágenes y formularios de Mailchimp (que es lo que yo buscaba).

Sólo hay que instalarlo en tu web en wordpress como cualquier otro plugin (o bien búscandolo desde el panel de plugins de wordpress dentro de tu web o bien descargándolo aquí y subiéndolo a tu web).

Cómo configurar el plugin ITRO Popup

Es muy fácil aunque yo he trasteado un poco con prueba-error para ver el funcionamiento de las opciones de configuración. También tienen una página de ayuda en inglés con algunos tutoriales para configurar el plugin.

Vamos a empezar por la parte más fácil:

Cómo crear el mensaje que queremos que aparezca en nuestro Popup

Nos aparecerá a la derecha de nuestra pantalla o en la parte inferior (dependiendo del tamaño de tu monitor) una ventana como la que vemos aquí en la imagen:

itro pop up plugin wordpress

Como ves se trata de un editor de texto visual donde puedes teclear el texto, introducir imágenes, estilos, enlaces o HTML (en el modo texto) igual que en cualquier otra página o entrada de tu web en wordpress. En este sentido no tiene más misterio.

Por otro lado tenemos que configurar las demás opciones un poco más técnicas del plugin.

Cómo configurar las opciones generales de ITRO Popup

Os voy a poner el ejemplo de cómo lo he configurado yo pero lo mejor es ver lo que os conviene en cada caso particular.

Aquí tenéis un pantallazo de los ajustes pero os voy a ir detallando cada parte paso a paso:
itro pop up plugin wordpress

  • Para empezar tienes que tener activada la opción “SHOW ADVANCED SETTINGS
  • DECIDE WHERE POPUP WILL BE DISPLAYED“: Esta opción nos deja seleccionar las páginas donde no queremos que aparezca nuestro popup. Como recomendación yo lo quitaría de páginas como: Aviso legal, Gracias, Contacto, newsletter (en el caso de que en el popup ya tenga un mensaje para suscribirse)…

 

GENERAL SETTINGS (Ajustes generales):

  • Yo he activado la opción para que no esté habilitado en móviles porque creo que puede ser molesto en pantallas pequeñas (Disable on mobile device).
  • Popup seconds: El tiempo que el mensaje está en pantalla antes de que desaparezca. He dejado 20 segundos pero podéis ponerle más para que no se desvanezca antes de que el usuario se ponga a escribir. Lo he comprobado, aunque escribamos en los campos del formulario la cuenta atrás sigue activa.
  • Popup delay: Es el tiempo que tarda en aparecer el popup en la pantalla. Yo he dejado 2 segundos para que no aparezca nada más entrar en la web.
  • Next visualization (hours): El tiempo que tardará en volverle a aparecer al usuario. Yo he hecho un cálculo para 14 días (336 horas). Si lo ponemos cada día puede ser muy molesto. Ajústalo según tus preferencias.
  • Show countdown: Lo he desactivado, no me gusta que aparezca una cuenta atrás en el mensaje. Creo que es molesto y distrae.

 

POPUP ASPECT (Aspecto del popup):

  • Popup width: En mi caso 700px. Puedes ponerlo también con %. Es cuestión de adaptar el ancho del popup según cómo queramos que se vea.
  • Popup height: La altura del popup. Yo lo he dejado en modo auto. Así no corta el contenido de éste si ponemos un alto fijo.
  • Después podemos ajustar el color del fondo, color del borde, radio del popup (redondez de las esquinas) y grosor del borde.
  • Popup padding(px): El padding es el hueco que queda entre el borde y el contenido del popup. Digamos que sería como una especie de margen interno del contenedor del texto o imagen del popup. Con 20-30px creo que queda bien. Es mejor ponerle algo porque por defecto no tiene padding y para que no quede pegado el texto al borde.
  • BACKGROUND IMAGE: Podemos añadir una imagen de fondo también.
  • Popup position: Esto es importante. Por defecto viene como “fixed”. Yo lo he cambiado a “Absolute” para poder hacer scroll. De lo contrario si el popup no cabe en la pantalla del ordenador porque es más alto, entonces no se podrá hacer scroll para ver el contenido completo.
  • Popup top margin(px): He tenido que añadir margen superior porque sino no se visualizaba la “x” para cerrar el popup y puede ser algo molesto para el usuario. Si no encuentra cómo cerrarlo puede que directamente cierre pa página y salga de tu web.
  • Después tenemos opciones para la opacidad y color del fondo: Aplicará na capa opaca semitransparente a la página que aparezca de fondo sobre la que aparecerá el popup.
  • Close cross: Nos deja elegir 3 opciones de color para la “x” de cerrar ventana.

Age restriction settings (Ajustes para restricción por edad)

En mi caso tengo un contenido apto para todos los públicos pero si tu página tiene contenido con restricciones por edad entonces debes añadir un popup como este donde el usuario tenga que validar que cumple con los requisitos y si no es así no podrá acceder a la página.

popup restriccion edad wordpress

Y esto es todo lo que os puedo contar de este plugin. A mi desde luego me parece que está muy bien y es muy versátil porque nos da muchas opciones para configurar el aspecto y el contenido del popup pudiendo añadir HTML y código propio e incluso formularios de Mailchimp que es lo que yo andaba buscando.

¿Tú qué plugins para popup utilizas? ¿Alguno que mejore el presente?

Deja tu comentario abajo y responderé encantada.

Lauralofer

About Lauralofer

Soy Laura López y ayudo a diseñadores freelance y agencias creativas a conseguir mejores clientes y aumentar sus tarifas. Amante de los gatos. :) Si vendes servicios de diseño y quieres evolucionar en tu negocio apúntate a mi newsletter y accederás a mi charla gratuita "Atrae clientes online que contraten tus servicios de diseño sin regatear"

27 Comentarios

  • Carmen dice:

    ¡Hola Laura! Gracias por la recomendación y por el tutorial, me lo apunto para probarlo 🙂

    Nosotros usamos mucho uno que se llama Popupally y la verdad es que funciona muy bien también y tiene casi todas las características que comentas del Itro. Por si quieres echarle un vistazo: https://wordpress.org/plugins/popupally/

    Un abrazo!

    • Lauralofer Lauralofer dice:

      Hola Carmen!
      Sí, he leído vuestro post y está muy bien! Popupally fue mi primera opción pero la descarté porque no me permitía meter el formulario de mailchimp a medida que tengo pero sé que se utiliza bastante. ¡Gracias!

      • Alejandro dice:

        Laura, me encantó esta web, la encontré googleando y la vedad que ya la añado a mis favoritos. Yo estaba buscando un pop up para el home pero que no aparezca cada vez que el cliente entra el home, sino solo una vez, y si lo cierra ya no le vuelva a aparecer. Vi en otros sitios que en algunos casos aparece una casilla donde dice ” haga clic aquí para que este popup no vuelva a aparecer”… ¿alguno de estos dos plugin tiene esta opción? Sino, bueno… utilizaría la opción de los dias sin aparecer que también es muy buena…

        • Lauralofer Lauralofer dice:

          ¡Hola Alejandro! Muchas gracias por pasar por aquí, espero que siga aportándote información de tu interés 🙂
          En principio este plugin (que es el que yo uso) no tiene la opción de marcar una casilla para que no aparezca como tú comentas, en su lugar está la opción de configurar su periodicidad. Existe sino otro bastante conocido que se llama “Popupally” pero cuando yo lo probé, me suena que tenía las mismas características que este en ese sentido. Siento no poder ayudarte recomendándote otro plugin que sí tenga esa opción porque por el momento estos 2 son los que a mi me han funcionado. Espero que te sirva y si encuentras una opción mejor no dudes en avisarme! Un saludo

  • Amaury Ga dice:

    Gracias por compartir este recurso, yo estaba buscando algo similar, lo probaré y luego te cuento.

  • elena dice:

    Genial , gracias pero …¿como has hecho la configuracion para MAILCHIMP?
    1 saludo

    • Lauralofer Lauralofer dice:

      Hola Elena

      El plugin del popup permite introducir el texto o código que quieras en la caja del editor de texto, como cualquier cuando escribes un post o una página. Para mailchimp yo lo he maquetado en HTML y utilizo un plugin de pago que se llama Mailchimp for WP. Espero que te sirva.

      ¡Un abrazo!

  • Hola Laura, voy a probar ese plugin. Yo uso Popups – WordPress Popup. Es gratis y funciona con mailchimp y los shortcodes [mc4wp] aunque el formulario queda raro poque al darle al botón no se cierra la ventana. Probaré el que comentas.
    Por cierto, mailchimp for WP tiene la versión Lite que es suficiente, excepto lo de Ajax no?
    Bueno post!

    • Lauralofer Lauralofer dice:

      Hola David
      Yo tengo la versión de pago de Mailchimp for WP para poder tener varios formularios y más flexibilidad con los estilos (por ejemplo en formulario en horizontal de la home). El lite se me quedaba corto para lo que yo necesitaba. De momento sigo con este plugin de Pop Up pero seguramente pronto pasaré a Leadpages para otros temas y viene con opciones de pop up también. Un abrazo!

  • Jaime dice:

    Hola Laura:
    gracias por tu post. He llegado aquí buscando cómo publicar el pop up, no veo ningún botón donde una vez hehcos los ajustes pueda publicarlo, sólo lo puedo ver en el modo ‘preview’.
    ¿Cómo se activa para que se vea en la web?
    Gracias

    • Lauralofer Lauralofer dice:

      ¡Hola! Deberías tener un botón de “guardar cambios” pero no te puedo hablar ya con conocimiento de causa porque he empezado a utilizar leadpages.net para los popups y otros temas…
      ¡Un abrazo!

  • Solo Gracias!!! la explicacion clarisima. Me ayudo mucho

  • Sergio dice:

    Hola Laura, todavía sigues con este plugin que recomiendas?

    En tu página principal, abajo de todo, he visto el botón que tienes de ¡Me apunto! dónde se abre un popup. Me he descargado el I.T.RO. Popup Plugin y no veo esta opción, con cuál lo haces?

    Saludos y gracias por el post.
    Sergio

  • Hola Me gustaria saber que plugins pueden recomendarme que haga la misma funcion de los PopUp pero la cuestion esta en que necesito crear 30 pop-up que funcionaran solo si le doy clic a un boton o imagen

  • Nidia dice:

    Hola Laura, gracias por tus consejos. Necesitaría hacerte una consulta: cómo hiciste para desactivar el countdown que muestran los popup del itro?, que creo que es bastante molesto visualmente. Gracias.

  • Nidia dice:

    Muchas Gracias por tu respuesta Laura. Gracias por la información.

  • luna dice:

    Hola, quisiera hacerte una consulta, yo tengo descargado el pop up builder, y el problema que tengo con este plugins es que al visualizar la pagina web por celular, el popup sale en tamaño original como si lo estuviera viendo desde un PC, y queria saber si el plugins que indicas se puede configurar de tal forma que al ingresar la pagina desde un celular, el pop up se adapte al tamaño de pantalla del celular y se pueda disntiguir.
    espero tu ayuda
    gracias

    • Lauralofer Lauralofer dice:

      Hola Luna

      La verdad es que ya no utilizo el plugin de este artículo porque me he cambiado a Thriveleads que te permite configurar todo a medida y es mucho más versátil (es de pago).

      Un abrazo