Un intercambiador de idiomas le permite a los visitantes elegir el idioma en el cual leer los contenidos. WPML le permite agregar un intercambiador de idiomas en diversas maneras: en forma de menú, como un widget o al pie del sitio web. También es posible utilizarlo para mostrar enlaces arriba o debajo de las entradas para leerlas en otros idiomas.

Los intercambiadores de idiomas agregados por medio de WPML trabajan y se ven perfectos en todos los temas.

Ellos se pueden agregar y personalizar desde la página WPML -> Idiomas.

Opciones generales del intercambiador de idiomas

La primera sección de los intercambiadores de idioma corresponde a la configuración general como, por ejemplo, el orden de los idiomas. Advierta que todas esas opciones se aplican a los intercambiadores de idiomas agregados por usted.

Sección principal de las opciones del intercambiador de idiomas

Sección principal de las opciones del intercambiador de idiomas

Configuración para mantener los argumentos de las direcciones URL

La sección de las opciones del intercambiador de idiomas cuenta con una casilla denominada Mantener argumentos URL.

Los argumentos de las direcciones URL pueden ser utilizados por algunos plugines y puede ser necesario mantenerlos al momento de cambiar de idioma; ese es el propósito de esta función. Los argumentos a mantener deben ser agregados aquí en forma de lista separada por comas.

Cuadro de diálogo de

Cuadro de diálogo de “Mantener argumentos URL”

Consideremos el ejemplo siguiente:

  • Supongamos que usted agrega los argumentos siguientes: bar, foo.
  • Usted traduce la entrada “Hello world”.
  • En la interfaz de usuario, abra la entrada “Hello world” y agregue lo siguiente al final de la dirección URL: ?bar=10&foo=100&lost=1000 (advierta que agregamos los dos argumentos más el correspondiente a lost)
  • Cambie el idioma. La dirección URL terminará solo con ?bar=10&foo=100

Secciones diferentes para tipos de intercambiadores de idioma distintos

Cada tipo de intercambiador de idiomas tiene su propia sección. Las opciones para cada tipo de intercambiador de idiomas se aplican exclusivamente a su propio tipo. La página de Idiomas muestra una vista previa de los intercambiadores de idioma activos en su sitio web, tal como lo muestra la imagen siguiente.

Secciones diferentes para cada tipo de intercambiador de idiomas.

Secciones diferentes para cada tipo de intercambiador de idiomas.

Cada sección cuenta con su propio botón “agregar” (para poder agregar otro intercambiador de idiomas de su tipo), el ícono de un “lápiz” para editar el intercambiador existente y un ícono de “basura”.

Control total de cada intercambiador de idiomas

Cada tipo de intercambiador de idiomas tiene su configuración propia. Esto permite un control total e independiente de lo que se incluye y de cómo luzca.

Por ejemplo: la imagen siguiente muestra un cuadro de diálogo con la configuración de un intercambiador de idiomas de menú.

Configuración de un intercambiador de idiomas de menú.

Configuración de un intercambiador de idiomas de menú.

Vista previa operativa de las opciones de un intercambiador de idiomas

La vista previa se actualiza cuando usted cambia la configuración del intercambiador de idiomas. La vista previa es “esquemática”. No carga el código CCS de la página (no es una buena idea cargarla en la administración de WordPress), por lo que el intercambiador de idiomas mostrará un estilo diferente. Sin embargo, refleja los efectos de las distintas opciones, colores, orden y contenido.

Estructura HTML de un intercambiador de idiomas de menú

A partir de la versión 3.6, WPML no incluye el intercambiador de idiomas dentro del código HTML. En su lugar, intercala los elementos del intercambiador de idiomas en la estructura del menú. De esa forma, el tema presenta el intercambiador de idiomas tal como si fuera otro elemento del menú.

En esencia, permite que el intercambiador de idiomas se muestre más natural, con la presentación gráfica del tema.

Intercambiador de idiomas de menú en la pantalla de usuario

Intercambiador de idiomas de menú en la pantalla de usuario

