Weglot + FinSweet language dropdown selector issue

I am currently using the Finsweet Weglot dropdown selector and have encountered a couple of issues:

  1. When selecting a language, the dropdown does not close automatically. This behavior is also evident in Finsweet’s example: [https://finsweet.com/weglotuikit.](https://finswer weglot ui)
  2. I would like to change the background color of the currently selected language when the dropdown is open, but I am unable to locate the option to do so. I want a different color for the background when the dropdown is closed. when its open then the background and font color of the other items should have an other color like how its in when you load the website in English. but in Dutch the whole design is fucked up. also the arrow should only be on the top element and not shown for the options.

I would appreciate any guidance you could provide regarding these issues.

Hi there!

I see you’re having an issue with the language selector we worked on with Finsweet.

The issue might be coming from the JS code of Finsweet but I might be able to help you out.
You could try putting this code towards the bottom in your HTML file (ideally right before the closing tag). Then, check if the switcher auto-closes after the language changes.

<script>
function closeSwitcherAfter(){
       var switcher = document.querySelector('.wg-dd-2-list');
       if(switcher){
               switcher.addEventListener('click',function() {
                       switcher.classList.remove('w--open');
           switcher.style.display = "none";
               });
       }
}
Weglot.on("languageChanged", closeSwitcherAfter);
</script>

However, it appears that your issue might already be fixed, as both languages have different backgrounds. Plus, the arrow of the second language is no longer visible as you can see in the photo I attached.
Capture d’écran 2024-09-23 à 12.48.44

If you still need further help, don’t hesitate to contact us at support@weglot.com :) hope this helps!