Streaming live at 10am (PST)

Language, locale and locale-specific content - Impossible with Webflow?

I’m trying to build a website that does the following:

  • Allows for the selection of multiple countries (locales).
  • Allows for the selection of multiple languages per locale.
  • Allows for the ability to blog for each locale.

Given that Webflow doesn’t have multilingual support, I’ve relied on the third party solution recommended by Webflow (Weglot) for language management.

Given that Webflow doesn’t allow for dynamically creating pages based on locale, I’m resorting to manually creating clones of my website for each locale (placed under country codes such as /us, /uk etc.).

So right now, I have a website with manually-created, country-specific pages, based on country codes, and which also use Weglot for language management.

My question is, how can I allow each country to blog for their given country in a way that’s going to fit with the URL structure that I’m setting up?

Collections don’t allow for the placement of collections under subfolders, but for SEO purposes I can’t exactly have each country’s blog be located in their own root-level subfolder.

I seem to be more or less forced to do the following:
[Root]
/us
L /us/page
/uk
L /uk/page
/usblog
/ukblog

Is there any way to achieve my desired result with Webflow? Or am I limited to only using root-level collections and pages, with a third party language management solution?

Bump.

Anyone able to help?

I’m looking to do something similar.

I have weglot set up and successfully translating my site but I want to show some blog posts on one of the languages and others on another. Some posts are not relevant to users in certain countries.

I understand that I can create multiple ‘collections’ in webflow - one for each languages blog (‘blog-en’, ‘blog-fr’ etc) but is there a way to detect which language I’m in and only show that collection?

Tagging @eugene_weglot as you seem to be very helpful elsewhere on the forum.

Thank you!

Hi @MattG,

This is a bit above my Webflow expertise unfortunately :sweat_smile: but here is a possible solution:

Basically:

  • You have all your blog posts in a Collection in your website original language (i.e: English)
  • You translate your blog posts in French with Weglot as usual
  • You add a specific selector to the ones you want to show only on the French version of your blog (.blog-fr for example)
  • You add the following CSS to your custom CSS in Weglot:
    html[lang="en"] .blog-fr { display: none!important; }
    html[lang="fr"] .blog-en { display: none!important; }

The goal is to hide the “blog post cards” on your blog homepage with CSS. I don’t know how Webflow will react to this. There might be an even better way to hide the blog posts with Javascript.

Hope this helps!
Eugene

Thanks @eugene_weglot that’s really helpful.

Webflow doesn’t allow you to put a class on to a div based on the collection data but I’ve added a little javascript as a work around.

  1. Add a field to the collection named ‘Hide in language’ and set this to ‘fr’, ‘en’ etc on the relevant blog posts.
  2. Render this field in a text block on each blog link and hide it with display: none. Give this text block a class of ‘languages-to-hide’
  3. With javascript, get the content of every element with the ‘languages-to-hide’ class and set that content as a data attribute. So we now have <div data-hide-lang="fr">Blog Link</div>
  4. Add the following CSS to hide based on that data attribute (and repeat for all languages) - html[lang=en] [data-hide-lang*=fr] { display: none;}
1 Like

Amazing! Could you share the blog URL (here or DM if you prefer) so I can check it out? It’s a great solution.

Thanks @eugene_weglot.
The blog is here Blog
You’ll notice the post about Brexit is removed when you visit the site in French.
The only problem is that the post can still be viewed in french by visiting the URL directly or viewing it in English and then changing the language. But it covers most users.

Amazing! Well done, I’ll share that with our team :slight_smile:
You can exclude the Brexit post from being translated on your Weglot dashboard if you don’t want it to be translated in French:
https://dashboard.weglot.com/settings/exclusions
The French flag will not appear in the language switcher if you exclude it.

Hi Eugene, this works because Matt shows all content in main language. And in translated language he does selectively deactivate. But I need to exchange the item by another one. This means, I need to deactivate one item in main language. As soon I do that, it disappears in weglot.

I need to exchange german books with english books:

Die Bücher für die Digitalisierung (digitalisieren.io)

https://preview.webflow.com/preview/digitalisieren?utm_medium=preview_link&utm_source=dashboard&utm_content=digitalisieren&preview=23bbba706a7435041dabeda2fd07746c&workflow=preview

I’ve used GeoTargetly in conjunction with Webflow in the past. Had GeoTargetly redirect some pages to other’s based on region and used GeoTragetly hide and show elements on other pages based on location using their geo javascript feature. But it can bloat the site if you aren’t careful, remember everything you hide with javascript is still there, it’s just not showing for the user. https://geotargetly.com/