Cómo incrustar y presentar la promoción en cualquier sitio web con los Widgets

La plataforma proporciona el sistema de Widgets, que permite incrustar y presentar la promoción en cualquier página web para así darle un plus de visibilidad y atraer a más usuarios. De esta forma, los Widgets se instalan en una página web y permiten a sus visitantes participar en la promoción directamente desde allí, sin tener que pasar por ninguna red social.

De esta forma, la experiencia del usuario va a ser exactamente la misma que si el usuario participara desde el enlace de la promoción que se abre en modo microsite, es decir, el usuario deberá identificarse para participar, completar el formulario de registro, votar, etc. 

Los Widgets están disponible para todas las promociones que se crean en Easypromos, independientemente de la versión que se utilice  – Básica, Premium y Marca Blanca – y funcionan para cualquier mecánica de promoción o concurso.

En este tutorial te explicamos los diferentes formatos de Widgets disponibles y cómo configurar sus diferentes opciones para una correcta visualización de la promoción integrada en tu página web.

Éstos son los contenidos del tutorial: 

 

 Acceso a los Widgets

Una vez creada tu promoción, podrás dirigirte al apartado Publicar > Widget:

2018-05-25_15-40-48.jpg

2. Aquí encontrarás todos los Widgets disponibles para integrar la promoción en tu web:

widgets_disponibles.jpg

A continuación te explicamos las características y opciones específicas de configuración para cada widget.

 

Tipos de Widgets disponibles

La plataforma proporciona 4 formatos de Widgets disponibles:

  1. Widget Incrusta tu promoción

  2. Widget Media

  3. Widget Link

  4. Widget Popup

 

1. Widget Incrusta tu promoción

Con el widget Incrusta tu promoción podrás obtener el código iframe de tu promoción para incrustarla y presentarla en una zona concreta de tu página web, blog o microsite. De esta forma, la promoción permitirá a los usuarios que visiten tu web participar directamente desde allí.

En el siguiente vídeo puedes ver una promoción que se presenta incrustada en la página web de la marca, donde podemos ver que la experiencia de participación de un usuario a través del Widget es exactamente la misma como si lo hiciera desde cualquier otro lugar.

Además, el widget "Incrusta tu promoción" presenta como principal ventaja que permite una gestión automática del alto del widget en una web externa. De esta forma, el alto del widget se adaptará automáticamente según el contenido que se esté mostrando en la promoción, ofreciendo de esta manera una visualización óptima de la promoción en cualquier dispositivo y pantalla. 

Para ello, podrás personalizar las dimensiones del Widget (ancho y alto) para ajustarlo al espacio disponible en tu página web. A continuación copia el código iframe y pégalo en tu página web. A continuación te mostramos las opciones de configuración que tienes disponibles:

widget.jpg

El widget presenta las siguientes características:

  • El widget automáticamente calculará el alto del iframe para una visualización óptima según la página de la promoción que se esté visualizando.
  • La visualización óptima implica no mostrar barra de scroll en el iframe y evitar espacios en blanco debajo de la página.
  • Los popups de información dentro de la promoción (compartir, bases legales, mis redes), se posicionan de forma óptima en la zona visible del iframe.

Nota: Hay algunas plataformas web (como WordPress) que bloquean añadir contenido vía scripts. Si experimentas problemas con tu widget, puedes utilizar de forma alternativa la versión de widget con altura no adaptable que proporcionamos. Para ello, haz clic en la siguiente opción y copia el código de incrustación:

widget4.jpg

 

2. Widget Media

Este widget permite incrustar y presentar la galería de imágenes de tu concurso en cualquier página web, blog, tienda online o microsite. El Widget Media se podrá personalizar con las siguientes opciones:

  • Dimensiones del Widget (ancho y alto) para ajustarlo al espacio disponible en tu página web.
  • Habilitar/Deshabilitar la Cabecera de Acciones. La Cabecera de Acciones es una barra que se muestra en la parte superior de la galería que incluye los botones de acción: Acceso a la página de inicio del concurso, botones de Recomendar y Compartir el concurso: widget_media2.jpg
  • Habilitar/Deshabilitar Cabecera de Controles. La Cabecera de Controles es una barra que se muestra en la parte superior de la galería que ofrece herramientas a los usuarios para filtrar por los últimos participantes, los más votados, buscar el nombre de un participante concreto: widget_media3.jpg

A continuación copia el código iframe de tu promoción y pégalo en tu página web o blog:

widget_media.jpg

Nota: Hay algunas plataformas web (como WordPress) que bloquean añadir contenido vía scripts. Si experimentas problemas con tu widget, puedes utilizar de forma alternativa la versión de widget con altura no adaptable que proporcionamos. Para ello, haz clic en la siguiente opción y copia el código de incrustación:

widget5.jpg

 

3. Widget Link

El Widget se situará como un enlace en una parte del texto. Al hacer clic en el enlace, la promoción se abrirá como una ventana modal encima de la página.

A continuación, mostramos un ejemplo de cómo se muestra el Widget Link en un un post publicado en un blog:

widget_link2.jpg