Personalización del intercambiador de idiomas de menú

Específicamente para el intercambiador de idiomas de menú, la versión 3.6 de WPML agrega una clase CSS nueva: wpml-ls-menu-item. Esta permite simplificar la personalización de los elementos del intercambiador de idiomas de menú (enlaces).

Por ejemplo: si su sitio web utiliza el tema Twenty Sixteen y el intercambiador de idiomas de menú muestra solo banderas, la vista en la interfaz de usuario será extraña. Tal como puede apreciar en la imagen siguiente, al ancho de los elementos del menú es extrañamente grande.

Intercambiador de idiomas de banderas solamente con el tema Twenty Sixteen

Intercambiador de idiomas de banderas solamente con el tema Twenty Sixteen

Usted puede solucionar muy fácilmente este problema por medio de la clase CSS wpml-ls-menu-item.


li.wpml-ls-menu-item ul li a {

width: auto;

}

No hay necesidad de editar el archivo CSS del tema. Simplemente agregue directivas personalizadas a la sección CSS adicional en Opciones del intercambiador de idiomas.

Ahora, el ancho de los elementos mejoró, tal como se muestra en la imagen siguiente.

Intercambiador de idiomas de menú luego de aplicar CSS personalizado

Intercambiador de idiomas de menú luego de aplicar CSS personalizado

Mostrar un intercambiador de idiomas de WPML en lugares personalizados

A veces, es necesario presentar un intercambiador de idiomas en un lugar especial. Puede lograrlos desde dentro de las plantillas PHP del tema o directamente dentro de las páginas y entradas.

Advierta que la configuración general de un intercambiador de idiomas para lugares personalizados se define en el mismo lugar que los otros intercambiadores de idioma de su sitio: en la sección Opciones del intercambiador de idiomas, en la página Idiomas.

Utilizar acciones PHP

Para mostrar el intercambiador de idiomas dentro de la plantilla PHP del tema, puede utilizar una de las dos acciones siguientes:

  • do_action(‘wpml_add_language_selector’); muestra el intercambiador de idiomas de acuerdo a lo establecido en las opciones de la sección Intercambiador de idioma personalizado.
  • do_action( ‘wpml_footer_language_selector’ ); muestra el intercambiador de idiomas de acuerdo a lo establecido en las opciones de la sección Intercambiador de idiomas de pie, aun cuando la opción Mostrar intercambiador de idiomas en pie esté inhabilitada.

Utilizar shortcode de WPML

Dentro de entradas y páginas, es posible utilizar uno de los dos shortcode siguientes. Nuevamente: la diferencia radica en qué intercambiador de idiomas se esté mostrando.

  • [wpml_language_selector_widget] muestra el intercambiador de idiomas de acuerdo a lo definido en la sección Intercambiador de idiomas personalizado.
  • [wpml_language_selector_footer] muestra el intercambiador de idiomas de acuerdo a lo definido en la sección Intercambiador de idiomas de pie, aun cuando la opción Intercambiador de idiomas en pie esté inhabilitada.

Su propio intercambiador de idiomas personalizado

También tiene la opción de crear su propio y único intercambiador de idiomas. Un intercambiador de idiomas personalizado le permitirá incluir lo que usted quiera y de la forma que lo desee. La gente utiliza esta función a menudo para mostrar sus propias banderas de idioma u ordenar los idiomas a su manera.

Un intercambiador de idiomas personalizado

Un intercambiador de idiomas personalizado

Existen dos formas de hacerlo: por medio de plantillas Twig o de la API de PHP.

A partir de la versión 3.6, WPML incluye soporte para crear intercambiadores de idioma por medio de plantillas Twig. Esta es la forma más simple y preferida y no incluye programación PHP. Lo mejor de aprovechar estas plantillas es que son muy fáciles de incluir en los temas y aparecen como opciones de usuario.

La otra forma es creando un intercambiador de idiomas por medio de la API de PHP. Esta forma requiere de conocimientos sobre PHP.