company logo

Centro de ayuda

Ir a Onde.Light
Terms & ConditionsPrivacy policy
Todos los apartadosAplicación webCómo usar el creador de widgets web de Onde

Cómo usar el creador de widgets web de Onde

Descubra cómo funciona el widget de reservas web y aprenda a usar el creador de widgets de Onde.

La aplicación web de Onde permite a sus clientes hacer pedidos desde el navegador sin descargar nada en el teléfono. Con un widget de pedidos web, puede integrar la misma experiencia de pedido directamente en su sitio web. 

Abrir el creador de widgets

Nuestro creador de widgets le permite crear un widget personalizado vinculado a su aplicación web. 

Para acceder al creador de widgets, tome la URL predeterminada de su aplicación web y añada /widget/builder/?lang=es/ a continuación. Por ejemplo, si usamos la URL de la aplicación web en modo de demostración, el enlace tendrá este aspecto: https://demo.ondelight.app/widget/builder/?lang=es/

También puedes ir a My hub → Aplicaciones & servicios → Aplicación web y pulsar el botón «Personalizar tu widget».

La página del creador de widgets está dividida en dos secciones:

  1. Menú lateral con opciones de configuración a la izquierda

  2. Vista de la aplicación web a la derecha

Personalizar su widget

Familiarícese con las opciones de configuración y cree su propio widget web. Tenga en cuenta que cada detalle que especifique en el menú lateral se reflejará instantáneamente en el widget de la derecha.

1. Tipo de app web

Según el servicio que ofrezca, elija el tipo de aplicación web de la lista:

  • Regular (para servicios de viaje)

  • Entregas (para servicios de reparto)

  • Bajo demanda (para servicios sin dirección de entrega)

El Constructor de widget muestra el selector «Tipo de app web» desplegado, resaltando las opciones Regular, Entregar y Bajo demanda. Visible: Constructor de widget, Tipo de app web, Regular, Entregar, Bajo demanda, Escritorio.
  1. Idioma

Especifique el idioma en el que desea que se muestre el widget a los visitantes de su sitio web. Puede ser el idioma del navegador del visitante (determinado automáticamente) o cualquiera de los idiomas disponibles en la lista desplegable.

  1. Título del widget 

 Edite el título predeterminado «Ordenar ahora» según sus preferencias.

  1. Altura del widget (px)

Especifique la altura deseada del widget.

La altura predeterminada mínima está establecida en 450px. Esto permite dejar suficiente espacio para las sugerencias de direcciones cuando el cliente introduce los lugares de recogida y destino.

En cuanto al ancho, el widget está diseñado para ocupar todo el ancho disponible en el espacio donde lo inserte. Puede ajustar este parámetro en su propia página web. Le recomendamos que mantenga el widget a ancho completo. 

  1. Ubicaciones de recogida y entrega prellenadas (opcional) 

En algunos casos, tiene sentido rellenar previamente la ubicación de recogida o entrega para sus clientes. 

Por ejemplo, una empresa de traslados al aeropuerto podría establecer el aeropuerto como ubicación de recogida permanente. Por otro lado, una empresa de eventos podría querer simplificar las reservas para los asistentes rellenando previamente el lugar de destino.

  1. Mensaje promocional (opcional) 

Añada un mensaje promocional llamativo para captar la atención de sus clientes. 

Spanish widget editor preview for the desktop “Ordenar ahora” screen; pink boxes highlight the promotional message field and its placement below “Ver precios.”. Visible: Escritorio, Tableta, Móvil, Ordenar ahora, Altura del widget (px), Ubicación de recogida prellenada.
  1. Imagen

Seleccione una de las imágenes disponibles para representar su servicio en el widget. 

También puede pegar un enlace directo a su propia imagen personalizada en el campo URL de imagen personalizada. La imagen debe estar alojada en un sitio web externo y ser de acceso público, sin necesidad de iniciar sesión.

Si el enlace que pega es correcto, verá su imagen personalizada en la vista previa de la derecha, recortada para que encaje junto al formulario. 

El editor de la página de reserva en Escritorio muestra la sección Imagen resaltada, con miniaturas y un campo de URL; la vista previa muestra un taxi amarillo. Visible: Escritorio, Imagen, URL de imagen personalizada, Ingresa aquí la URL de tu imagen, Ordenar ahora, Ubicación de recogida.

Configuración de los enlaces de la aplicación y las opciones de visualización

  • Interruptor: «Mostrar enlaces de descarga para la app del cliente»

