Es una ajetreada noche de viernes en tu restaurante. El teléfono no para de sonar con órdenes de comida para llevar, y tu personal tiene que hacer malabares entre los clientes presenciales y las órdenes por Internet. En medio del caos, un cliente potencial visita tu sitio web, buscando ordenar. Recorren tu menú, pero luego... no encuentran una forma fácil de ordenar. Frustrados, cierran la pestaña y piden a un competidor.
Ahora imagina un escenario diferente: Ese mismo cliente visita tu sitio web e inmediatamente ve un botón destacado de «Ordenar ahora». Al hacer clic, ordenan sin problemas y tu cocina lo recibe al instante. Ese es el poder del botón inteligente «Ordenar ahora». Según una prueba de datos de botones inteligentes para órdenes en línea realizada en el primer trimestre de 2022 y una prueba de datos de widgets bajo demanda realizada en el cuarto trimestre de 2023, añadir formas muy visibles para que los clientes ordenen, como este botón, puede ayudar a aumentar las ventas entre un 15 % y un 30 %.
¿Qué es el botón inteligente «Ordenar ahora»?
El botón inteligente «Ordenar ahora» permite a los clientes encontrar la forma de ordenar en línea desde el momento en que llegan a tu página de inicio, en lugar de tener que buscarlo en tu sitio web.
¿Cómo instalo el botón inteligente «Ordenar ahora»?
Sigue estos pasos para instalar el botón inteligente «Ordenar ahora» en tu sitio web:
Ubica el lugar adecuado en el código de tu sitio web: Busca el final de la etiqueta <head> o el principio de la etiqueta <body> en el HTML de tu sitio web.
Copia y pega el código JavaScript: Inserta el siguiente fragmento de código:
<script>
(function(e, t, r, n) {
var o, c, s;
o = e.document, c = t.children[0], s = o.createElement("script"), e.StorefrontSDKObject = "StorefrontSDK", e[e.StorefrontSDKObject] = {
executeCommand: function(t, r) {
e[e.StorefrontSDKObject].buffer.push([t, r])
},
buffer: []
}, s.async = 1, s.src ='https://web-apps.cdn4dd.com/webapps/sdk-storefront/latest/sdk.js' , t.insertBefore(s, c)
})(window, document.head);
StorefrontSDK.executeCommand('renderFloatingButton', {
businessId: 1234,
businessSlug: 'MerchantName',
floatingBar: true,
position: 'bottom',
buttonAlignment: 'center',
backgroundColor: 'transparent',
buttonBackgroundColor: '#D92128',
borderColor: 'transparent',
buttonText: 'Order Pickup & Delivery',
showModal: true
}
)
</script>
Personaliza el código: Como mínimo requerido, debes reemplazar los campos «businessId» con tu ID único de tienda DoorDash y «businessSlug» con tu información única. Nota: puedes encontrar tu businessId de DoorDash único haciendo referencia a los últimos dígitos de la URL de Ordenar en línea dentro de la pestaña Ordenar en línea del Portal de tiendas.
¿Cómo puedo personalizar mi botón inteligente «ordenar ahora»?
Si estás familiarizado con JavaScript, puedes adaptar el botón inteligente «Ordenar ahora» al estilo de tu sitio web. Estas son las opciones de personalización disponibles:
businessId: Tu ID de tienda DoorDash (cadena numérica) - Este es el único campo obligatorio.
businessSlug: El nombre de tu negocio para la URL generada (cadena alfanumérica, evitar caracteres especiales excepto guiones o guiones bajos)
buttonAlignment: Posición horizontal del botón («izquierda» «centro» o «derecha»).
position: Posición vertical del botón («arriba» o «abajo»)
buttonBackgroundColor: Color del botón (cualquier valor de color CSS válido)
buttonTextColor: Color de texto del botón (cualquier valor de color CSS válido)
buttonWidth: Ancho del botón (cualquier valor de dimensión CSS válido, por ejemplo, «350px», «20em»)
buttonText: Texto que aparece en el botón (por ejemplo, «retiro de la orden y entrega»)
floatingBar: Agrega una barra flotante sólida detrás del botón (verdadero o falso)
backgroundColor: Color de fondo de la barra flotante (cualquier valor de color CSS válido o «transparente»)
borderColor: Bordes superior e inferior de la barra flotante (cualquier valor de color CSS válido o «transparente»)
Todos los campos excepto businessId son opcionales, lo que te permite personalizar el botón según tus preferencias.
¿Cómo instalo el botón inteligente «ordenar ahora» en diferentes plataformas de sitios web?
Dependiendo de la plataforma de tu sitio web, el proceso de instalación puede variar. Aquí tienes instrucciones para algunas plataformas comunes:
¿Cómo agrego el botón en GoDaddy?
Ve a editar sitio web.
Selecciona el icono + en la parte superior de la página para añadir una nueva sección.
Selecciona la opción HTML.
Pegue el código del botón inteligente «Ordenar ahora» en el cuadro de texto «código personalizado».
Reemplaza todas las instancias de «ventana» con «window.top.»
Guarda y prueba la alineación del botón en tu sitio web real.
¿Cómo añado el botón en Squarespace (se requiere cuenta Premium)?
Es necesario tener una cuenta Premium para completar lo que se indica a continuación:
Elije el icono + situado en la parte inferior de la página de inicio del sitio web para añadir una nueva sección.
Selecciona la opción de código.
Elige HTML y desmarca la opción «mostrar fuente».
Pega el código del botón inteligente «Ordenar ahora» en el cuadro de texto «código» y pulsa aplicar.
Guarda y prueba la alineación del botón en tu sitio web real.
¿Cómo agrego el botón en Wix?
Necesitarás una cuenta premium para completar lo que se indica a continuación:
Abre el editor del sitio y selecciona el botón agregar.
Selecciona Insertar, luego Herramientas de marketing y luego Código personalizado.
En la sección «Encabezado», haz clic en Agregar código.
Pega el código del botón inteligente «Ordenar ahora» donde se te indique y elige a qué páginas quieres añadir el código.
Guarda y prueba la alineación del botón en tu sitio web real.
¿Cómo agrego el botón en WordPress?
Necesitarás una cuenta Business para completar lo que se indica a continuación:
Navega a la sección Complementos en el panel.
Selecciona Agregar nuevo.
Busca el complemento «Ordenar en línea de DoorDash».
Selecciona Instalar ahora.
Activa el complemento en el panel de complementos.
Selecciona el enlace de configuración dentro de la fila del complemento «Ordenar en línea de DoorDash».
Establece todos los campos obligatorios:
"Business ID" - tu ID de negocio DoorDash
Texto del botón - Ordenar en línea (predeterminado) o ingresa otra frase
Desde el menú, ve a Apariencia, selecciona Widgets, elige Ordenar en línea de DoorDash y arrastralo a una barra lateral de Ordenar en línea.
Una vez que estés listo, selecciona Listo.
Nota: Asegúrate de que el campo «Mostrar botón:» tiene seleccionado «Sí».
Al seguir estas instrucciones, puedes agregar un Botón inteligente personalizado de órdenes en línea «ordenar ahora» a tu sitio web, lo que brinda a tus clientes una manera conveniente y rápida de ordenar.
Conoce más sobre cómo Ordenar en línea de DoorDash puede ayudar a mejorar tu sitio web.
