Seleccionar página

Existen varias opciones para añadir varios idiomas a una web. Es decir, disponer de tu página web traducida a varios idiomas diferentes. La forma más compleja, cara, pero que aporta una mayor calidad es que realicemos nosotros las traducciones y utilicemos un plugin de idiomas para WordPress.

Pero como imagináis existe otra forma, más sencilla y mucho más económica, pero no tan profesional. Me refiero a instalar un plugin que muestre un selector de idiomas y realice las traducciones automáticas a través del traductor de Google (Google translate)

En este post nos vamos a centrar en esta segunda opción. Vamos a ver, como implementar varios idiomas en una página web WordPress de una forma super sencilla y barata, ya que no tendremos que hacer traducciones manuales. Es decir, vamos a realizar las traducciones de la web WordPress de manera automática con un plugin de traducciones que utiliza el motor de Google Translate.

 

 

 

suscripción 10€/mes cursos joaquin barberá horizonweb

VER CURSOS

 

 

1.- Características de una página web WordPress con un plugin de traducciones automáticas a diferentes idiomas.

 

La implementación de traducciones del traductor de Google en una página web realizada con WordPress es muy sencilla y se realiza a través de un plugin gratuito.

No vamos a realizar traducciones manuales. El traductor de Google (Google translate) se encargará de realizar las traducciones de manera automática.

No se generan nuevas páginas para cada idioma, por lo que Google no va a indexar la web en varios idiomas. El plugin genera una capa superpuesta al cliente para que vea la página traducida, pero Google no va a indexar esos contenidos traducidos.

Podremos mostrar las opciones de traducción (selector de idiomas) en posiciones muy variadas, gracias a los shortcodes que proporciona el plugin de traducciones automáticas.

Podremos mostrar el selector de idiomas, con o sin banderitas. Opcionalmente podremos mostrar una barra en la parte superior con opciones de Google Translate.

También podremos mostrar un elemento con forma de botón flotante que en el plugin denominan: Floating Widget (pero que no es un widget, no nos confundamos). Este elemento aparece por defecto en la parte inferior de la página y permanece siempre visible al hacer scroll.

En el momento de escribir este post, el plugin que vamos a utilizar nos permite realizar traducciones hasta en 104 idiomas diferentes.

 

 

2.- Configuración del plugin Google Language Translator para traducciones idiomas en WordPress

 

En primer lugar procederemos a instalar el plugin Google Language Translator-> IR AL PLUGIN

Una vez instalado y activado el plugin, accederemos a las opciones de configuración desde: “Ajustes > Google Language Translator”

 

 

2.1.- Configuraciones principales plugin idiomas Google, bloque: Main Settings

 

En este bloque de configuración encontraremos las siguientes opciones:

i.- Plugin Status: si marcamos el check box, el plugin estará activo y funcionando. Si desmarcamos esta opción, el plugin no estará activo.

ii.- Choose the original language of your website: en esta opción debes seleccionar el idioma principal u original con el que está escrita la página web. Aquí debes elegir: “Spanish”

iii.- What languages Will be active?: Ahora seleccionaremos los idiomas que queremos estén disponibles para que los visitantes de la web los puedan seleccionar y que se realicen las traducciones automáticas.

 

plugin idiomas google translate wordpress

Configuraciones principales plugin idiomas Google Translate para WordPress

 

 

2.2.- Previsualización del selector de idiomas: Preview

 

El “bloque preview” nos da una previsualización del selector de idiomas que podremos añadir al sidebar o footer de nuestra página web a través de un shortcode.

También nos indica el orden en el que se mostrarán los idiomas en el selector de idiomas y en el widget flotante de idiomas.

Si quieres cambiar el orden de los idiomas, pon el ratón sobre una bandera, haz clic con el botón izquierdo del ratón y arrastra la bandera hasta su nueva posición.

 

previsualizacion selector de idiomas wordpress google translator

Previsualización del selector de idiomas de la web

 

 

 

2.3.- Configuración iconos banderas de idiomas: Advanced settings

 

En el bloque advanced settings te pueden aparecer diferentes opciones según los idiomas que hayas seleccionado.

Este apartado sirve para establecer el tamaño de las banderas que aparecen en el selector de idiomas y para elegir que bandera aparecerá cuando existen varios países que utilizan un mismo lenguaje, por ejemplo (EEUU y Reino Unido, o Brasil y Portugal)

i.- Select flag size: selección del tamaño, en píxeles, de las banderas del selector de idiomas.

ii.- Flag for english: Seleccionar bandera para idioma inglés

iii.- Flag for spanish: seleccionar bandera para español

iv.- Flag por portuguese: seleccionar bandera para idioma portugués.

 

 

2.4.- Configuración Selector de idiomas: Language Switcher Settings

 

En este apartado vamos a ver que opciones de configuración tenemos con respecto al selector de idiomas. Es decir, el elemento que utilizan los visitantes para elegir en que idioma quieren visualizar la página.

i.- Language switcher widt: esta opción sirve para establecer la anchura del selector de idiomas.

ii.- Language switcher text color: aquí elegiremos el color del texto que aparece dentro del selector de idiomas (Texto: Seleccionar idioma)

iii.- Language Switcher background color: aquí seleccionaremos el color de fondo del selector de idiomas.

iv.- Show flag images: si marcamos esta opción, se mostrarán las banderas correspondientes a cada idioma disponible en la parte superior del selector.