Active este interruptor solo si tiene una aplicación Onde para clientes. Aparecerán algunos ajustes adicionales.

Website landing-page editor with the customer app download links setting enabled and its QR-code download banner highlighted in the desktop preview. Visible: Precios claros - sin sorpresas, Imagen, URL de imagen personalizada, Mostrar enlaces de descarga para la app del cliente, Título de descarga d

a. Título de descarga de la app

Puede sustituir el título predeterminado «Aún mejor en la aplicación» por uno personalizado para animar a sus usuarios a descargar la aplicación. 

b. Enlace de App Store y enlace de Google Play 

Introduzca los enlaces de App Store y Google Play en los campos correspondientes. Verá aparecer un código QR en la vista previa de la derecha. Este código QR dirigirá automáticamente a sus clientes de escritorio a la tienda correspondiente a su dispositivo.

Tenga en cuenta que, en tabletas y teléfonos inteligentes, sus clientes verán un botón en lugar de un código QR.

  • Interruptor: «Mi sitio web necesita sandboxing»

El aislamiento limita lo que el contenido integrado puede hacer en su sitio web. Seleccione esta opción solo si el administrador de su sitio web lo requiere.

Al activar el interruptor, el creador de widgets añadirá los permisos necesarios al código de inserción de su widget. No los modifique para evitar problemas con funciones como el acceso a la ubicación y la visualización de precios.

  • Interruptor: «Abrir la app web en una pestaña nueva»

Active esta opción si desea que la aplicación web se abra en una pestaña nueva del navegador.

Últimas comprobaciones

Ahora que ha configurado su widget personalizado, puede comprobar cómo lo verán sus clientes. Cambie entre las pestañas Escritorio, Tableta y Móvil en la parte superior de la sección de vista previa para visualizar cómo se muestra en un dispositivo concreto. 

Desktop preview of a Spanish ride-booking website with pickup and destination fields beside a yellow taxi; the magenta outline highlights the device preview tabs. Visible: Escritorio, Tableta, Móvil, your-website.com, Ordenar ahora, Ubicación de recogida.

Si está conforme con la configuración y la visualización, pulse el botón Obtener código de inserción.

Editor en español con vista previa de escritorio de una página de reservas; un recuadro magenta señala el botón «Obtener código de inserción». Visible: Precios claros - sin sorpresas, Imagen, URL de imagen personalizada, Mostrar enlaces de descarga para la app del cliente, Título de descarga de la a

Aparecerá una ventana emergente. Antes de continuar, revise la configuración de la Política de Seguridad de Contenido y los Términos de uso.

La sección de la Política de Seguridad de Contenido contiene un fragmento de código independiente para los sitios web que utilizan dicha política. Si este es su caso, pida al administrador de su sitio web que añada el dominio del widget a la política. De lo contrario, es posible que el widget aparezca como un espacio vacío.

Use el botón Copiar código de esta sección para copiar el fragmento de código. Al actualizar la política, asegúrese de conservar los dominios que ya estén permitidos.

The “Obtener código de inserción” modal overlays a website widget setup screen, with a magenta outline around three collapsed help sections. Visible: Obtener código de inserción, Copiar código, Configuración de la Política de Seguridad de Contenido, Términos de uso del widget, ¿Necesitas ayuda con e

A continuación, despliegue la sección Términos de uso del widget para revisar las condiciones y saber cómo funcionará el widget en su sitio web.

”¿Necesitas ayuda con el widget?” La sección ofrece respuestas a las preguntas frecuentes y redirige a [email protected] si tiene alguna otra consulta.

Cuando esté listo, pulse el botón principal
Copiar código para copiar el código de inserción generado. Puede añadir este código a su sitio web o compartirlo con el administrador de su sitio web. 

¡Buen trabajo! Ahora puede disfrutar del diseño moderno y la eficiencia del widget personalizado, que se integra perfectamente con su sitio web.

Notas adicionales

  • ¿Necesita varios widgets? Puede crear widgets independientes para distintos sitios web o tipos de servicio (por ejemplo, un widget para un servicio regular y otro para un servicio bajo demanda). Cada widget tiene su propio código de inserción.

  • ¿Ha actualizado la configuración en el creador de widgets? Recuerde sustituir el código de inserción existente en su sitio web por el nuevo para aplicar los cambios.


¿Te ha ayudado esta respuesta?
😞
😐
😁