Last updated on October 18, 2023

WPML language switcher in footer

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

Add WPML language switcher to the footer.

The WPML plugin is a popular choice for creating multilingual websites with WordPress. One common feature of multilingual websites is a language switcher, which allows users to switch between different language versions of the site. In this case, we want to add a language switcher to the footer of our WordPress site using WPML.

To achieve this, we can use the icl_get_languages() function provided by WPML to retrieve the available languages and their details. We can then loop through the languages and output the language switcher HTML markup.

Here’s an example code snippet that demonstrates how to add a WPML language switcher to the footer of your WordPress site:

function wpsnippets_add_language_switcher_to_footer() {
    if ( function_exists( 'icl_get_languages' ) ) {
        $languages = icl_get_languages( 'skip_missing=0' );

        if ( ! empty( $languages ) ) {
            echo '<ul class="language-switcher">';

            foreach ( $languages as $language ) {
                echo '<li>';
                echo '<a href="' . esc_url( $language['url'] ) . '">';
                echo esc_html( $language['native_name'] );
                echo '</a>';
                echo '</li>';
            }

            echo '</ul>';
        }
    }
}
add_action( 'wp_footer', 'wpsnippets_add_language_switcher_to_footer' );

In this code snippet, we first check if the icl_get_languages() function exists to ensure that WPML is active. Then, we retrieve the available languages using the icl_get_languages() function with the skip_missing=0 parameter to include languages even if they are not fully translated.

Next, we check if there are any languages available and if so, we output the language switcher HTML markup. We use a simple unordered list (<ul>) with list items (<li>) for each language. The language name is displayed as a link (<a>) with the URL of the corresponding language version.

Finally, we hook the wpsnippets_add_language_switcher_to_footer() function to the wp_footer action to ensure that the language switcher is added to the footer of every page on the site.

You can customize the HTML markup and styling of the language switcher to match your site’s design.

Examples

Example 1: Adding WPML language switcher in footer using a shortcode

This use case demonstrates how to add the WPML language switcher in the footer of your WordPress website using a shortcode.

function wpsnippets_wpml_language_switcher_shortcode() {
    ob_start();
    do_action('wpml_add_language_selector');
    return ob_get_clean();
}
add_shortcode('wpml_language_switcher', 'wpsnippets_wpml_language_switcher_shortcode');

In this example, we define a custom shortcode wpml_language_switcher that calls the wpml_add_language_selector action hook. This action hook outputs the WPML language switcher HTML. By adding this shortcode to your footer template or widget, you can display the language switcher in the footer of your website.

Example 2: Adding WPML language switcher in footer using a template tag

This use case demonstrates how to add the WPML language switcher in the footer of your WordPress website using a template tag.

function wpsnippets_wpml_language_switcher_footer() {
    do_action('wpml_add_language_selector');
}

In this example, we define a custom function wpsnippets_wpml_language_switcher_footer that calls the wpml_add_language_selector action hook. By calling this function in your footer template or widget, you can output the WPML language switcher HTML in the footer of your website.

Example 3: Customizing the WPML language switcher in footer

This use case demonstrates how to customize the WPML language switcher in the footer of your WordPress website by modifying the output HTML.

function wpsnippets_custom_wpml_language_switcher_footer() {
    ob_start();
    do_action('wpml_add_language_selector');
    $language_switcher = ob_get_clean();

    // Modify the language switcher HTML here

    echo $language_switcher;
}
add_action('wpml_add_language_selector', 'wpsnippets_custom_wpml_language_switcher_footer', 10);

In this example, we define a custom function wpsnippets_custom_wpml_language_switcher_footer that calls the wpml_add_language_selector action hook and captures the output HTML using output buffering. You can then modify the $language_switcher variable to customize the HTML as per your requirements. Finally, we echo the modified HTML to display the customized WPML language switcher in the footer of your website.

Last updated on October 18, 2023. Originally posted on January 13, 2024.

Leave a Reply