Hiding element on specific subdirectories

Hello, I have a site with two languages and some forms that open on button click (except for one in the footer). I’ve made one form for each language and placed them in each their div element. Now I want to hide the english form when displaying the norwegian site and vice versa. Previously I used weglot translator, and added a simple css code in their interface to do this. But can’t figure out how do do it in webflow after switching to their localization addon.

So now I’m stuck with both forms showing on both pages.

live sites;

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Anyone? I can’t figure out a way to talk to webflow support, so getting a bit frustrated here…

Read only link

Hi Anne, this is a community forum, so people will answer if and when they can.
Support is the button at the top right.

Locale-specific styling is an Enterprise feature, so you’d need to pay a fair bit more if you want that capability in the designer itself.

However you can do this with custom CSS.
I’m travelling so I can’t see your designer view, however look up the CSS lang pseudoselector.

You should be able to add a style block something like this to your page;

.my-button-1, .my-button-2 {
  display: none;
.my-button-1:lang(de) {
  display: block;
.my-button-2:lang(en) {
  display: block;

Use your button classes or IDs for the CSS selectors, hide them both, then make only one visible depending on the current language.

Use the language codes you want.

Put this in an Embed so that it functions in the designer as well.

If it’s on multiple pages, put it in a component and place it on those multiple pages.

Part of the advantage here is that you can switch off the CSS temporarily while during design work by using settings visibility hidden.

Thank you so much! I did find a similar way, but yours is better :slight_smile: