Language Switcher Gutenberg block not working

This thread is resolved. Here is a description of the problem and solution.

Problem:
If you're using WPML with a custom FSE (Block) theme and notice that the dropdown CSS and JavaScript for the Language Switcher Gutenberg block are not being enqueued on the front page, even though they work in the Gutenberg editor.
Solution:
We recommend adding the following custom PHP code to your theme's

functions.php

file:

<!-- wpmlsupp-11260 --><br />add_action('init', function(){<br />    wp_enqueue_block_style('wpml/language-switcher', [<br />        'handle' => 'wp-block-navigation'<br />    ]);<br />});

This code manually enqueues the necessary styles for the language switcher block. If this solution doesn't resolve your issue, please open a new support ticket with us.

This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

Tagged: Bug

This topic contains 6 replies, has 2 voices.

Last updated by Kor 1 year, 6 months ago.

Assisted by: Kor.

Author	Posts
November 20, 2023 at 5:43 pm #14879913
billJ-4	I am using WPML with a custom FSE (Block) theme. When I try to use a dropdown language switcher via the Language Switcher Gutenberg block, its dropdown css and javascript get enqueued and work in the Gutenberg editor, but don't get enqueued when the front page is rendered. This happens even if my custom theme has nothing at all in its functions.php.I'm looking at the source of sitepress-multilingual-cms, but could use some help figuring out why my theme doesn't want to enequeue the block assets.
November 20, 2023 at 7:39 pm #14880609
billJ-4	I've installed the theme and the base Elementor plugin, as it's used on pages other than the front page and functions.php currently assumes it's installed. If you go into the Theme Editor and edit the front page, you'll see a dropdown Language Switcher just below the hero (image 1, shown hovered). But if you look at the rendered homepage at hidden link, you'll see it's displayed as a list (image 2). It appears that this is becauase the css and javascript for the language switcher block aren't being enqueued.
November 21, 2023 at 7:32 am #14882303
Kor WPML Supporter since 08/2022 Languages: English (English ) Timezone: Asia/Singapore (GMT+08:00)	Thanks for your reply. I've made some changes to the page hidden link and could you please check and see if it's what you're looking for?
November 27, 2023 at 4:28 pm #14932651
billJ-4	Thank you Kor, but I'm viewing it in a private window but not seeing any change on that page. I see a list of languages as shown in the earlier screenshot, but I would expect to see the language dropdown (because that's how the gutenberg block is configured). I checked the page source, and the dropdown css/js are still not being loaded on that page. Are you seeing something different? Is there a cache that might need to be cleared?
November 28, 2023 at 3:30 pm #14941435
Kor WPML Supporter since 08/2022 Languages: English (English ) Timezone: Asia/Singapore (GMT+08:00)	Thanks for your patience. I apologize for my mistake. I can see the issue now and please allow me to escalate this to our 2nd Tier Support for further assistance. I will come back to you once I have feedback.
November 29, 2023 at 2:37 pm #14952703
billJ-4	Excellent, thank you.
November 30, 2023 at 12:20 pm #14962059
Kor WPML Supporter since 08/2022 Languages: English (English ) Timezone: Asia/Singapore (GMT+08:00)	Thanks for your patience. Our 2nd Tier Support checked and this is a bug and a workaround to fix this would be to insert the custom PHP code below into your theme functions.php file . /** * @link wpmlsupp-11260 */ add_action('init', function(){ wp_enqueue_block_style('wpml/language-switcher', [ 'handle' => 'wp-block-navigation' ]); }); Let me know if it works for you.
December 2, 2023 at 5:09 pm #14978293
billJ-4	Manually enqueueing the content worked, thank you!