Last updated on October 18, 2023

WPML language switcher position

Don’t know where to add this snippet? Read our guide: How to add code snippets.

Change the position of the WPML language switcher.

The WPML language switcher position refers to the placement of the language switcher on your WordPress website. By default, WPML adds the language switcher to the navigation menu. However, you may want to customize the position of the language switcher based on your website’s design or layout.

To achieve this, you can use the wp_nav_menu_items filter hook to add the language switcher to a different location in your theme. Here’s an example code snippet that demonstrates how to move the language switcher to the header area of your website:

function wpsnippets_move_language_switcher( $items, $args ) {
    // Check if the current menu is the primary navigation menu
    if ( $args->theme_location == 'primary' ) {
        // Get the language switcher HTML
        $language_switcher = do_shortcode( '[wpml_language_selector_widget]' );

        // Add the language switcher to the beginning of the menu items
        $items = $language_switcher . $items;
    }

    return $items;
}
add_filter( 'wp_nav_menu_items', 'wpsnippets_move_language_switcher', 10, 2 );

In this code snippet, we define a custom function wpsnippets_move_language_switcher that takes two parameters: $items (the current menu items HTML) and $args (the menu arguments). We then check if the current menu is the primary navigation menu by comparing the $args->theme_location with the desired menu location (e.g., 'primary').

If the condition is met, we use the do_shortcode function to retrieve the HTML output of the WPML language switcher widget using the [wpml_language_selector_widget] shortcode. We then concatenate the language switcher HTML with the existing menu items ($items) and return the modified menu items.

Finally, we hook our custom function to the wp_nav_menu_items filter using the add_filter function.

By using this code snippet and modifying the condition and placement logic, you can easily customize the position of the WPML language switcher on your WordPress website.

Examples

Example 1: Display WPML language switcher in the header

This example demonstrates how to display the WPML language switcher in the header of your WordPress website.

function wpsnippets_display_language_switcher_header() {
    if ( function_exists( 'icl_get_languages' ) ) {
        $languages = icl_get_languages();
        if ( ! empty( $languages ) ) {
            echo '<ul class="language-switcher">';
            foreach ( $languages as $language ) {
                echo '<li><a href="' . esc_url( $language['url'] ) . '">' . esc_html( $language['native_name'] ) . '</a></li>';
            }
            echo '</ul>';
        }
    }
}

Explanation:

  • The wpsnippets_display_language_switcher_header function checks if the WPML plugin is active and retrieves the available languages using the icl_get_languages function.
  • It then loops through each language and outputs a list item with a link to the language URL.
  • Finally, it wraps the language switcher in a <ul> element with the class language-switcher.

Example 2: Display WPML language switcher in the footer

This example demonstrates how to display the WPML language switcher in the footer of your WordPress website.

function wpsnippets_display_language_switcher_footer() {
    if ( function_exists( 'icl_get_languages' ) ) {
        $languages = icl_get_languages();
        if ( ! empty( $languages ) ) {
            echo '<ul class="language-switcher">';
            foreach ( $languages as $language ) {
                echo '<li><a href="' . esc_url( $language['url'] ) . '">' . esc_html( $language['native_name'] ) . '</a></li>';
            }
            echo '</ul>';
        }
    }
}

Explanation:

  • The wpsnippets_display_language_switcher_footer function is similar to the previous example, but it outputs the language switcher in the footer instead of the header.

Example 3: Display WPML language switcher in a custom widget

This example demonstrates how to display the WPML language switcher in a custom widget area of your WordPress website.

function wpsnippets_display_language_switcher_widget() {
    if ( function_exists( 'icl_get_languages' ) ) {
        $languages = icl_get_languages();
        if ( ! empty( $languages ) ) {
            echo '<ul class="language-switcher">';
            foreach ( $languages as $language ) {
                echo '<li><a href="' . esc_url( $language['url'] ) . '">' . esc_html( $language['native_name'] ) . '</a></li>';
            }
            echo '</ul>';
        }
    }
}

Explanation:

  • The wpsnippets_display_language_switcher_widget function is similar to the previous examples, but it is intended to be used in a custom widget area.
  • You can add this function to your theme’s functions.php file or create a custom plugin to register a widget area and display the language switcher using a widget.
Last updated on October 18, 2023. Originally posted on January 12, 2024.

Leave a Reply