v.- Show or hide the language Switcher: si marcamos la opción “Show language switcher” mostraremos el selector de idiomas modo texto. Si marcamos la opción: “hide language switcher” ocultaríamos el selector de idioma en modo texto y solo se mostrarían las banderitas.

vi.- Layout options: Aquí seleccionaremos si los elementos del selector queremos que aparezcan uno debajo del otro (modo vertical) o uno al lado del otro (modo horizontal)

vii.- Show Google Toolbar: con esta opción estableceremos si queremos que se muestre en la parte superior de la web una barra de apoyo proporcionada por Google Translator.

viii.- Show Google Branding: con esta opción seleccionaremos si queremos que se muestre el texto: “Con la tecnología de Google Traductor de Google” en el selector de idiomas.

ix.- Align the translator left or right: con esta opción estableceremos si queremos que el selector de idiomas quede alineado a izquierda (left) o derecha (right).

 

ajustes selector de idiomas wordpress

Opciones de configuración del selector de idiomas web

 

 

2.5.- Botón flotante de traducción en WordPress: Floating Widget Settings

 

Desde este apartado configuraremos el botón flotante (siempre visible) que aparece en la parte inferior de la página, con el texto por defecto: “Translate”

Al hacer clic sobre el elemento, se mostrarán las diferentes banderitas de idiomas, para que seleccionemos la traducción que queremos realizar.

i.- Show floating translation widget?: si marcamos la opción: “Yes, show widget” el botón flotante de traducción se mostrará. Si por el contrario, elegimos la opción: “No, hide widget”, el elemento no se mostrará.

ii.- Custom texto for de floating widget: en este campo pondremos el texto que queremos que se muestre en el elemento flotante

iii.- Allow floating widget text to translate?: si marcamos esta opción, el contenido de texto del botón se traducirá cada vez que seleccionemos un idioma. El texto correspondiente al que hayamos seleccionado como idioma principal será el que pongamos en el campo que hemos visto en el apartado ii (custom text for de floating widget).

iv.- Floating widget position: desde este selector podremos personalizar la posición en la que se mostrará este botón flotante de ayuda para traducción.

v.- Floating widget Text Color: aquí seleccionaremos el color del texto del interior del botón flotante.

vi.- Floating widget Background color: seleccionaremos el color de fondo del botón de traducción flotante.

 

ajustes botón flotante trasnlate

Configuración del botón flotante de google translate

 

 

3.- Formas de mostrar los selectores de idiomas en la web  WordPress

 

Vamos a ver ahora las diferentes maneras que tenemos de colocar los elementos de traducción que nos aporta el plugin.

 

 

3.1.- Colocación del selector de idiomas WordPress

 

El selector de idiomas puedes colocarlo en páginas, posts y áreas de widgets como la barra lateral o el footer. Para ello has de poner el siguiente shortcode en la pestaña de HTML del editor:
[google-translator]

 

 

3.2.- Botón flotante de idiomas o traducción automática

 

Las opciones para mostrar o no el botón flotante de traducción, y su posición las tienes en: “Ajustes > Google Language Translator”. Tienes todas las opciones en el apartado 2.5

 

 

3.3.- Barra flotante de Google Translate en cabecera

 

Para mostrar u ocultar la barra de Google Translate del header has de ir a “Ajustes > Google Language Translator”. Lo tienes en el apartado 2.4 vii

 

 

3.4.- Mostrar banderas en menú (selector idiomas en menú con banderas)

 

Para mostrar banderas, como selector de idiomas, en el menú superior de wordpress tendrás que realizar el siguiente proceso:

i.- Gestión de menús: acceder a la página de gestión del menú en wordpress: “Apariencia > Menús”

ii.- Activar Descripción: para activar el campo descripción, haz clic en el botón: “Opciones de pantalla” que aparece en la parte superior-derecha. A continuación, marca la opción: “Descripción”.

iii.- Añade un elemento “Enlaces personalizados”: ve a un elemento tipo «Enlaces personalizados”. Borra el contenido del campo URL y en el campo “Texto del enlace” pon el idioma que quieres colocar (este texto no se mostrará). Por ejemplo: IDIOMA INGLÉS

Añade el elemento al menú.

iv.- Campo descripción: En el campo descripción escribe el siguiente shortcode (para idioma inglés):

[glt language="English" label="English" image="yes" text="yes" image_size="24"]

y guarda el menú.

 

Debes repetir el proceso para cada bandera (idioma) que quieras añadir al menú. El shortcode lo debes modificar para cada idioma. Por ejemplo para español sería:

[glt language="Spanish" label="Spanish" image="yes" text="yes" image_size="24"]

 

poner selector idiomas en menú de wordpress o header

Cómo añadir sector de idiomas al menú wordpress

 

 

Compártelo ya!!
Curso gratis de wordpress y divi

▷LLÉVATE EL CURSO WORDPRESS Y DIVI GRATIS

Aprende a crear una página web con Wordpress y Divi

22 vídeos gratis

Consentimiento

Vé a tu buzón de correo y confirma la suscripción. Si no encuentras el correo de confirmación mira en la carpeta de SPAM.

Abrir chat
¿Dudas sobre mis cursos o servicios?
🙋🏻‍♂️** ¿Alguna duda sobre mis cursos o servicios? Soy Joaquín, cuéntame y te ayudo encantado
**Accede a TODOS mis cursos por solo 10 €/mes desde cursotiendaonline.com