Volver al blog
Webflow9 min de lectura

Traducir formularios de Webflow: etiquetas, errores y emails

Cómo traducir un formulario de Webflow entero: etiquetas, placeholders, botón, mensajes de éxito y error, validación del navegador y el email de confirmación.

Equipo Lantis

Tienes la web de Webflow en cuatro idiomas y el formulario de contacto sigue medio en español. Las etiquetas se tradujeron, el placeholder no. El botón dice «Enviar». Y cuando alguien lo rellena desde Berlín, le aparece un «Thank you! Your submission has been received!» que nadie escribió.

Un formulario de Webflow no es un bloque de texto: son seis capas distintas, y cada una se traduce de una forma. Etiquetas y botón son texto normal. Los placeholders son atributos HTML. Los mensajes de éxito y error viven en divs ocultos que solo aparecen al enviar. La validación de campo obligatorio la pinta el navegador. Y el email de confirmación lo manda Webflow desde sus ajustes, fuera de la página. Lantis traduce las cinco primeras capas automáticamente, incluidos los atributos (placeholder, aria-label, title, alt) y el texto que aparece después de enviar; la sexta, el email, se configura en Webflow.

Resumen rápido

  • Un formulario son seis capas. Etiquetas, placeholders, botón, mensaje de éxito, mensaje de error y email de notificación. Revisarlas una por una es la única forma de no dejar texto en el idioma original.
  • Los placeholders son atributos, no texto. Muchas traducciones los dejan intactos porque no están entre etiquetas HTML; Lantis traduce placeholder, aria-label, title y alt.
  • Los mensajes de éxito y error están ocultos en el HTML. Webflow los pinta al enviar, así que hay que traducirlos aunque no se vean al cargar la página.
  • La validación «rellena este campo» no es tuya. La genera el navegador en su propio idioma; no se traduce desde Webflow ni desde un proxy.
  • El email de confirmación se configura por formulario en Webflow, y es uno solo: si recibes consultas en varios idiomas, decide en qué idioma va o usa una herramienta externa.
  • Con Lantis el formulario se sirve traducido desde el servidor en la URL de cada idioma (/fr/contacto), desde $3,50/mes.

Las seis capas de un formulario de Webflow

La primera frase es la respuesta: un formulario de Webflow mezcla texto visible, atributos HTML, elementos ocultos, mensajes del navegador y correos enviados por Webflow, y cada grupo se traduce en un sitio distinto.

CapaDónde viveVisible al cargarQuién la traduce
Etiquetas y textos de ayudaTexto del elementoSíLocalization o proxy
Placeholder del campoAtributo placeholderSí (en gris)Proxy (atributos) o Localization campo a campo
Texto del botónAtributo value del inputSíLocalization o proxy
Mensaje de éxitoDiv «Success message», ocultoNoProxy; en Localization, a mano desde el Navigator
Mensaje de errorDiv «Error message», ocultoNoProxy; en Localization, a mano desde el Navigator
Email de notificaciónAjustes del formulario en WebflowNoTú, en Webflow

Las dos filas de los mensajes son las que más se escapan, porque en el editor no están a la vista. Las trataremos aparte.

Etiquetas, placeholders y botón

Estos tres son el trabajo fácil, con un matiz técnico que explica por qué tantos formularios quedan a medias.

Las etiquetas (<label>) y cualquier texto de ayuda son texto normal: se traducen como el resto de la página.

El placeholder no es texto, es un atributo. En el HTML aparece como <input placeholder="Tu correo">. Una herramienta que solo recorre nodos de texto lo salta y el campo se queda en el idioma original. Lantis traduce de forma explícita los atributos placeholder, aria-label, title y alt, así que el texto en gris del campo y las etiquetas accesibles también cambian de idioma.

El botón de enviar tampoco es texto. Webflow lo genera como <input type="submit" value="Enviar">, y además tiene un segundo valor, el texto de «esperando» que se muestra mientras se procesa el envío. Si traduces solo lo visible, el botón puede volver al español durante medio segundo justo al enviar.

Y un consejo de orden: no uses el placeholder como etiqueta. Sin <label> es un problema de accesibilidad en cualquier idioma, y al traducir pierdes la pista de qué campo era cada cosa. Los atributos y la accesibilidad por idioma los tocamos también en traducir imágenes y textos alt.

Los mensajes de éxito y error: donde falla todo el mundo

Webflow mete en el HTML dos bloques ocultos por cada formulario: el de éxito («Thank you! Your submission has been received!») y el de error («Oops! Something went wrong while submitting the form.»). Están en la página desde el principio, con display: none, y el JavaScript de Webflow los muestra al enviar.

