En esta publicación
En esta publicación
No importa qué tipo de sitio tengas, la forma más fácil de permitir que los visitantes vean tu contenido en su idioma preferido es con un Selector de idioma de WordPress.
En resumen, los conmutadores de idioma pueden ser texto, un botón o un menú desplegable en una página en el que los usuarios pueden hacer clic (o tocar) para traducir el contenido a otro idioma. Generalmente, encontrará conmutadores de idioma de WordPress en el encabezado, pie de página o navegación.
No importa qué forma tome tu selector de idioma, lo importante es ofrecer a los visitantes una forma conveniente de cambiar a su idioma preferido. Es esencial para mejorar la experiencia general del usuario de cualquier sitio web multilingüe o tienda de comercio electrónico.
En este tutorial, veremos algunos ejemplos de selectores de idioma en sitios web populares y cubriremos cómo puedes agregar uno a tu sitio con TranslatePress.
Empecemos.
5 Ejemplos de sitios web de WordPress con selectores de idioma
Los selectores de idioma pueden adoptar muchas formas, desde códigos de idioma y banderas hasta menús desplegables y texto localizado.
Veamos una variedad de ejemplos del mundo real de cambiadores de idioma.
1. WordPress.org
El oficial WordPress.org el sitio muestra un cuadro de texto verde prominente en el centro de la página de inicio que pregunta a los visitantes si desean cambiar de idioma. El sitio utiliza la geolocalización para detectar automáticamente la ubicación del visitante y luego ofrece el idioma más apropiado para su ubicación.
Los selectores de idioma como este llaman la atención y son difíciles de pasar por alto. Es importante destacar que ofrecen una forma sencilla para que los visitantes cambien rápidamente a su idioma preferido sin tener que buscar el selector de idioma en la página.
2. Syde
La agencia alemana de WordPress Syde muestra códigos de idioma sencillos en la esquina superior derecha de su sitio. Los visitantes pueden elegir entre Alemán e inglés. Los códigos de idioma son fáciles de detectar y claros; no hay confusión sobre cuál es cada uno de los idiomas en este WordPress. sitio web multilingüe.
3. WP Seguro y Sonoro
La agencia de desarrollo web WP Safe & Sound ofrece su contenido en francés e inglés mediante un simple botón selector de idioma en la parte superior derecha de la página.
Usar el nombre completo del idioma —“Français” en lugar de “French”, como lo conocen en general los hablantes de inglés— es más fácilmente reconocible, sin mencionar que es respetuoso con los francófonos.
4. Suecia Sverige
El sitio web oficial de Suecia es un repositorio de datos sobre el país. El selector de idioma se muestra en su menú principal, por lo que tienes que hacer clic para encontrarlo, sin embargo, una vez que abres el menú, es bastante fácil de identificar.
El inglés es el idioma predeterminado para el sitio, con contenido también disponible en árabe y ruso.
5. Marinero
Mariener Eyewear tiene su sede en los Países Bajos e inventó originalmente las lentes reflectantes mate. El sitio, construido sobre WooCommerce, ofrece traducciones en inglés y holandés.
Este sitio es un gran ejemplo de por qué necesitas hablar el idioma de tus clientes. De hecho, existe un vínculo innegablemente fuerte entre el contenido multilingüe y la probabilidad de que un cliente realice una compra.
Common Sense Advisory encuestó a 2,430 consumidores web en ocho países para conocer cómo el idioma afectaba sus hábitos de compra en el comercio electrónico y encontró:
- El 72,11 % de los consumidores pasa la mayor parte o la totalidad de su tiempo en sitios web en su propio idioma.
- El 72,41 % de los consumidores afirmó que se sentiría más inclinado a comprar un producto si la información estuviera en su propio idioma.
- El 56,21 % de los consumidores afirmó que la posibilidad de obtener información en su propio idioma es más importante que el precio.
Para enfatizar ese último hallazgo, más de la mitad de los consumidores están dispuestos a pagar más si usted está dispuesto a darles información en sus propios idiomas.
3 Maneras de Añadir un Conmutador de Idioma a tu Sitio de WordPress
Para agregar un selector de idioma de WordPress, necesitarás instalar TranslatePress, un plugin de traducción de WordPress fácil de usar.
Está disponible para descargar gratis en WordPress.org, así que desde la interfaz de administración de WordPress, navega a Plugins → Añadir Nuevo y busca “TranslatePress”.
TranslatePress te permite traducir todo tu sitio de WordPress directamente desde la interfaz de usuario, mediante una interfaz de traducción visual muy intuitiva.
Esto incluye todo, desde publicaciones y páginas, tipos de publicaciones personalizadas, salida de los complementos, códigos cortos, a formularios de contacto o incluso imágenes que contienen texto.
También funciona directamente con plugins populares como WooCommerce o Elementor, como verás a continuación.
La interfaz intuitiva de ’TranslatePress» permite realizar traducciones tanto manuales como automáticas. Para agilizar el proceso, puedes traduce automáticamente tu sitio utilizando Google Translate o DeepL y luego haz ediciones manuales adicionales.
Si tienes un WordPress multisitio, te alegrará saber TranslatePress es compatible con redes multisitio, para que pueda crear selectores de idioma multisitio.
A continuación te explicamos cómo configurar TranslatePress y crear uno de los tres tipos diferentes de selector de idioma para WordPress: código corto, elemento del menú, y selección de idioma flotante.
1. Elige tus idiomas
Una vez que hayas instalado y activado TranslatePress en el panel de administración de WordPress, ve a Configuración → TranslatePress. en el General configuración, selecciona tu idioma principal y agrega cualquier otro idioma que desees añadir a tu sitio web multilingüe de WordPress.
En este ejemplo, he añadido el francés, pero puedes añadir tantos idiomas como quieras con la versión premium de TranslatePress.
2. Personaliza tu selector de idioma
Hay tres opciones para agregar un conmutador de idioma a su sitio:
- Código corto – Puedes agregar el código corto para mostrar un selector de idioma en cualquier página o widget. Esto también funciona directamente como un bloque Gutenberg de selector de idioma.
- Elemento del menú – Ir a Apariencia → Menús para añadir idiomas a tu navegación.
- Selección de idioma flotante – Agregar un menú desplegable flotante que se muestre en cada página de tu sitio.
Veamos cada opción con más detalle.
Conmutador de idioma de código corto
La opción de código corto te permite añadir un selector de idioma de WordPress en cualquier lugar de tu sitio que admita códigos cortos. Con el editor de Gutenberg, esto funciona como un bloque de selector de idioma.
En el Cambiador de Idioma pestaña, hay seis opciones para configurar lo que se muestra en el selector de idioma:
Elige una de las opciones de arriba, haz clic Guardar cambios y luego añade el shortcode o el bloque donde quieres que se muestre tu selector de idioma.
Para este ejemplo, quiero añadir un selector de idioma al pie de página de mi sitio. Para hacer esto, en el panel de WordPress ve a Apariencia → Widgets, y abre la sección Pie de página. Haz clic en el botón “+” icono para agregar un bloque y comience a escribir “selector de idioma” en la barra de búsqueda. Inmediatamente verá el Cambiador de Idioma bloque que puedes simplemente añadir al pie de página.
En el front-end, el widget de cambio de idioma muestra un cuadro desplegable que permite a los visitantes cambiar de idioma:
2. Elemento del menú
La opción del menú te permite añadir idiomas a la navegación de tu sitio de WordPress.
De nuevo, hay cinco opciones para lo que muestra el selector de idioma:
- Nombres completos del idioma
- Nombres cortos de idiomas
- Banderas con nombres completos de idioma
- Banderas con nombres cortos de idiomas
- Solo banderas
Elige una de las opciones de visualización y luego ve Apariencia → Menús para agregar idiomas a tu navegación como así:
En el front-end, la navegación principal de mi sitio ahora muestra el texto del selector de idiomas francés e inglés:
Si deseas mostrar tu selector de idiomas como un menú desplegable, tendrás que usar el Idioma actual opción también. Colóquela como un elemento en el menú y luego coloque sus idiomas como sub-elementos debajo de ella así:
Si solo ofreces dos opciones de idioma y quieres que tu selector de idioma muestre siempre el idioma opuesto al que está actualmente el sitio web, puedes usar el Idioma opuesto artículo. Para esta configuración, tampoco es necesario agregar los idiomas.
3. Selección de idioma flotante
Los menús desplegables flotantes ofrecen una forma conveniente para que los visitantes cambien a su idioma preferido ya que se muestran en cada página de tu sitio.
Con TranslatePress, puedes personalizar el aspecto y el funcionamiento de tu menú desplegable flotante (e incluso desactivarlo si lo deseas) en el mismo Cambiador de Idioma pestaña.
Puedes elegir dónde quieres que se muestre el selector de idioma de WordPress, cómo quieres que se vea y también cómo debe actuar.
Una vez que hayas seleccionado y guardado tus opciones, simplemente actualiza la parte frontal de tu sitio para ver cómo se ve.
No importa qué tipo de selector de idioma de WordPress elijas para tu sitio, estás proporcionando una forma sencilla y conveniente para que los visitantes lean tu sitio en su idioma preferido.
No olvides configurar el resto de los ajustes del plugin, incluyendo si quieres usar TranslatePress AI para traducción automática instantánea (ir a Configuración → Traducción automática pestaña.
Lo único que tienes que hacer es recorrer tu sitio web, página por página, utilizando el editor de traducción visual. Solo tienes que hacer clic para seleccionar un texto concreto de tu sitio web, introducir tus traducciones y pasar al siguiente fragmento de texto. ¡Tu sitio web quedará totalmente traducido con TranslatePress en un abrir y cerrar de ojos!
Para más información, consulta nuestra guía completa sobre Cómo crear un sitio web WordPress multilingüe.
4 Mejores prácticas para selectores de idioma de WordPress
Ahora que sabes cómo agregar un selector de idioma de WordPress a tu sitio, cubramos algunas prácticas recomendadas importantes antes de lanzar tus nuevos idiomas.
1. Asegúrate de que sea fácil de encontrar
Asegúrate de que tu selector de idioma de WordPress sea visible y fácil de encontrar. No debería tomarle a los visitantes más de un segundo encontrarlo. Te recomiendo colocar tu selector de idioma en la cabecera, pie de página o navegación de tu tema multilingüe ya que son ubicaciones que los visitantes suelen consultar cuando quieren cambiar de idioma.
Muchos sitios web se adelantan al cambio de idioma mediante la detección automática de la ubicación geográfica, que establece el idioma correspondiente a esa zona. Esto evita que los visitantes tengan que cambiar de idioma manualmente, lo que ofrece una experiencia de usuario más fluida. También puedes hacerlo con TranslatePress, utilizando el Complemento de detección automática de idioma del usuario.
Incluso en este caso, asegúrate de agregar también un selector de idioma a tu sitio web multilingüe en caso de que el visitante quiera navegar por tu sitio en el idioma original.
2. Limitar el número de idiomas utilizados
Sé selectivo con la cantidad de idiomas que añades a tu sitio. Solo porque plugins multilingües normalmente proporciona docenas de idiomas diferentes, no significa que deba habilitar todos y cada uno de ellos. Solo agregue los idiomas que necesita para sus audiencias objetivo.
Además, ten en cuenta que en muchos países, la gente habla varios idiomas y puede haber más de un idioma oficial. Toma Suiza, por ejemplo, donde los idiomas oficiales son el francés, el alemán, el italiano y el romanche.
3. Estilo para que coincida con el diseño de su sitio
Si bien puede ser tentador (sin mencionar más fácil) usar el diseño predeterminado del selector de idioma proporcionado por la mayoría de los complementos de traducción, es una buena idea personalizar su apariencia para que coincida con los temas de su WordPress.
Esto podría ser tan fácil como configurar los ajustes de tu plugin o podría significar personalizar el CSS de tu tema.
Por defecto, TranslatePress tendrá en cuenta el estilo de tu sitio web a la hora de mostrar los shortcodes y los selectores de idioma del menú, por lo que no tendrás que hacer ningún esfuerzo adicional para personalizar el CSS.
4. Usar nombres de idiomas, no solo de banderas
Las banderas son una forma fácil de indicar idiomas, pero pueden confundir a los residentes de algunos países. ¿Por qué? Bueno, los idiomas no conocen fronteras.
Tome el portugués, por ejemplo. Como United Language Group explica, es la lengua oficial en Portugal, Brasil, Cabo Verde, Guinea-Bissau, Mozambique, Angola, Santo Tomé y Príncipe, Timor Oriental, Guinea Ecuatorial y Macao. También tiene presencia cultural en la India, Sri Lanka, Malasia, las islas ABC en el Caribe y la isla indonesia de Flores.
¿Entonces la bandera de qué país debería servir como representante del portugués?
Las banderas no son idiomas recomienda usar los nombres de los idiomas en su formato local en lugar de su nombre en inglés. Por ejemplo, para el japonés usarías 日本語 y para el español es Español.
Cómo empezar a añadir un selector de idioma de WordPress a tu sitio
TranslatePress facilita la incorporación de un selector de idioma de WordPress a tu sitio web, ofreciendo a los visitantes tres formas sencillas de cambiar de idioma: código corto, elemento de menú y selector de idioma flotante.
Para un resumen rápido, mira este breve video:
Como ya hemos explicado anteriormente, lo único que tienes que hacer es elegir el tipo de selector de idioma que prefieras, configurar las opciones básicas y TranslatePress se encargará del resto. No hace falta que te compliques con el código: simplemente funciona.
Si quieres soporte para más de dos idiomas o redirigir a los usuarios en función de su idioma, consulta todas las funciones premium de TranslatePress.
TranslatePress Multilingüe
No olvides ser selectivo al elegir idiomas para tu sitio multilingüe, es una buena práctica.
¿Tienes alguna duda sobre cómo configurar un selector de idioma de WordPress con TranslatePress? ¡Cuéntanoslo en los comentarios de abajo!
Gracias por compartir. Pensé que Google cambiaría los idiomas de los sitios de forma predeterminada. Me dirijo a algunos países europeos que hablan francés y español. Podría perder muchos clientes potenciales al mostrar solo en inglés. Instalaré una de sus recomendaciones de complementos.
Habría sido agradable tener la opción de tener el selector de idioma como una caja desplegable en la sección del menú. ¿Hay alguna forma de modificarlo de alguna manera?
Muy buen punto, Carlos. Esto ya está en nuestra lista de tareas pendientes y se implementará muy pronto.
En móviles, el selector de idioma está oculto dentro del menú.
Entonces un visitante necesitaría hacer clic en el ícono de hamburguesa para cambiar el idioma. Esto no es amigable para el usuario.
¿Por qué no hay una opción sencilla en la configuración de translatepress que permita mover el selector de idioma junto al icono de la hamburguesa, como ocurre con WPML?
Flotar no es una alternativa viable; ocupa demasiado espacio en dispositivos móviles.
¡Gracias!