Diseño del botón de retroalimentación

Diseños del botón de opinión

El botón de opinión es similar a las pestañas de feedback y los controles deslizantes, lo que le permite hacer que los creativos accesibles respondan a diferentes tamaños de dispositivo. Este diseño hace que sea mucho más fácil añadir rápidamente botones de opinión en sus sitios web.

Botón Diseñar una opinión

Configuración del diseño del botón de opinión

Una vez que tenga acceso a esta función, el botón Comentarios estará disponible junto con otros diseños. Puede elegir crear su botón de opinión con la configuración de Opinión de sitio web guiada, o puede crear su botón de opinión por sí solo desplazándose hacia abajo hasta la sección parte por pieza.

Una vez que seleccione el botón Comentarios, tendrá la opción de nombrar su diseño.

Look& Feel

En la sección Look & Feel, puede personalizar el aspecto general del diseño de la siguiente manera:

• Posición del botón: Configure dónde debe aparecer el botón en la página web.
• Texto de botón: Especifique el texto en el botón.
• Icono de botón: seleccione el icono que desea mostrar en el botón a la izquierda de su texto.
• Color de texto: seleccione el color de su texto de botón.
• Color del botón: Seleccione el color del botón.
• Forma de botón: Configure el radio del borde del botón. Esto determina qué tan redondeadas son las esquinas.
• Utilice mi propio botón: Cargue su propia imagen para utilizarla como botón. Tiene la opción de utilizar el tamaño de imagen tal cual o cambiar su tamaño al tamaño adecuado. Si utiliza su propio botón, obtendrá un campo en el que puede introducir texto alternativo para utilizarlo con la tecnología de lectura de pantalla.
  

• Utilizar una plantilla: utilice un tema de encuesta como plantilla para la configuración de estilo del diseño. Esto importará la configuración principal de espaciado entre preguntas y colores de ese tema de encuesta.
  
  Consejo Q: La configuración del diseño se desconecta del tema utilizado como plantilla. La configuración de diseño no se actualiza si cambia el tema de la plantilla, y el cambio de la configuración de diseño no cambiará el tema de la plantilla.
• Personalizar CSS:Personalice el CSS del botón de comentarios como desee. Puede agregar clases y propiedades personalizadas además de las predeterminadas. Es posible que las modificaciones realizadas aquí no se reflejen en la vista previa; recuerda prueba su intercepción antes del despliegue completando la configuración guiada.
  Atención: El siguiente código se proporciona tal cual y requiere conocimientos de programación para su implementación. El soporte técnico de Qualtrics no ofrece asistencia o consultoría sobre codificación personalizada. En su lugar, puede preguntar a los usuarios especializados de nuestra comunidad.
  Advertencia: Si hay varios botones de comentarios en la misma página, el CSS personalizado afectará a todos los botones de la página. El CSS de la intercepción que se cargó por última vez se aplicará a todas las intercepciones de la página. Recomendamos utilizar solo 1 botón de comentarios por página cuando se utilizan CSS personalizados.

  -Haga clic aquí para ver el CSS predeterminado para los botones de comentarios-

  Si elimina los selectores o clases CSS dentro de la plantilla predefinida, no podrá actualizar ni recargar la plantilla. A continuación se muestra esta plantilla en caso de que necesite restablecer el CSS de su intercepción:
  /* Utilice las clases siguientes para anular los estilos de los botones de comentarios.
Atención: El siguiente código se proporciona tal cual
y requiere conocimientos de programación para implementarlo.
El soporte técnico de Qualtrics no ofrece asistencia o consultoría sobre codificación personalizada.
En su lugar, puede preguntar a los usuarios especializados de nuestra comunidad.
Para obtener ayuda con el código personalizado, visite https://community.qualtrics.com/custom-code-12
NOTA: Los cambios realizados aquí no se reflejarán en la vista previa.
Asegúrese de probar los cambios manualmente. */
/* Botón de comentarios de estilo del contenedor principal. Este es un contenedor que se encuentra en la parte superior de toda la pantalla y es mayoritariamente transparente y alberga el botón de comentarios */
Botón de retroalimentación QSI {
/* índice z: 1; */
/* espacio en blanco: normal !importante; */
}
/* Botón de comentarios de estilo */
Botón #QSIFeedback-btn div {
/* altura de línea: 1em !importante; */
/* margen: 0 0.5em 0 0 !importante; */
/* ancho: auto !importante; */
/* tamaño de fuente: hereda !important; */
/* peso de fuente: normal !importante; */
/* estilo de fuente: normal !importante; */
/* mostrar: en línea !importante; */
/* color: #000000 !importante; */
/* color de fondo: #136ef6 !importante */
}
/* Estilo de encuesta de contenedor iFrame. Aquí se encuentra el iFrame y aparece al hacer clic en el botón de comentarios */
#Contenedor desplegable QSIFeedbackButton.QSIFeedbackButton {
/* visualización: bloque en línea !importante; */
/* margen derecho: 5px !importante; */
}
/* Encuesta de estilos iFrame */
#QSIFeedbackButton-encuesta-iframe {
/* visualización: bloque en línea !importante; */
/* altura: 100% !importante; */
/* ancho: 100% !importante; */
}

