Para incrustar un menú en línea, construyes el menú una vez en una herramienta alojada, copias el código que genera y pegas ese código en la página de tu sitio web donde debería aparecer el menú. Los platos, fotos y precios viven en la herramienta del menú, y tu sitio simplemente los muestra. El trabajo consiste principalmente en preparar buen contenido y probar en un teléfono, no en el código.
Esta guía cubre ambas rutas: pegar un widget en un sitio que ya tienes y usar una plataforma donde el menú es parte del sitio web desde el principio.
TL;DR
- Incrustar significa pegar un fragmento de código generado en una página o plantilla. Normalmente no se necesita desarrollo personalizado.
- La gran ventaja es la separación: el personal edita platos y precios en la herramienta del menú, y el sitio web se actualiza sin un desarrollador o un nuevo PDF.
- Coloca el menú en tu navegación principal y en el botón de la página de inicio, no enterrado en un enlace de pie de página. Mantén un enlace directo y un código QR como respaldo.
- Prueba en móvil primero. Ahí es donde la mayoría de los invitados lo abrirán.
- Si prefieres no unir herramientas, RESTOBOT incluye un menú incrustado en su constructor de sitios web, sin comisión en los pedidos.
Tabla de Contenidos
- Lo que "incrustar" un menú realmente significa
- Prepara el contenido antes de tocar cualquier código
- Paso a paso: incrustar un widget de menú
- Dónde poner el menú para que los invitados realmente lo vean
- ¿Solo menú, o menú más pedidos?
- Nuestra perspectiva
- Dónde encaja RESTOBOT
- Errores comunes al incrustar un menú
- Una lista de verificación rápida antes del lanzamiento
- FAQ
- Fuentes
Lo que "incrustar" un menú realmente significa
Hay tres formas comunes de poner un menú en línea, y se comportan de manera muy diferente.
| Método | Cómo funciona | Punto débil |
|---|---|---|
| Carga de PDF o flipbook | Un archivo está vinculado o se muestra en una página | Cada cambio de precio significa re-exportar y re-subir |
| Enlace simple a un menú alojado | Un botón envía a los invitados a otra página | Fácil de perder, y los invitados abandonan tu sitio |
| Menú incrustado (widget, iframe o script) | El menú aparece dentro de tu propia página | Necesita un pegado único y una verificación móvil |
Un PDF o ePaper solo de menú puede ser vinculado o incrustado, pero no te da pedidos en vivo, reservas o controles de disponibilidad. Eso importa en el momento en que un plato se agota o un proveedor cambia tus costos.
Un menú incrustado evita eso. El enfoque del widget funciona porque separa el mantenimiento de contenido del mantenimiento del sitio web: el personal cambia platos, fotos o precios en el servicio del menú, y la ubicación de incrustación en el sitio permanece igual.
Prepara el contenido antes de tocar cualquier código
La mayoría de los proyectos de incrustación se estancan porque el menú no está listo, no porque el código sea difícil. Reúne estos primero:
- Categorías en el orden en que piensan los huéspedes. Entrantes, platos principales, guarniciones, postres, bebidas. Mantén la lista corta. Siete u ocho categorías se escanean mejor que quince.
- Nombres de los platos y descripciones breves. Una línea sobre los ingredientes principales y cómo se cocina. Evita la poesía.
- Precios, finales y consistentes. Usa el mismo formato en todo momento, por ejemplo £12.50 en cada línea en lugar de una mezcla de £12.5 y 12.50.
- Fotos de los platos que se venden. No necesitas fotografiar cada artículo. Comienza con tus más vendidos y platos insignia. Nuestra guía sobre fotografía de menús de restaurantes en una tarde muestra cómo hacerlo sin un estudio.
- Información dietética y de alérgenos. Etiqueta claramente los platos vegetarianos, veganos y sin gluten. En Gran Bretaña, la Agencia de Normas Alimentarias dice que un restaurante o cafetería debe proporcionar información sobre alérgenos, ya sea en el menú o a través de un aviso que explique cómo obtenerla. Consulta la página de la FSA para lo que se aplica a tu local.
Si deseas profundizar en qué mostrar y dónde, nuestro artículo sobre optimización de menús en línea para propietarios cubre la presentación del diseño y precios.
Diseño de categorías y fotos de platos
Dos detalles cambian cómo se lee un menú en una pantalla pequeña.
Categorías. Usa secciones claras, colapsables o con pestañas para que un huésped pueda saltar a los postres sin desplazarse por treinta platos principales. Nómbralas de manera sencilla. "Asados de Domingo" supera a un nombre de marca ingenioso que nadie reconoce.
Fotos. Usa una relación constante, generalmente cuadrada o 4:3, para que la cuadrícula se vea ordenada. Mantén los archivos comprimidos para que la página se cargue rápidamente en datos móviles. Un menú con diez buenas fotos supera a uno con cuarenta desiguales.
Paso a paso: incrustar un widget de menú
El flujo de trabajo documentado es el mismo en la mayoría de las herramientas: personaliza el widget, copia el código generado y pégalo. En la práctica:
- Crea el menú. Agrega categorías, platos, precios, fotos y etiquetas dietéticas en tu herramienta de menú.
- Ajusta el aspecto. Elige el diseño, número de columnas y colores para que coincida con tu sitio. Los controles de columna y ancho ayudan a adaptar el widget a menús más cortos o más largos.
- Copia el código generado. Generalmente es una etiqueta de script corta o un iframe.
- Abre la página correcta en tu sitio web. Crea una página de "Menú" si no tienes una.
- Pega el código en un bloque HTML o de incrustación. No lo pegues en un bloque de texto plano, ya que mostrará el código como texto.
- Publica y prueba en un teléfono. Luego prueba en un escritorio y una tableta.
La lista de herramientas del widget indica compatibilidad con WordPress, Wix, Squarespace, Webflow, Shopify, Joomla y HTML plano, por lo que la ruta es similar independientemente del constructor que utilices. Si tu sitio fue creado por una agencia, pídeles la ubicación del bloque de incrustación o plantilla. Un estudio de diseño web como Hook Digital en Oxford puede asesorarte sobre opciones técnicas para plataformas web comunes si necesitas ayuda práctica.
El punto de fallo que nadie menciona
El código en sí rara vez falla. Lo que sale mal es la colocación: pegado en la plantilla incorrecta, oculto detrás de una pestaña que no lo carga, o comprimido en una columna estrecha, haciendo que el menú se vea abarrotado. Prueba el resultado en móvil, donde la mayoría de los visitantes de restaurantes probablemente lo abrirán. Desplázate por todo el menú, abre un plato, cambia de categoría y toca cada botón con tu pulgar.
Si el diseño se ve abarrotado en un teléfono, el problema suele ser la página, no el widget. Las consideraciones de visualización en diferentes dispositivos son una cuestión de diseño tanto como técnica, como ilustra el trabajo de agencia como esta construcción de sitio web de restaurante.
Dónde poner el menú para que los invitados realmente lo vean
Un menú incrustado que nadie encuentra es un menú desperdiciado. Un proveedor de menús digitales recomienda la incrustación directa porque un enlace de texto o botón ordinario puede ser menos notable. Aplica esa lección:
- Navegación principal. "Menú" debería ser uno de los primeros elementos, no bajo "Más".
- Botón en la página de inicio. Un claro llamado a la acción por encima de la línea de pliegue en móvil.
- Una URL dedicada. Dale al menú su propia página, por ejemplo tu-sitio.co.uk/menu, para que pueda ser compartido e indexado.
- Una alternativa. Mantén un enlace directo y un código QR de la tabla. Nuestra guía de código QR de menú en línea explica cómo configurarlo.
- Google. Si tu menú no aparece en tu perfil de Google, ve cómo arreglar los bloqueos de alimentación de socios y publicar tu menú en Google.
Para una estructura más amplia, las mejores prácticas para sitios web de restaurantes explican cómo recibir pedidos con un solo toque, y si deseas que la página sea fácil de encontrar en la búsqueda, la guía sobre SEO para restaurantes es un buen punto de partida.
¿Solo menú, o menú más pedidos?
Un menú solo para exhibición responde a la pregunta "¿qué sirves?". No toma dinero. Antes de elegir una herramienta, decide qué quieres que haga la incrustación.
Solo exhibición. El más barato y simple. Bueno para un pub o café que toma pedidos en el mostrador.
Exhibición más pedidos. Los invitados eligen, pagan y tú recibes el pedido. Aquí es donde importan las tarifas. Los mercados como Uber Eats, Glovo, Bolt Food, Wolt, Just Eat y Pyszne cobran el 30% del valor neto del pedido más IVA, casi el 40% en total. En una cesta de £30, eso es una gran parte de un margen delgado. Pedir a través de tu propio sitio lo evita, y con RESTOBOT la comisión sobre los pedidos es del 0%. Solo pagas una suscripción mensual.
Exhibición más reservas. Un menú junto a un botón de reserva es útil para restaurantes donde los invitados revisan los platos antes de elegir una mesa.
Cuando el menú, los pedidos y las reservas están en un solo sitio, el invitado nunca tiene que salir para terminar el trabajo. Si estás sopesando costos, nuestro desglose de presupuestos reales de sitios web de restaurantes ofrece números realistas, y construir un sitio web de restaurante rápidamente establece un plan de lanzamiento.
Nuestra perspectiva
Vemos el mismo patrón con los propietarios de restaurantes. Comienzan con un PDF porque es rápido, luego pasan años reexportándolo cada vez que cambia un precio. El verdadero costo no es la hora que se pasa subiendo. Son las semanas en las que el sitio web muestra el menú de la temporada pasada y los invitados llegan esperando un plato que ya no sirves.
Así que nuestra visión es simple: el menú debería ser algo vivo en un solo lugar, y todo lo demás debería leer de él. Por eso el constructor de sitios web en RESTOBOT tiene el menú y las reservas integrados desde el principio, en lugar de dejarte juntar widgets separados. Los pedidos pueden venir del sitio web y de un bot de Telegram, y no cobramos comisión por ellos.
Una advertencia de la experiencia: no esperes un menú perfecto. Publica con categorías, precios y fotos de tus más vendidos, y luego mejora semanalmente. Un menú en vivo, ligeramente simple, supera a un hermoso PDF que está desactualizado.
*— ADMIN*
Dónde encaja RESTOBOT
Si aún no tienes un sitio, o estás cansado de parchear widgets en uno, RESTOBOT te ofrece un sitio web con el menú integrado, además de pedidos en línea, reservas y tarjetas de fidelidad. Los sitios se pueden crear al instante y lanzarse en un día.
El plan MENU comienza desde 69 EUR al mes, y el plan FULL, con el conjunto completo de características, desde 119 EUR al mes. La facturación anual está listada en 59 EUR al año para MENU y 99 EUR al año para FULL. Consulta los detalles completos del plan y precios para elegir el que se adapte a tu local.
El personal también puede recibir propinas voluntarias de los invitados a través de propinas en línea, disponibles en todos los planes, y un trabajador puede registrarse solo incluso si el local no está en RESTOBOT.
Errores comunes al incrustar un menú
- Pegar en un bloque de texto. El código aparece como palabras en la página. Usa un elemento HTML o de incrustación.
- Olvidar republicar el sitio. Algunos constructores necesitan una publicación manual después de agregar el fragmento.
- Dejar PDFs antiguos activos. Los motores de búsqueda y los enlaces antiguos siguen enviando a los invitados a precios desactualizados. Elimínalos o redirígelos a la nueva página del menú.
- Fotos que son demasiado grandes. La carga lenta es la forma más rápida de perder a un visitante móvil.
- Sin respaldo. Si un script es bloqueado por una extensión del navegador o una red corporativa, un enlace directo aún funciona.
- Ignorar reseñas. Una buena página de menú funciona mejor junto con pruebas sociales. Consulta cómo incrustar reseñas de Google en tu sitio web.
Finalmente, echa un vistazo a lo básico antes de comprar más herramientas. Nuestro artículo sobre eficiencia operativa en restaurantes argumenta que arreglar el desperdicio viene antes de agregar tecnología. Si también vendes catering, pedidos en línea para catering muestra cómo salir en vivo en un día.
Una lista de verificación rápida antes del lanzamiento
- Cada categoría y plato está presente, con precios finales.
- Los más vendidos tienen fotos en una proporción consistente.
- Las etiquetas dietéticas y la información sobre alérgenos son verificadas por quien mejor conoce la cocina.
- La incrustación se encuentra en su propia página, enlazada desde la navegación principal y el botón de la página de inicio.
- La página se abre rápidamente con datos móviles, y cada objetivo de toque funciona.
- Un enlace directo y un código QR conducen al mismo menú.
- Los PDFs antiguos son eliminados o redirigidos.
- Una persona designada se encarga de las actualizaciones, para que los precios se mantengan actualizados.
FAQ
¿Necesito un desarrollador para incrustar un menú en línea?
Generalmente no. El proceso es configuración, generación de código y pegado, no desarrollo personalizado. Solo necesitas ayuda si la plantilla de tu sitio es inusual o no puedes encontrar dónde agregar un bloque HTML.
¿Puedo incrustar un menú en WordPress, Wix o Squarespace?
Sí. Los proveedores de widgets enumeran soporte para WordPress, Wix, Squarespace, Webflow, Shopify y HTML simple. Agregas el código generado en un bloque HTML o de incrustación en la página donde debería aparecer el menú.
¿Es mejor un menú incrustado que un PDF?
Para la mayoría de los restaurantes, sí, porque los precios y platos se pueden actualizar en un solo lugar sin necesidad de volver a subir un archivo. Un PDF está bien como respaldo imprimible, pero no puede ofrecer disponibilidad en tiempo real, pedidos o reservas.
¿Cómo me aseguro de que el menú funcione en teléfonos?
Abre la página publicada en al menos un iPhone y un teléfono Android. Desplázate por cada categoría, abre un plato y toca cada botón. Si el diseño se ve apretado, ensancha el contenedor o mueve la incrustación fuera de una columna estrecha.
¿Debería mantener también un código QR y un enlace directo?
Sí. Actúan como una alternativa si un script está bloqueado, y el código QR sirve a los huéspedes en la mesa. Ambos deben apuntar al mismo menú en vivo para que nada esté desactualizado.
Fuentes
- Elfsight: widget de menú de restaurante (guía)
- Elfsight: cómo crear un widget de menú de restaurante
- Elfsight: widget de menú de restaurante para sitios web
- Speisekarte.de: incrustación de menú digital
- Food Standards Agency: información sobre alérgenos para consumidores
- Hook Digital: diseño y desarrollo de sitios web
- Blucat Group: desarrollo de sitios web para restaurantes
- Baby Love Growth: SEO para restaurantes
Recomendado
- Configuración de código QR de menú en línea para restaurantes: una guía rápida
- Arreglar bloques de alimentación de socios para publicar el menú de tu restaurante en Google
- Profit First, pedidos en aumento en semanas: optimización de menú en línea para propietarios
- Construye un sitio web de restaurante rápido: un plan de lanzamiento que funciona