Texto a Voz con TranslatePress: lo que funciona

14 min de lectura 19 min de escucha
Texto a Voz con TranslatePress: lo que funciona

TranslatePress traduce el HTML renderizado de una página en el momento de la solicitud y almacena cada traducción en tablas de la base de datos local. Hay un único ID de post por artículo, y los cambios de idioma se realizan a través de trp_translate(), no mediante posts duplicados. Ese dato cambia por completo cómo tiene que funcionar el texto a voz en un sitio con TranslatePress.

Este es el quinto y último artículo de nuestra serie sobre TTS multilingüe. Ya cubrimos WPML, Polylang, Weglot y GTranslate. TranslatePress ocupa un punto intermedio entre todos ellos desde el punto de vista técnico, y la configuración del audio lo refleja.

En qué se diferencia TranslatePress de WPML, Polylang y Weglot

WPML y Polylang crean un post separado por cada idioma. Cada traducción tiene su propio ID de post, su propio post_content y su propio enlace permanente. La generación de audio es directa porque cada idioma es un objeto WordPress independiente.

Weglot adopta el enfoque contrario. Las traducciones viven en los servidores de Weglot y se inyectan en la página a través de un proxy o subdominio. La base de datos de WordPress nunca ve el texto traducido, por eso el TTS en el servidor con Weglot es complicado sin hooks de JavaScript.

TranslatePress es el término medio. Hay un solo post por artículo, así que post_content solo contiene el idioma predeterminado. Pero cada traducción vive localmente en la base de datos de WordPress, en las tablas wp_trp_. Se pueden leer, consultar y enviar a un motor TTS. Eso cambia el enfoque del audio respecto a cualquiera de los otros cuatro plugins.

Dónde se guardan las traducciones

TranslatePress almacena las traducciones en tablas con el prefijo wp_trp_. Cada par de idiomas tiene su propia tabla de diccionario, con la clave wp_trp_dictionary_<origen>_<destino>. También existe wp_trp_original_strings para las cadenas de origen y tablas gettext para las traducciones de temas y plugins.

El almacenamiento es direccional. Una traducción al alemán de un sitio en inglés vive en el diccionario de inglés a alemán. Para recuperarla hay que usar la misma dirección. La función pública que importa es trp_translate(), que recibe una cadena de contenido y un código de idioma y devuelve la versión traducida.

if ( function_exists( 'trp_translate' ) ) {
    $translated = trp_translate( $post->post_content, 'de_DE' );
    // Pasar $translated al motor TTS, no $post->post_content.
}

Para una integración TTS, esa función es la fuente de verdad. Leer post_content directamente siempre devuelve el idioma predeterminado, independientemente de la URL que visite el usuario. Consulta la documentación de integración con TranslatePress para ver cómo lo gestiona TTSWP.

Diagrama de trp_translate() convirtiendo un post_content en tres salidas de audio localizadas
Un ID de post, un post_content, múltiples salidas de audio traducidas a través de trp_translate().

El problema con los códigos de configuración regional

TranslatePress usa códigos de configuración regional completos, no slugs. El alemán es de_DE, no de. El francés es fr_FR. El portugués de Brasil es pt_BR. Cualquier integración que asuma slugs de dos letras al estilo Polylang fallará en silencio con TranslatePress.

La documentación para desarrolladores de TranslatePress es explícita al respecto. El código de idioma que se pasa a trp_translate() es la configuración regional de Ajustes, TranslatePress, General, y no tiene por qué coincidir con el slug del idioma en la URL. Un slug como de no coincide con ningún diccionario, así que la función recurre a la cadena original sin ningún aviso. Si escribes código personalizado, normaliza los códigos de idioma antes de llamar a trp_translate() y guarda el mismo formato de configuración regional junto a los archivos de audio para poder relacionarlos después.

Estructura de URL y caché

TranslatePress usa un subdirectorio por idioma de forma predeterminada. Tu página en inglés está en site.com/blog/post y la versión alemana en site.com/de/blog/post. También hay una opción para usar un subdirectorio en el idioma predeterminado, lo que hace que todos los idiomas sean simétricos.

Esto funciona bien con la caché. Las URLs distintas generan claves de caché distintas por idioma. WP Rocket, LiteSpeed y las cachés de borde de CDN tratan /de/blog/post como un recurso separado de /blog/post, por lo que el archivo de audio en alemán se sirve con la página en alemán y el audio en inglés con la página en inglés. La documentación de integración con caché incluye las reglas de exclusión si las necesitas.

El riesgo está en el complemento de pago de detección automática del idioma del usuario. Redirige a los visitantes según el idioma del navegador, lo que puede entrar en conflicto con las cachés de página y servir la redirección incorrecta a un usuario equivocado. Ya abordamos el mismo patrón en el artículo sobre Polylang. Menos sitios con TranslatePress usan la detección porque es un complemento de pago, pero si lo usas, excluye la lógica de redirección de la caché.

El problema de traducción de la interfaz del reproductor

