En esta publicación
Al construir un sitio web multilingüe, la capacidad de traducir imágenes en WordPress es una solicitud común cuando se necesita muestra diferentes imágenes para diferentes idiomas.
Traducir imágenes en WordPress resulta muy útil, especialmente cuando se trabaja con imágenes que contienen texto, texto que debe traducirse para cada idioma.
Traducción de imágenes, o más generalmente, traducción de medios es realmente sencillo de usar TranslatePress. Al igual que con otros tipos de contenido, podrás traducir imágenes directamente desde la interfaz de usuario, utilizando el editor de traducción visual de TranslatePress.
Esta funcionalidad se extiende a todos los tipos de contenido multimedia, ya sean imágenes con texto, controles deslizantes, videos u otros archivos multimedia subidos; puede utilizar el mismo enfoque a continuación para traducirlos, así como la información metadatos asociada (por ejemplo, título, texto alternativo).
Si tienes prisa y te sirve un videotutorial rápido, puedes ver este breve vídeo sobre traducción de imágenes:
Pero si quieres la imagen completa, ¡sigue leyendo!
Traducir imágenes en WordPress
Traducir imágenes directamente desde la interfaz de usuario era algo que nuestros usuarios solicitaban constantemente. Teníamos una solución para esto, en forma de un shortcode condicional basado en el idioma, lo cual funcionó perfectamente.
Sin embargo, esto tenía que utilizarse en el back-end, lo que, de alguna manera, rompía el flujo intuitivo de traducción del front-end por el que se caracteriza TranslatePress.
Deberías poder traducir CUALQUIER tipo de contenido directamente desde la interfaz. Por eso, con un poco de refactorización, trasladamos la capacidad de traducir imágenes, controles deslizantes y más a la interfaz. Esto hace que sea más fácil que nunca mostrar diferentes medios según el idioma.
Algunos de los casos de uso de la traducción de imágenes en WordPress:
- tener una imagen o el logotipo de un sitio web con texto, que debe cambiar cuando cambias el idioma.
- vender un libro electrónico, donde la portada debe reflejar el título en el idioma seleccionado de su sitio multilingüe
- creando controles deslizantes multilingües, que contienen varias imágenes con texto que debe ser traducido
- traduciendo producto de WooCommerce imágenes (cursos, eventos, libros, camisetas... realmente cualquier tipo de producto que tenga texto)
Traducción de imágenes que contienen texto
Ahora que hemos repasado algunos de los casos de uso de la traducción de imágenes, sumerjámonos en el sencillo proceso de traducir imágenes que contienen texto.
Después instalación y activación TranslatePress: verás que se ha añadido una nueva opción llamada ”Traducir el sitio» en la barra de administración.
Pasa el cursor por encima y haz clic en “Configuración” para acceder a la configuración de TranslatePress. Desde aquí puedes añadir un nuevo idioma de traducción. En este ejemplo utilizaremos el español.
A continuación, solo tienes que hacer clic en “Guardar cambios” y en “Traducir el sitio” para empezar a traducir el contenido de tu sitio web.
Se te llevará a una interfaz de traducción visual de extremo delantero. Desde aquí puedes navegar a la página que contiene tu imagen con texto.
Simplemente pasa el cursor sobre la imagen y haz clic en el icono del lápiz para reemplazarla por otra imagen que contenga el texto en español.
En nuestro caso, tenemos una entrada de blog centrada en “Salvar los árboles”, que incluye una imagen con texto. Después de hacer clic en el icono del lápiz, en la barra lateral de traducción puedes subir o seleccionar una fuente de imagen diferente para la versión en español.
Seleccione o cargue la versión traducida de la imagen, haga clic en “Guardar” y listo. Cambiar el idioma al español ahora mostrará la versión en español de la imagen con texto.
También puede seleccionar la imagen por nombre desde la barra lateral de Traducción, localizándola en el menú desplegable de cadenas en Imágenes grupo de opciones.
Traducción del título y atributo alt de la imagen
De ahora en adelante, además de la fuente de la imagen, también puedes traducir metainformación como el Título y alt atributo.
traducir el alt atributo que necesitarás Complemento SEO el cual está disponible en versiones premium del plugin.
Traduciendo el texto alternativo de la imagen puede tener un impacto positivo en el posicionamiento en motores de búsqueda en varios idiomas.
Tener el complemento de SEO instalado y activado te dará acceso a traducir el texto alternativo al hacer clic en una imagen. Si tu imagen tiene un título configurado en el idioma original, también podrás traducirlo.
Como se puede ver en la imagen anterior, toda la metainformación de la imagen se mostrará junto con la fuente de la imagen en la barra lateral de traducción.
Imágenes que contienen enlaces
Otro caso habitual en el que se utiliza la traducción de imágenes en WordPress es cuando dicha imagen contiene además un enlace. Por ejemplo, la portada de un libro electrónico que enlaza con un archivo PDF con su contenido, o diferentes enlaces externos a sitios donde se pueden adquirir distintas versiones.
Si tu imagen contiene un enlace a algún sitio, TranslatePress lo detectará y te permitirá modificar el enlace multimedia o la URL externa en función del idioma.
Si tu imagen contiene un enlace, verás un “Enlace de anclaje” que se muestra en la barra lateral de traducción al seleccionarlo. Esto se puede usar para que las versiones traducidas de su imagen enlacen a diferentes lugares.
En el ejemplo anterior lo usamos para enlazar a diferentes páginas de libros de Amazon. La versión en inglés enlaza al título en inglés de Amazon, mientras que la portada en español enlaza a la versión en español del libro en Amazon.
Crear controles deslizantes multilingües
Dado que los controles deslizantes son básicamente una colección de imágenes, puedes utilizar el mismo enfoque para traducir un control deslizante de imágenes o un carrusel que contenga varias imágenes.
Simplemente tendrás que pasar el cursor sobre cada imagen que deba traducirse, hacer clic en el icono del lápiz y seleccionar aquella con la que deseas reemplazarla en un idioma diferente.
Si las imágenes del control deslizante contienen enlaces a determinados archivos multimedia locales o incluso enlaces externos, puedes utilizar el “Enlace de anclaje” para personalizarlo según el idioma seleccionado.
Así es como se ve el control deslizante de ejemplo cuando cambias de idioma en la interfaz.
No está mal para unos 10 segundos de tu tiempo.
Concluyendo
La traducción de imágenes en WordPress mediante TranslatePress sigue ahora el mismo enfoque visual intuitivo que se utiliza para traducir cualquier tipo de contenido (ya sea Bloques de Gutenberg, Elementor contenido, formularios, ventanas emergentes y más).
TranslatePress Multilingüe
Debido a su enfoque de traducción de interfaz, puedes utiliza TranslatePress para traducir todo el contenido de su sitio web, independientemente de cómo haya sido creado.
¿Todavía tienes alguna pregunta sobre la traducción de imágenes en WordPress? ¡Háznoslo saber en los comentarios!
Si encontraste útil esta publicación, por favor visita nuestro Canal de YouTube, donde subimos constantemente tutoriales en video cortos y fáciles de seguir. También puedes seguirnos en Facebook y Twitter ser el primero en enterarte cada vez que publicamos.
Hola, ¿cómo puedo cambiar la imagen de fondo?
Hola, me gustaría saber si para fines de SEO, si una imagen va a ser la misma en todos los idiomas, ¿debería hacer algún tipo de traducción?
Sí, ayudaría a tu SEO traducir el texto alternativo de la imagen para cada idioma, incluso si la imagen sigue siendo la misma.
Gracias por su respuesta, cuando traduzco el texto alternativo de la imagen, ¿se duplica la imagen? ¿O es la misma imagen con la referencia a los otros idiomas también?
Gracias.
Es la misma imagen, no está duplicada al traducir el texto alternativo. Solo el texto alternativo será diferente según el idioma.
¿Pero deberías usar imágenes diferentes con nombres de archivo diferentes para fines de SEO? Me refiero al caso en el que la imagen es exactamente la misma. ¿Deberías traducir solo el texto alternativo, o habría algún beneficio en subir también nombres de archivo diferentes?
No, traducir el texto alternativo es todo lo que se necesita. A menos que la imagen contenga texto en un idioma determinado, no es necesario subir una diferente.
¿Es posible traducir o cambiar las imágenes destacadas de los portafolios en cualquier versión de TranslatePress?
Sí, la traducción de imágenes funciona igual en todas las versiones.
¿Cómo se cambia una imagen de fondo? ¿Hay CSS que pueda aplicar?
Sí, tenemos una clase a la que puedes dirigirte que tiene un nombre basado en el idioma, por lo que puedes hacer algo como:
body.translatepress-ro_RO{ background: red; }Hola, ¿puede cambiar un elemento como el logotipo del sitio web?
El logotipo es una imagen con texto diferente según el idioma actual.
¿Hay algún método o variable disponible que pueda usar para cambiar el logotipo según el tema actual?
¡Hola! Deberías poder traducir un logotipo de la misma manera que cualquier otra imagen en el sitio, siempre y cuando sea un formato de archivo de imagen estándar (png, jpg, etc.) y no un formato de archivo SVG.
Hola,
Mi sitio web está originalmente en francés. He creado una versión en inglés.
He subido imágenes traducidas, pero una vez guardadas, las imágenes originales en francés siempre vuelven al artículo en inglés.
¿Podrías ayudarme por favor?
¿Hay alguna forma de traducir también las descripciones de las imágenes? Ya que en mi sitio el texto alternativo y el título se traducen, pero la descripción se queda en inglés.