Todas las opciones anteriores se pueden configurar por separado para controlar cómo se mostrará el botón de opinión para los navegadores web de escritorio frente a los navegadores web móviles, utilizando las pestañas web web (escritorio) o móvil.

Para la web móvil, también hay una opción para desactivar completamente este diseño, si es necesario. Seleccione No mostrar este botón en el navegador móvil para desactivarlo para dispositivos móviles.

Visualización de encuesta

En la sección de visualización Encuesta, puede controlar cómo se muestra la encuesta real cuando el usuario hace clic en el botón de opinión.

Las opciones de visualización de la encuesta para la Web (escritorio) son:

• Visualización web:
  • Botón deslizante: la encuesta se mostrará en un control deslizante que se deslizará dentro y fuera. Si ha añadido un icono para descartar el botón de opinión activado, al hacer clic en la X se descartarán tanto el botón deslizante como el botón de opinión (por ejemplo, todo el diseño desaparecerá de la pantalla).
  • Superposición: La encuesta se mostrará en una ventana incrustada. También podrá establecer el nivel de oscuridad de la superposición con el campo de fondo Fade. Si ha añadido un icono para descartar el botón de opinión activado, al hacer clic en la X se descartará la encuesta incrustada, pero seguirá viendo el botón de opinión y podrá volver a seleccionarlo, si lo desea.
  • Ventana nueva: La encuesta aparecerá en una ventana nueva.
• Tamaño de la encuesta: Controle el tamaño (altura) de la encuesta en su página en términos de porcentaje del alto de página general. Solo una opción si selecciona Botón deslizante para la visualización web.
• Añada un icono para descartar el botón de opinión: Añada la opción para que los usuarios hagan que el botón de opinión desaparezca.
• Título de Iframe: Si ha añadido un objetivo incrustado a su intercept correspondiente, añada un título que los lectores de pantalla puedan interpretar.

Las opciones de visualización de la encuesta para la web móvil son:

• Visualización web móvil:
  • Arrastrar hacia arriba: La encuesta aparecerá en una ventana desplegable que cubrirá una parte de la pantalla. Si ha añadido un icono para descartar el botón de opinión activado, al hacer clic en la X se descartará la encuesta incrustada, pero seguirá viendo el botón de opinión y podrá volver a seleccionarlo, si lo desea.
    Consejo Q: La apariencia de la ventana desplegable se puede ajustar utilizando un código personalizado que requiere conocimientos de programación para implementar. El soporte técnico de Qualtrics no ofrece asistencia o consultoría sobre codificación personalizada. En su lugar, siempre puede intentar preguntarles a los usuarios especializados de nuestra comunidad. Si desea obtener más información sobre nuestros servicios de codificación personalizada, póngase en contacto con su Account Executive de Qualtrics.
  • Nueva pestaña: La encuesta se mostrará en una nueva pestaña del navegador. Si selecciona esta opción, no tendrá la opción de añadir un título de iFrame porque, en su lugar, irá a una nueva pestaña del navegador para la encuesta.
• Título de Iframe: Si ha añadido un objetivo incrustado a su intercept correspondiente, añada un título que los lectores de pantalla puedan interpretar.

Traducciones

Añada traducciones para el texto del botón. Consulte Traducir botones de opinión y diálogos interactivos para obtener instrucciones paso a paso.

Guardar y publicar el diseño del botón de opinión

A medida que agrega cambios al diseño del botón de opinión, asegúrese de guardar su trabajo periódicamente haciendo clic en el botón Guardar en la esquina superior derecha, justo encima del área de vista previa.

Una vez que esté listo para publicar su diseño, haga clic en Publicar. Esto lo hará para que pueda enviar el diseño en vivo a su aplicación móvil.

Configuración de intercepts

Los diseños de los botones de retroalimentación se pueden utilizar con intercepts estándar. Solo tiene que asegurarse de que, cuando establezca el diseño del intercept, seleccione el diseño específico en la sección del botón Comentarios.

Cambios en el botón de opinión

Preguntas frecuentes