Cómo crear un widget

Descripción general

El widget de reservas de TicketingHub es una herramienta JavaScript que se integra en los sitios web y permite a los clientes reservar productos directamente. Puede crearlo en el panel de control, configurarlo sección por sección y pegar un pequeño fragmento de código en su sitio.

Navegadores compatibles

Safari 16.4 o posterior, Chrome 111 o posterior y Firefox 128 o posterior.

En el panel de control, vaya a Widgets
Haga clic en Nuevo widget
Asigne un nombre al widget, seleccione los productos que debe vender y haga clic en Crear widget

Accederá a la página de configuración del widget, donde se configura todo lo demás. En el lado izquierdo se encuentran los ajustes, agrupados por secciones; en el lado derecho se muestra una vista previa en directo del widget, que se actualiza a medida que realiza cambios.

Qué vende

Seleccione los productos, paquetes y tarjetas regalo que ofrece el widget, incluya extras —todos o solo una selección específica— y decida si los clientes pueden comprar los productos como bonos regalo o canjear bonos regalo en el widget.

Flujo de reserva

Elija cómo avanzan los clientes por el widget: Entradas primero (seleccionan las entradas y después una fecha y una hora), Evento primero (consultan un calendario y después eligen qué reservar) o Solo canje de bonos. También puede establecer la vista predeterminada del calendario y pedir a los clientes que escriban su correo electrónico dos veces para evitar errores tipográficos.

Reglas de venta

Controle cuándo y qué vende el widget: la fecha y hora en que comienza la venta, la fecha en la que se abre el calendario, cuándo se muestra la capacidad restante de una franja horaria y las divisas con las que pueden pagar los clientes. Si la primera semana o el primer mes que muestra el calendario no tiene nada disponible para reservar, el calendario avanza y se abre en la primera fecha que sí tiene disponibilidad.

Apariencia

Añada CSS personalizado para ajustar el aspecto del widget y adaptarlo a su marca.

Analítica

Conecte Google Analytics o Google Tag Manager para realizar un seguimiento del uso que hacen los visitantes de su widget.

Opciones avanzadas

Envíe a los clientes a la página que elija después de la compra y establezca el parámetro de URL que utilizan sus distribuidores para atribuirles sus reservas.

Vista previa, publicación y despliegue

Los cambios que realice se aplican a una vista previa en directo como borrador: haga clic en Actualizar vista previa para verlos a la derecha sin afectar a su widget activo. Cuando esté conforme, haga clic en Publicar para hacerlos efectivos o en Cancelar para descartar el borrador.

Para colocar el widget en su sitio web, abra Instrucciones de instalación: copie la etiqueta de script en su página y, después, elija entre el widget Integrado (aparece directamente en el contenido de la página) y el widget Modal/ventana emergente (se abre en una superposición al hacer clic en un botón), y pegue el fragmento correspondiente.

Cuando un cliente pasa al siguiente paso, el widget vuelve a desplazar la página hasta la parte superior del formulario de reserva, de modo que un cliente que haya bajado por una lista larga de entradas no aparezca a mitad del paso siguiente. Si ha colocado el widget dentro de un panel propio que permite desplazarse, se moverá ese panel, y la página solo se moverá también cuando el propio panel haya dejado de estar visible. El widget hace esto cuando la parte superior del formulario ha dejado de estar visible y cuando el formulario sobresale por la parte inferior de la pantalla, siempre que quede espacio suficiente por encima. Si el formulario ya cabe en la pantalla, permanece donde está, y el widget deja espacio para un encabezado fijado en la parte superior de la página.

Si esto no se adapta a su diseño, evite que la página se mueva añadiendo "scrollOnStepChange": false al código del widget que ha pegado:

<div id="embed_widget" data-th-embed data-th-config='{"widgetId":"YOUR-WIDGET-ID","scrollOnStepChange":false}'></div>

Si el encabezado se oculta cuando los visitantes se desplazan hacia abajo y vuelve a aparecer cuando se desplazan hacia arriba, el widget no puede medirlo y la parte superior del formulario puede quedar detrás de él. En lugar de desactivar el desplazamiento, indique al widget la altura del encabezado en píxeles:

<div id="embed_widget" data-th-embed data-th-config='{"widgetId":"YOUR-WIDGET-ID","scrollOffset":80}'></div>

Si utiliza el editor de widgets clásicos, puede duplicar un widget en lugar de volver a crearlo:

Vaya a Widgets
Seleccione un widget existente
Haga clic en Clonar
Elija el canal de destino y confirme la selección

Personalice el widget clonado, publíquelo y copie el código en su sitio.