Este es exclusivo de TranslatePress. El plugin detecta y traduce cadenas insertadas por JavaScript, algo poco habitual. La mayoría de las herramientas de traducción ignoran el contenido renderizado por JS. TranslatePress lo captura en el DOM después del renderizado y ofrece traducirlo.

El efecto secundario es que las etiquetas del reproductor de audio como «Reproducir», «Pausar» y «Escuchar este artículo» aparecen en el editor de TranslatePress como cadenas traducibles. Si esas cadenas se traducen automáticamente sin revisión, el reproductor puede acabar con texto de botones poco natural o incorrecto y, peor aún, con etiquetas de accesibilidad mal traducidas que confunden a los lectores de pantalla.

Hay dos soluciones dentro de TranslatePress. Añade el atributo data-no-translation a cualquier elemento que quieras excluir. O usa los selectores de exclusión en Ajustes avanzados para omitir contenedores enteros mediante selector CSS. Ambas opciones están documentadas en los propios ajustes de TranslatePress. Para el reproductor de TTSWP, excluye el contenedor del reproductor por clase y deja que las etiquetas traducidas vengan a través de los propios archivos de idioma del plugin.

Qué excluir

  • El elemento contenedor del reproductor de audio
  • Etiquetas ARIA de los controles de reproducción, pausa y progreso
  • Indicadores de tiempo y duración
  • Cualquier etiqueta de nombre de voz o idioma renderizada por TTSWP

Si quieres personalizar el estilo del reproductor después de excluirlo, la documentación de CSS personalizado incluye los selectores.

El problema de desincronización al editar contenido

TranslatePress vincula cada traducción a la cadena de origen exacta. Al editar el original, TranslatePress crea una nueva cadena de origen y desvincula la traducción existente. La memoria de traducción sugiere la traducción anterior, pero hasta que un humano lo confirma, el idioma de destino recurre al original.

Para el texto a voz, eso significa que el audio puede desincronizarse con el texto traducido después de cualquier edición. Añadir una coma en inglés desvincula la traducción de ese fragmento en todos los idiomas. El audio en alemán sigue diciendo la frase antigua, pero el texto alemán visible ya muestra la nueva.

Lista de comprobación tras editar contenido:

  1. Confirma la nueva cadena de origen en el editor de TranslatePress para cada idioma activo.
  2. Regenera el audio en el post del idioma predeterminado primero.
  3. Regenera el audio para cada idioma y luego reproduce el audio en cada URL localizada para confirmar que el nuevo archivo coincide con el texto visible.
  4. Vacía la caché de página de cada URL localizada, no solo la predeterminada.

Cómo configurar TTSWP en un sitio con TranslatePress

Este es el flujo actual. La documentación de integración siempre describe el comportamiento más reciente.

  1. Instala TTSWP desde el directorio de plugins de WordPress.org. La guía de instalación lo explica paso a paso.
  2. Conecta el plugin al backend de TTSWP. Los planes gratuitos incluyen créditos de bienvenida para que puedas probar el flujo completo antes de pagar. Consulta cómo conectar tu sitio.
  3. Verifica que TranslatePress está activo y que al menos un idioma de destino está configurado con un código de configuración regional completo.
  4. Asigna una voz por idioma con el mapeado de idioma a voz. Asigna una voz alemana a de_DE, una voz francesa a fr_FR, y así sucesivamente. Consulta la selección de voces para ver el catálogo disponible.
  5. Publica o actualiza un post. El audio se genera primero para el idioma predeterminado.
  6. Reproduce el audio en cada URL traducida. La generación ocurre bajo demanda. La primera vez que un visitante reproduce el audio en un idioma secundario, TranslatePress indica a TTSWP qué idioma está activo y TTSWP genera y almacena en caché el archivo para ese idioma. Las siguientes reproducciones usan el archivo en caché.
  7. Excluye el reproductor de TranslatePress usando data-no-translation o un selector en Ajustes avanzados para que las etiquetas del reproductor las controlen los propios archivos de idioma de TTSWP.

TTSWP almacena un archivo de audio por post e idioma, y el reproductor sigue el idioma de la URL que visita el usuario. En /de/blog/post el reproductor carga el archivo en alemán, y en la URL predeterminada carga el archivo en el idioma predeterminado. Con la traducción automática activa, TTSWP lee el texto traducido directamente desde TranslatePress antes de enviarlo a ElevenLabs, por lo que el audio coincide con lo que el visitante ve en la página.

TranslatePress gratuito vs. de pago para TTS

TranslatePress gratuito permite un idioma adicional, incluye 2.000 palabras traducidas con IA a través de TranslatePress AI y admite Google Translate con tu propia clave de API. Con eso basta para gestionar un blog bilingüe con audio en dos idiomas.