Eso tiene dos consecuencias:

  • Con un proxy de traducción se traducen solos, porque forman parte del HTML que se sirve. Lantis traduce el HTML en servidor y además observa los cambios del DOM, así que el texto que aparece después de enviar también sale traducido.
  • Con Webflow Localization hay que ir a buscarlos. El panel de ajustes del Form Block con los estados de éxito y error se maneja en el locale principal; en los secundarios, la vía práctica que describen los usuarios en el foro de Webflow es abrir el Navigator, seleccionar el elemento de texto dentro del div de éxito o de error y traducirlo ahí. Hay una petición abierta en el wishlist de Webflow para que esos ajustes sean visibles en los locales añadidos.

La prueba de que lo has hecho bien es tonta y la salta casi todo el mundo: envía el formulario de verdad en cada idioma. Es el único momento en que esos dos textos se ven.

La validación del navegador no la traduces tú

Cuando dejas un campo obligatorio vacío y sale «Completa este campo» o «Please fill out this field», ese mensaje no es de Webflow ni de tu web: lo genera el navegador a partir del atributo required, y lo muestra en el idioma del navegador o del sistema operativo del visitante, como documenta MDN en su guía de validación de formularios.

Dicho de otro modo: alguien con el navegador en alemán verá ese aviso en alemán aunque tu web esté en español, y no hay nada que traducir. Si quieres controlar el texto, la única vía es validación propia con JavaScript, y entonces los mensajes pasan a ser texto de tu página (y sí se traducen). No merece la pena pelearse con esto salvo en formularios largos o de pago: en un contacto de cuatro campos, el mensaje del navegador es además el que el visitante reconoce.

El email de confirmación y el de aviso

Aquí termina lo que una capa de traducción puede hacer y empieza la configuración de Webflow. Hay dos correos distintos: el aviso que te llega a ti con los datos del envío (lo lees tú, da igual el idioma) y el que recibe quien rellena el formulario, que sí es contenido de cara al cliente.

Webflow movió en octubre de 2025 los ajustes de notificación de los formularios desde los ajustes del sitio al panel de cada Form Block en el Designer, según su propio blog; la pestaña Forms de los ajustes del sitio sigue guardando los envíos, que se explican en la documentación de envíos de formulario. Lo importante para una web multilingüe: ese texto es uno por formulario, no uno por idioma.

Tienes tres salidas razonables:

  1. Un formulario por idioma, cada uno en la página de su idioma y con su propio texto de notificación. Es lo más limpio si usas Localization y tienes pocos idiomas.
  2. Un correo en inglés para todos los idiomas, corto y neutro. Funciona en B2B y evita mantener seis textos.
  3. Un servicio externo (el que ya uses para email marketing o automatizaciones) que reciba el envío y mande la confirmación en el idioma que venga en un campo oculto del formulario.

Para la tercera opción basta un campo oculto con el idioma de la página. Si vendes online, el problema es el mismo que con los correos de pedido y lo desarrollamos en traducir el checkout y los emails de tu tienda.

Paso a paso: dejar un formulario de Webflow bien traducido

  1. Pon el formulario en la página de cada idioma. Con Lantis no haces nada: /fr/contacto ya sirve la misma página traducida. Con Localization, revisa el formulario en cada locale.
  2. Repasa campo a campo: etiqueta, placeholder, texto de ayuda y botón. Mira el formulario en el idioma, no la lista de traducciones.
  3. Envía el formulario de prueba y comprueba el mensaje de éxito. Si sale en inglés, es el div oculto de Webflow.
  4. Fuerza el error (desconecta la red o deja un campo mal) y comprueba el mensaje de error.
  5. Decide el idioma del email de confirmación y configúralo en el panel del Form Block.
  6. Añade un campo oculto con el idioma si vas a automatizar respuestas. Te sirve para responder en el idioma correcto aunque el aviso llegue en uno solo.
  7. Fija en el glosario los términos que no deben traducirse: nombre del producto, nombres de plan, «newsletter» si así lo quieres.
  8. Comprueba el SEO de la página del formulario con el comprobador de SEO multilingüe: URL por idioma, hreflang y canonical. La configuración de hreflang en Webflow, paso a paso, está en hreflang en Webflow.

