Saltar navegación
Actualizado
mayo 16, 2024

WPML te permite añadir un selector de idiomas al menú de tu web, como Widget o en el pie de página. También puedes incluir banderas, mostrar los idiomas con sus nombres nativos y añadir estilos personalizados.

Un selector de idioma permite a los visitantes seleccionar el idioma en el que quieren leer tu contenido. Dependiendo de tus preferencias, puedes mostrarlo en distintos lugares de tu web.

Por ejemplo, puedes colocar tu selector de idioma como un menú, en la sección de cabecera.

Language switcher in the header section
Selector de idioma en la sección de Cabecera

O, si no quieres editar el diseño de tu Cabecera, puedes colocar el selector de idioma en la parte inferior de tu sección de Pie de página.

Language switcher in the footer section
Selector de idioma en la sección Pie de página

Con WPML, puedes añadir fácilmente selectores de idiomas en tu propio sitio como los destacados anteriormente. Para ello:

  1. Decide dónde quieres mostrar el selector de idioma
  2. Añade una bandera a tu selector de idioma (o no)
  3. Estiliza tu selector de idiomas

Recuerda traducir tu web

Añadir un selector de idioma no hace que tu web esté disponible automáticamente en más idiomas. Para ofrecer idiomas adicionales en tu sitio, primero tienes que traducirlo.
Aprende a traducir fácilmente tu web con WPML.

1. Decide dónde mostrar el selector de idioma

WPML añade por defecto un selector de idioma al pie de página de tu sitio. Sin embargo, hay muchos otros lugares en tu sitio donde puedes añadir un selector de idioma:

  • Menús y Widgets
  • Por encima o por debajo del contenido de la Entrada
  • Plantillas, partes de plantillas y navegación por el sitio

¿Necesitas añadir un selector de idioma a los archivos de plantilla mediante PHP o a una Página o Entrada mediante Shortcodes? Más información sobre cómo añadir selectores de idiomas a las ubicaciones personalizadas.

Añade un selector de idioma a un Menú, Pie de página o Widget

Para añadir y personalizar selectores de idiomas a estas áreas específicas, ve a WPML Idiomas en el panel de WordPress.

Desde aquí, puedes añadir nuevos selectores de idiomas al menú o a un Widget, o puedes editar el selector de idiomas por defecto del pie de página.

Añadir o editar un selector de idiomas

Añadir un selector de idioma encima o debajo del contenido de la Entrada

También puedes enlazar a las traducciones de una Entrada o Página desde arriba o desde abajo del contenido de la Entrada. Esto muestra las otras traducciones disponibles como un enlace.

Para activarlo, ve a WPMLIdiomas y desplázate hasta Enlaces a la traducción de entradas. Marca la casilla para ver todas las opciones.

Habilitar enlaces a la traducción de las Entradas

Añadir un bloque selector de idioma a una Plantilla, Parte de Plantilla o Navegación

Si utilizas el Editor de sitios de WordPress (antes conocido como Full Site Editing), puedes añadir un selector de idiomas a cualquier plantilla o parte de plantilla utilizando el bloque Selector de idiomas WPML.

Añadir un bloque selector de idioma a la plantilla del sitio

Para que el bloque del selector de idioma aparezca en tus idiomas secundarios, tienes que traducirlo.

  1. Ir a WPMLAdministración de traducción.
  2. Busca la parte de tu sitio a la que has añadido el bloque selector de idioma (plantilla, parte de la plantilla, navegación del sitio, etc.).
  3. Envíalo a traducir.
Traducir la parte de la plantilla que contiene el bloque del selector de idioma
  1. Si lo traduces utilizando el Editor de Traducción Avanzado, copia los campos del selector de idioma al idioma secundario y haz clic en Completar.
Copiar el campo selector de idioma del idioma por defecto

El selector de idioma estará ahora visible en tu idioma secundario.

2. Añade una bandera a tu selector de idioma (o no)

Para añadir o eliminar una bandera en el bloque del selector de idioma, utiliza el conmutador de la configuración de visualización del selector de idioma en la barra lateral.

Añadir una bandera al bloque selector de idioma

Para añadir o eliminar una bandera en otro lugar, ve a WPMLIdiomas y edita el selector de idioma que quieras cambiar. A continuación, marca o desmarca la opción de la bandera.

Añadir una bandera a un selector de idioma en un pie de página

WPML incluye al menos la bandera de un país para cada idioma preconfigurado. Por defecto, las banderas utilizan el formato SVG. Sin embargo, puedes mostrar las banderas utilizando PNG en su lugar cambiando la configuración en WPML Idiomas.

%%tb-image-alt-text%%
Elegir el formato de archivo de la bandera en WPML Idiomas

También puedes subir tus propias banderas personalizadas. Lee más sobre cómo añadir banderas de idioma personalizadas a tu selector de idioma.

3. Estiliza tu selector de idioma

Además de mostrar o no una bandera, puedes personalizar otros aspectos de tu selector de idioma. Esto incluye establecer el orden de las lenguas, mostrar las lenguas con sus nombres nativos y establecer las preferencias de color.

Menú selector de idioma en la Portada

Ajustes globales

Puedes establecer ajustes globales para todos los selectores de idiomas de tu sitio, como el orden de los idiomas. Para ello, ve a WPMLIdiomas y desplázate hasta Opciones del selector de idioma. Estas opciones se aplicarán a todos los selectores de idiomas de tu sitio.

La sección principal de opciones del selector de idiomas

Ajustes por selector de idioma

También puedes especificar ajustes para cada selector de idiomas individual. Esto te permite un control total e independiente sobre lo que incluye y su aspecto. Las opciones que apliques a los selectores de idiomas en cada ubicación sólo se aplican a ese selector de idioma.

Por ejemplo, puedes mostrar sólo las banderas en el menú, pero las banderas y el nombre del idioma en el pie de página.

Para cambiar estos ajustes en el bloque del selector de idioma, selecciona el bloque y ajusta la configuración en la barra lateral.

Ajustes del bloque del selector de idiomas

Para otros selectores de idiomas, ve a WPMLIdiomas y edita el selector de idioma específico que quieras ajustar.

Configuración del selector de idioma del Pie de página

A medida que cambias los ajustes del selector de idioma, la vista previa se actualiza. La vista previa es un «esquema». No carga el CSS del front-end, por lo que el selector de idioma real tendrá un estilo diferente. Sin embargo, te muestra el efecto de las distintas opciones, ajustes de color, orden y contenido.

Selectores de idiomas personalizados

Por defecto, WPML utiliza las reglas CSS de tu tema para adaptar el selector de idioma al diseño y estilo de tu web. Si necesitas más opciones de personalización, puedes crear selectores de idiomas personalizados utilizando la API de PHP. Este enfoque requiere conocimientos de PHP.

Un selector de idioma flotante personalizado

Diagnosticar problemas con los selectores de idiomas

Los selectores de idiomas añadidos mediante WPML quedan bien en la mayoría de los temas. Si el selector de idioma no se muestra correctamente con tu tema, podría haber un conflicto de CSS. Lee nuestra guía para solucionar los problemas de estilo de los selectores de idiomas.

¿Aún no tienes WPML?

WPML puede ayudarte fácilmente a añadir y personalizar un selector de idioma en tu web. Para empezar, visita nuestra Página de precios para encontrar el plan adecuado para tu sitio.

Para saber más sobre cómo crear una web multilingüe con WPML, visita nuestra guía sobre cómo traducir tu web con WPML.