TranslatePress de pago añade idiomas adicionales ilimitados, el SEO Pack para slugs traducidos, meta y control de hreflang, compatibilidad con DeepL, cuentas de traductor, el complemento de detección automática del idioma del usuario y un dominio diferente por idioma. Para un sitio que necesite más de dos idiomas, etiquetas hreflang para motores de búsqueda o traducciones de calidad DeepL antes de la generación de audio, la versión de pago es la opción práctica. La calidad del audio no depende del plan.

SEO y AEO con audio por idioma

El SEO Pack permite configurar etiquetas hreflang por idioma, con opciones para configuración regional específica del país, idioma independiente de la región, o ambas. Para los motores de búsqueda y los motores de respuesta de IA, eso es lo que indica qué audio corresponde a qué región.

Añade una entrada de esquema AudioObject por URL de idioma, con el valor inLanguage correcto que coincida con el hreflang. Google y Bing detectan el par de idiomas y, según nuestras propias pruebas, los motores de IA como Perplexity y ChatGPT Search citan con más frecuencia los artículos enriquecidos con audio cuando el esquema es correcto y la URL del audio responde. Escribimos más sobre esto en el artículo sobre AEO y audio.

Problemas frecuentes y soluciones

ProblemaCausaSolución
El audio suena en el idioma equivocadoEl texto se obtiene de post_content en lugar de trp_translate()Pasa el texto por trp_translate( $content, $locale ) con el código de configuración regional completo
Los botones del reproductor están mal traducidosTranslatePress capturó las etiquetas del reproductor insertadas por JSAñade data-no-translation al contenedor del reproductor o exclúyelo por selector en Ajustes avanzados
El audio desaparece tras editar el contenidoEditar el origen desvincula las traducciones y, por extensión, el audio por idiomaConfirma las traducciones en el editor de TranslatePress y regenera el audio por idioma
Código de configuración regional incorrectoLa integración pasa de en lugar de de_DENormaliza al código completo antes de llamar a trp_translate()
Diseño RTL roto para árabe o hebreoEl CSS del reproductor no es compatible con RTLUsa CSS personalizado para invertir los controles del reproductor en configuraciones regionales RTL
La caché redirige al idioma equivocadoEl complemento de detección automática del idioma del usuario interactúa con la caché de páginaExcluye la redirección de la caché o desactiva la detección

Nota sobre accesibilidad

La narración de audio es compatible con varios criterios de éxito WCAG cuando el reproductor es operable con teclado y está etiquetado correctamente. Si excluyes el reproductor de TranslatePress, mantén las etiquetas ARIA intactas en las propias traducciones de TTSWP. La guía de audio WCAG cubre los criterios en detalle, y el tutorial de configuración principal es un buen punto de partida.

Preguntas frecuentes

¿TranslatePress es compatible con texto a voz?

Sí. TranslatePress almacena las traducciones localmente en las tablas de base de datos wp_trp_, y la función trp_translate() devuelve el contenido traducido en el servidor. Una integración TTS puede leer el texto traducido y generar audio por idioma, siempre que identifique el audio por ID de post más configuración regional y use códigos completos como de_DE en lugar de slugs.

¿Necesito la versión de pago de TranslatePress para el audio?

No. TranslatePress gratuito permite un idioma adicional e incluye traducción a través de TranslatePress AI, Google Translate con tu propia clave o edición manual. Con eso basta para un sitio bilingüe con audio. La versión de pago añade idiomas ilimitados, SEO Pack, DeepL y complementos de detección, que son útiles si necesitas más de dos idiomas o control sobre hreflang.

¿Por qué los botones del reproductor están mal traducidos?

TranslatePress detecta cadenas insertadas por JS, por lo que las etiquetas del reproductor de audio aparecen en su editor y pueden traducirse automáticamente. La solución es añadir data-no-translation al contenedor del reproductor o excluir el contenedor en Ajustes avanzados mediante un selector CSS. Las etiquetas del reproductor pasan entonces a venir de los propios archivos de idioma de TTSWP.

¿Por qué el audio ya no coincide con la traducción?

Editar la cadena original en TranslatePress crea una nueva cadena de origen y desvincula la traducción existente. La memoria de traducción la sugiere de nuevo, pero hasta que la confirmes, el idioma de destino recurre al original. Regenera el audio en el post predeterminado y en cada idioma después de cualquier edición de contenido, y vacía la caché de cada URL localizada.

¿En qué se diferencia TranslatePress de Weglot para TTS?

Weglot almacena las traducciones en sus propios servidores y las inyecta en la página, por lo que WordPress nunca ve el texto traducido en el servidor. TranslatePress guarda cada traducción en la base de datos local y expone trp_translate() para acceso en el servidor. Eso hace que la generación de audio por idioma sea más directa con TranslatePress que con Weglot.

Próximos pasos

Instala Texto a Voz - TTSWP desde el directorio de plugins de WordPress.org, conéctalo a tu cuenta y asigna una voz por cada idioma que ya uses en TranslatePress. Publica un post, reproduce el audio en cada URL traducida y confirma que el audio coincide con el texto visible. Si algo falla, la documentación de integración con TranslatePress es el primer lugar donde buscar.