El Widget Link se podrá personalizar con las siguientes opciones:

  • Ancho y Alto: éstas serán las dimensiones que tendrá la ventana modal donde se presentará la promoción, de forma que podrás ajustarla al espacio disponible en tu página web.
  • Título. Podrás personalizar el texto de la pestaña. Escribe un título corto y que llame la atención.
  • Abrir como: Podrás decidir cómo abrir la tab a través de Ventana modal o en una nueva ventana del navegador.

A continuación copia el código iframe de tu promoción y pégalo en tu página web o blog:

widget_link.jpg 

4. Widget Popup

El Widget Popup mostrará la promoción en forma de popup encima de tu página web. Podrás controlar el tiempo de espera (cuando aparece el widget popup desde la carga de la página) y la frecuencia (con qué frecuencia aparece el widget popup a visitantes recurrentes). 

A continuación, mostramos un ejemplo de cómo se muestra el Widget Popup en un un post publicado en un blog:

El Widget Popup se podrá personalizar con las siguientes opciones:

  • Tiempo de espera: Esta opción te permite controlar cuando aparece el widget popup al acceder a la página. Puedes configurar que aparezca nada más cargar la página o establecer un tiempo de espera de entre 5 y 30 segundos.
  • Frecuencia: Esta opción permite controlar con qué frecuencia aparecerá el widget popup a visitantes recurrentes de la página.

A continuación, copia el código incrustación y pégalo en tu página web. 

 widget_popup.jpg

En la siguiente captura de pantalla mostramos un ejemplo de cómo insertar el código de incrustación en un artículo de un blog de Wordpress, en este caso, el código se introduce en un bloque de HTML:

widget_popup2.jpg

 

Opciones avanzadas de configuración

A continuación te presentamos las siguientes opciones de configuración adicionales que presentan los Widgets:

 

1. Dirigir el enlace principal de la promoción a la página web donde has incrustado el widget.

Para ello, deberás ir al apartado Publicar > Opciones del enlace, donde te aparecerá la opción "Destino del enlace principal de la promoción", donde podrás seleccionar la opción "Sitio web donde está instalado el widget", que te permitirá introducir la URL donde has incrustado el código iframe del widget de la promoción:

widget_4.jpg

De esta forma, al abrir el enlace principal de la promoción, el sistema redirigirá el usuario a la página web donde has incrustado el Widget.

 

2. Parámetros GET [opción disponible en el Widget Incrusta tu promoción y en el Widget Media].

Esta opción permite añadir parámetros personalizados GET a la llamada de la promoción.

gets:"micro=1&utm_source= widget&utm_medium=embed", max_height:"100%",

Puedes utilitzar este parámetro para personalizar tus parámetros UTM o bien para forzar la visualización del idioma del widget con el parámetro GET "lc". Por ejemplo, en la siguiente captura de pantalla mostramos cómo utilizar el parámetro utm_medium=embed&lc=eng para forzar la visualización del idioma de la promoción al inglés: 

widget_2.jpg

📌  Puedes obtener los códigos de idioma desde la página de gestión de la promoción, haciendo clic en la ventana "Opciones":

widget_3.jpg

 

3. Parámetro MAX-HEIGHT [opción disponible en el Widget Incrusta tu promoción y en el Widget Media].

Esta opción permite definir el alto máximo que se permite del widget. Si el contenido de la promoción supera este alto, el sistema añadir barras de scroll al widget.

¿Tiene más preguntas? Enviar una solicitud

4 Comentarios

  • 0
    Avatar
    Armand Zoroa

    Hola. Al llevar a cabo el proceso de participación dentro del widget, al usuario se le pide también que es necesario que sea fan de la página de Facebook o es un proceso diferente? Gracias.

  • 0
    Avatar
    Carles Bonfill

    Hola Armand,

     

    todo el proceso que sucede dentro del Widget, es exactamente el mismo que sucede cuando estás dentro de la página de Facebook. Es decir, que también se le pedirá los permisos de Facebook, que se haga fan de la página, le aparecerá las mismas opciones de invitar/compartir, etc... El funcionamiento es exactamente el mismo, pero dentro de tu página, y con el diseño adaptado a las dimensiones del widget.

    ¡Muchas gracias!

  • 0
    Avatar
    Paula dos Santos

    Hola! justamente por esto quería consultar! Quería "incrustar" una pagina con el sorteo en mi página web,que cdo lleguen a mi página, lo primero que abra es el sorteo.. (vi las dos posibilidades así o con una pestaña al costado)... llegué hasta los códigos..todo bárbaro, pero no sé donde pegarlos! :( perdón mi ignorancia pero soy nueva en esto. de paso quería felicitarlos por la aplicación! es la primer vez q la uso! 

  • 0
    Avatar
    Carles Bonfill

    Buenas tardes Paula,

    Para integrar la promoción en tu página web, deberás copiar/pegar el código iframe que te proporciona el Widget, y dependerá de la página web deberás incluirlo en una sección u otra de tu web. Te recomendamos que te pongas en contacto con el webmaster de tu página web, él sabrá cómo integrar el widget pestaña en la página.

    Si tienes cualquier otra duda puedes abrir un tíquet de soporte y te ayudaremos.

    ¡Muchas gracias!

Inicie sesión para dejar un comentario.