Índice del artículo
Genera un menú de cambio de idioma atractivo con WPML en WordPress
El propósito de este código es generar un menú de cambio de idioma en un sitio web utilizando el plugin de WordPress «WPML» (WordPress Multilingual Plugin).
Para el menú de cambio de idioma se utilizan los idiomas configurados en el plugin. Crea un menú desplegable con enlaces a cada idioma y resalta el idioma actualmente activo en el sitio.
Paso a paso: Código detallado para crear un menú multilingüe con WPML
- La función
tms_language_switcherestá envuelta en una comprobaciónif ( ! function_exists( 'tms_language_switcher' ) )para asegurarse de que no se produzca un conflicto si la función ya está definida en otro lugar.
if ( ! function_exists( 'tms_language_switcher' ) ) :
function tms_language_switcher() {
- La función comienza obteniendo la lista de idiomas disponibles utilizando la función
icl_get_languages. Esta función es proporcionada por el plugin WPML y devuelve un array con información sobre cada idioma configurado en el sitio.
$languages = icl_get_languages( 'skip_missing=0' );
- A continuación, se verifica si la lista de idiomas no está vacía.
if ( ! empty( $languages ) ) :
- Si la lista de idiomas no está vacía, se inicia la generación del menú de cambio de idioma. Se utiliza un elemento
<nav>con la clase «language-nav» para envolver el menú y se establece el atributoaria-labelcon el texto traducido «Language menu» para mejorar la accesibilidad. Dentro del</nav><nav>, se crea una lista desordenada<ul>con el id «menu-language» y la clase «menu» para representar los elementos del menú.
echo '<nav class="language-nav" role="navigation" aria-label="' . esc_attr__( 'Language menu', 'tms' ) . '">';
echo '<ul id="menu-language" class="menu">';
- Se recorre cada idioma en la lista de idiomas utilizando un bucle
foreach. Para cada idioma, se verifica si está activo (es decir, el idioma actual del sitio) y se le asigna la clase «current-menu-item» si es así.
foreach ( $languages as $language ) :
$current = 1 == $language['active'] ? ' current-menu-item' : '';
- Para cada idioma, se genera un elemento de lista
<li>con la clase «menu-item» y la clase «current-menu-item» si corresponde. Dentro de este elemento de lista, se crea un enlace<a>con el atributohrefestablecido en la URL del idioma y se muestra el código del idioma en mayúsculas utilizandostrtoupper( $language['language_code'] ).
echo '<li class="menu-item' . $current . '">';
echo '<a href="' . $language['url'] . '">';
echo strtoupper( $language['language_code'] );
echo '</a>';
echo '</li>';
- Después de completar el bucle
foreachy generar todos los elementos de lista para los idiomas, se cierra la lista desordenada</a></li></ul>y el</nav>.
echo '</ul>';
echo '</nav>';
Código completo para copiar y crear un menú de cambio de idioma en WordPress con WPML
<?php
if ( ! function_exists( 'tms_language_switcher' ) ) :
function tms_language_switcher() {
$languages = icl_get_languages( 'skip_missing=0' );
if ( ! empty( $languages ) ) :
echo '<nav class="language-nav" role="navigation" aria-label="' . esc_attr__( 'Language menu', 'tms' ) . '">';
echo '<ul id="menu-language" class="menu">';
foreach ( $languages as $language ) :
$current = 1 == $language['active'] ? ' current-menu-item' : '';
echo '<li class="menu-item' . $current . '">';
echo '<a href="' . $language['url'] . '">';
echo strtoupper( $language['language_code'] );
echo '</a>';
echo '</li>';
endforeach;
echo '</ul>';
echo '</nav>';
endif;
}
endif;