Errores frecuentes

  • Traducir solo lo que se ve al cargar. Los mensajes de éxito y error están ocultos en el HTML y son justo los que lee el visitante cuando ya ha decidido escribirte.
  • Olvidar el placeholder. Es el error más visible: etiqueta en francés y «Tu correo» dentro del campo.
  • Pelearse con la validación del navegador. No es tu texto. Si lo necesitas en tu idioma, hazlo con validación propia en JavaScript.
  • Dar por hecho que el email de confirmación se traduce. No sale de la página, así que ninguna capa de traducción lo toca.
  • Dos formularios con el mismo nombre. Webflow agrupa los envíos por el nombre del formulario. Si duplicas el de contacto por idioma y los llamas igual, pierdes la pista de qué idioma envió qué.

Un formulario traducido a medias no se nota en la home: se nota en el único momento en que alguien iba a escribirte.

Cuándo elegir Webflow Localization en vez de Lantis

Elige Localization si quieres formularios distintos por idioma (campos diferentes, otro destinatario, otro texto de notificación), si tienes uno o dos idiomas y si ya pagas el complemento. Consultado en octubre de 2026 en la página de precios de Webflow, el nivel Essential cuesta 12 $ por locale al mes en pago mensual, hasta 3 locales, y el Advanced 35 $ por locale al mes, hasta 10. El desglose completo está en Webflow Localization: precios y límites y las opciones fuera de Webflow, en alternativas a Webflow Localization.

Elige Lantis si quieres el mismo formulario en todos los idiomas traducido sin mantenerlo seis veces, si vas a tener tres o más idiomas o si el formulario convive con un CMS que crece, caso que tratamos en traducir el CMS de Webflow.

Preguntas frecuentes

¿Se traducen los placeholders de un formulario de Webflow?

Sí, pero no como el resto del texto: el placeholder es un atributo HTML (placeholder="…"), no un nodo de texto, y hay herramientas que lo saltan. Lantis traduce explícitamente placeholder, aria-label, title y alt, así que el texto gris del campo cambia de idioma junto con la etiqueta.

¿Cómo traduzco el mensaje de «Thank you! Your submission has been received!» de Webflow?

Ese texto está en un div oculto que Webflow añade a cada formulario y que se muestra al enviar. Con un proxy de traducción se traduce solo, porque forma parte del HTML de la página. Con Webflow Localization, la forma práctica es abrir el Navigator en el locale, seleccionar el texto dentro del bloque de éxito y traducirlo ahí.

¿Puede Webflow enviar el email de confirmación en el idioma del visitante?

No de forma nativa: el texto de notificación se configura por formulario, no por idioma. Las salidas habituales son crear un formulario por idioma, usar un correo único en un idioma neutro, o enviar el idioma en un campo oculto a una herramienta externa que redacte la respuesta.

¿Por qué el aviso de «campo obligatorio» no está en el idioma de mi web?

Porque lo genera el navegador a partir del atributo required, y lo muestra en el idioma del navegador o del sistema del visitante. No lo controla Webflow ni la capa de traducción. Si necesitas ese texto en el idioma de la página, tienes que validar con JavaScript propio y escribir los mensajes tú.

¿Los envíos del formulario traducido llegan igual a Webflow?

Sí. Con Lantis el formulario sigue siendo el de Webflow: se envía al mismo sitio y el envío aparece en los ajustes de Forms como cualquier otro. Para distinguir el idioma de origen, añade un campo oculto con el código de idioma de la página.

Conclusión

Traducir un formulario de Webflow es un trabajo de lista: etiquetas, placeholders, botón, mensaje de éxito, mensaje de error y email. Las cuatro primeras se arreglan con una buena traducción de la página, la quinta solo se ve si envías el formulario de prueba en cada idioma, y la sexta se decide en Webflow porque no vive en la página. Si solo haces una cosa después de leer esto, que sea enviar el formulario en cada idioma y mirar qué sale.

Lantis traduce tu web de Webflow con una línea de código en el <head>, formularios incluidos: texto, atributos como placeholder y aria-label, metadatos y el contenido que aparece después de interactuar. Cada idioma vive en su propia URL (/fr/, /de/) con hreflang, canonical y sitemap por idioma, con el HTML ya traducido desde el servidor y más de 60 idiomas disponibles. Cuesta $3,50/mes con 1 idioma, $3/idioma de 2 a 9 y $2,50/idioma desde 10, con 500.000 palabras por idioma, y hay un plan gratis de 100 traducciones sin tarjeta. Calcula lo tuyo en la calculadora o pruébalo con tu formulario: Empieza gratis.

Pon tu web en varios idiomas hoy.

Una línea de código. SEO real por idioma. Traducción con IA. Sin tarjeta para empezar.

Sigue leyendo