Crear una Poll usando un widget Versus

Invite a su audiencia a votar a través de las redes sociales por su personaje, evento o producto favorito y muestre los resultados en tiempo real.

Poll permiten hacer una pregunta de opción múltiple . Su audiencia puede elegir entre las opciones que usted predefine, lo que le permite al votante seleccionar solo una.

Creando tu Poll

Empezar

Cree los Flow s para definir el contenido social (#hashtag y / o @ handle) que desea recopilar y medir. Debe crear un Flow para cada opción.

  • Para las encuestas de Twitter , utilice el Filter transmisión pública de Twitter .
  • Para las encuestas de Facebook , utilice el Filter comentarios de Facebook .
  • Para las encuestas de Instagram , use el Filter comentarios de Instagram .


Crear una pagina

  • Ir a los isualizations V módulo y haga clic en + Agregar visualización , y seleccione Páginas web .
  • Desde la barra lateral del editor de páginas, seleccione el elemento contenedor, arrástrelo y suéltelo en la página. Haga lo mismo con el widget versus y suéltelo en el elemento contenedor.


Versus configuración de widget

Seleccione el widget haciendo clic en él y verá 2 pestañas en la barra lateral: Contenido y Configuración .

En la ficha C ontenido:

  • Utilizar el P ick Flow botón s para seleccionar el Flow es que desea añadir al widget con el fin de iniciar la visualización de datos.
  • Sube una imagen para cada opción.
  • Configure el #hashtag (el mismo que usa el flujo) y Twitter @ handle (solo para encuestas de Twitter ). Luego haga clic en Aplicar y haga lo mismo para cada Flow .

Lea nuestro artículo Opciones avanzadas para encuestas sociales para saber cómo agregar un video o una canción a su encuesta.

La pestaña Configuración se puede utilizar para configurar los siguientes ajustes:

Comportamiento

Muestra el porte C en Total de mensajes o autores único.

  • Habilite el recuento de elegidos para mostrar el número de tweets / publicaciones recopilados para cada opción de Flow . Además, te permitirá agregar la etiqueta del recuento elegido.

  • Habilite Mostrar porcentaje para mostrar el porcentaje de votos que ha recibido cada opción en relación con el total de votos.

Diseño

  • Resalte el porcentaje para mostrarlo en un tamaño más grande, de modo que su audiencia tenga una visión clara de qué opción lidera la Poll .
  • Habilite S how Flow Name para mostrar el nombre de cada opción.

Interacciones sociales

Habilite los botones de votación S how para permitir que su audiencia participe en la Poll través del widget. Tenga en cuenta que a los usuarios se les pedirá permiso para enviar sus votos a través de nuestra aplicación. También tiene la opción de editar la etiqueta del botón de votación. De forma predeterminada, viene con la etiqueta "votar", pero puede cambiarla, por ejemplo, a "Soporte".

Usar la intención de Twitter para animar a su audiencia a participar utilizando el @ [identificador] o # [hashtag] principal que está promocionando. Utilice estas variables para configurar la intención de Twitter :

  • @ [manejar], que toma la cuenta @ que configuró en la pestaña de contenido.
  • # [hashtag], que toma el #hashtag que configuró en la pestaña de contenido.
  • [nombre], que toma el nombre del Flow .
  • INGRESE URL, que puede ser reemplazada por la URL desde donde su audiencia puede participar. Además, recomendamos hacer que sus usuarios compartan la URL para una mejor participación.

Ejemplo de intención de Twitter

  • @ [manejar]: "Creo que [ nombre] ganará esta noche # [hashtag]. Haga clic para votar ENTRAR URL".
  • @ cuenta: " Creo que [nombre del Flow ] ganará esta noche #myhashtag. Haz clic para votar www.myurl.com ".

URL de la publicación de Instagram (solo disponible si la fuente de contenido y estadísticas de Instagram está habilitada)

Ingrese la URL de la publicación a la que se redirigirá a su audiencia para que vote comentando con un #hashtag o palabras clave que haya configurado en la consulta del Flow .

Después de ingresar la URL y hacer clic en Votar, verá el botón de voto de Instagram que lo llevará a la publicación para dejar un comentario para participar.

URL de la publicación de Facebook (solo disponible si la fuente de contenido y estadísticas de Facebook está habilitada)

Ingrese la URL de la publicación a la que se redirigirá a su audiencia para que vote comentando con un #hashtag o palabras clave que haya configurado en la consulta del Flow .

Después de ingresar la URL y hacer clic en Votar , verá el botón de voto de Instagram que lo llevará a la publicación para dejar un comentario para participar.

Nota: Si ingresa una URL para una publicación de Facebook y una publicación de Instagram , verá ambos botones. Por tanto, al final, tu audiencia puede optar por votar en Facebook o Instagram .

Estilo avanzado

Copie la identificación del elemento para aplicar configuraciones personalizadas al widget a través de los Editor de CSS.

Utilice las siguientes líneas de código para ampliar la fuente del porcentaje (recuerde reemplazar el ID del elemento):

id del elemento . versus . versus-v1 . métrica primaria . contracomponente {
tamaño de fuente : 3 em ;
}

Cambie el número de la propiedad de tamaño de fuente hasta que obtenga el tamaño deseado.

Usa las otras opciones de configuración para darle tu propio estilo a tu página.

Publicar

Para comenzar, haga clic en el botón Configuración de publicación ubicado en la esquina superior derecha del Editor de páginas, luego haga clic en Publicar y obtenga el script para incrustar la Poll en su sitio.

Para consultar nuestro catálogo de widgets en vivo, vaya a http://www.flowics.com/widgets-catalog/


Diseño alternativo

De forma predeterminada, las opciones de Poll se mostrarán en línea (una al lado de la otra).



Si desea cambiar este comportamiento en el escritorio (para presentar todas las opciones a la vez), puede agregar el siguiente código CSS a la página:

 @media (ancho mínimo: 768px) {

  .versus.versus-v1 .cards-container {
  envoltura flexible: envoltura; / * tarjetas apiladas en lugar de en línea * /
  }
  
  .versus.versus-v1 .flow-card {
  base flexible: 24%; / * ancho de la tarjeta * /
  margen: .5%! importante; / * margen entre tarjetas * /
  flex-grow: 0; / * mismo ancho para todas las tarjetas * /
  }
  
  .versus.versus-v1 .slider-btn {
    pantalla: ninguna; / * Ocultar control deslizante * /
  }

} 




Para ver cómo agregar CSS personalizado a su página, lea este artículo .


Was this article helpful?