Language switching Button/Link that works

Webflow does not support multi-lang and so we will have to do it in a rather manual way. Is there an easy way to add language switching button or links that can stay on the same content but not jumping to home of another language? by javascript or else?

My site’s primary language is English, and will have other languages like Chinese, Japanese and French. The English site is located at root, and pages of other languages are put inside folders. The site structure is as below:

( English, at root )
/ index.html
/ contact-us.html

( Chinese )
/cn/ index.html
/cn/ contact-us.html

( Japanese )
/jp/ index.html
/jp/ contact-us.html

( French )
/fr/ index.html
/fr/ contact-us.html

What I would like to achieve is:
(1) Put the language switch links on every page (as “Symbols”): ENG / 中文 / 日本語 / French
(2) When people visiting /contact-us.html and would like to view it in Japanese, they click the 日本語 link and will go to /jp/contact-us.html but not jump to /jp/index.html.

I came across this problem before and found this post, but no one was responding. So, I started this new post to better address the issue.
https://discourse.webflow.com/t/language-switcher-in-javascript-localization/28076

Everyone, Webflow team, @cyberdave, @PixelGeek, @samliew, @Waldo … Any hint to handle language switching links so that changing site language will stay on the same content? A bit urgent.

Thanks a million !!!

1 Like

Hi, anyone could offer some hints or help?

Thanks.

For what its worth you may try the solution from here. The multilanguage ability is long overdue in the WF :frowning:

Looks amazing, but I think this is not a good solution for larger scale website.

Actually, I think Collection, the use of “Symbols”, and putting pages of different lang in such as “en” “jp” “cn” would be good enough for building a proper multilingual website.

The only problem frustrating me is I cannot find a way to deal with the language selection link/button.

( Cuz clientS keep requesting changing language should stay at the same content but not just jumping to “Home” of the selected language… Nightmare…)

Yes, I can see how this is a hard thing to do. You will have to make pairs of pages for the two languages and then call the corresponding page on each page while pressing the switch. Someone way better than me is needed to come up with the JavaScript necessary for this.

I don’t know about the javascript but I’m doing it by hand. IE adding a link to the other page for each page. For a CMS, you could add a ‘link’ field and bind it. The way you used to have to set up pagination.
A bit of a fiddle but not too much depending on how many pages you’ve got. It’s something people should be able to do themselves in the editor as well.

1 Like

It is a basic function when using Wordpress plugins, such as WPML and Polylang, which allows switching language and keeping corresponding content.

A proper website should behave like this.

@anthonychan2509 I had the same problem and recently came across WeGlot, which does exactly what you want: Translate a Webflow website - Weglot

You just need to put a Javascript snippet in Custom Code under Project Settings and it will add a language selector at the bottom right corner of the viewport, which you can later customize with CSS. By default, it will automatically translate the text for each page, but you can also add manual translations for a perfect result.

Once you’re browsing a translated page, just click on any links and it will take you to the corresponding translated page.

There’s also a more complex setup where, by adding some CNAME values, you can also get a subdomain for each of the languages the site is translated to.

I know it sounds like I’m selling something, but I’m not! :smiley: I’m just a regular Webflow user who had the same problem for more than a year trying to add multi-language support to my site, have also tried Localize.js without success, and now I’m happy that WeGlot got me out of the weeds.

I hope it helps!

2 Likes

Also @anthonychan2509 if you 1) want to tweak the options for the language switcher, here are the docs, and if you 2) want to hide the built-in language switcher but want to assign its functionalities to other elements on the page with your own HTML, here’s the chapter in the docs.

I know this answer may come late and you must have found a different solution, but I’m sure this will be useful for other members of our community.

1 Like

Hey Chardot,

I’m Eugene from the Weglot team. Just came across your answer, thank you for recommanding Weglot!!

Have you tried to implement the subdomain integration of Weglot? Let me know if you have any feedback on integrating Weglot on Webflow, we are new to Webflow so any comment would be useful!

Thanks
Eugene

@Chardot
Thanks a lot for your tips, especially from a weglot user!

@eugene_weglot
I did some basic testing. Everything’s really fine and works great. But there is one really really big mistake with the language codes. I raised this issue to your support team but without luck.

It’s not very wrong to use zh for Simplified Chinese, but it is more correct to use “sc”. (zh stands for Chinese, not distinguishing simplified or traditional Chinese, nor Country) Anyway, it’s fine.

But, Traditional Chinese is definitely not “tw”… “tw” stands for Taiwan. It is seriously wrong in Hong Kong and China, no proper corporate client could bear this mistake to put “tw” on the URL for Traditional Chinese. This is the biggest hindrance to me at this moment.

It is more appropriate to use “tc” for Traditional Chinese.

I know Weglot is following the ISO stuff, but I guess it was established too long ago. And I know it is hard to change, but is it possible for Weglot to add the code “tc” soon? I am not sure about other languages, but Chinese is really a special case.

Thanks.

Hi @eugene_weglot, Thanks a lot for the information. It’s useful.

Just see that you posted a message on another post: Language switching Button/Link that works - #8 by Chardot Here copied the same response I made on that post. Thanks.

I did some basic testing. Everything’s really fine and works great. But there is one really really big mistake with the language codes. I raised this issue to your support team but without luck.

It’s not very wrong to use zh for Simplified Chinese, but it is more correct to use “sc”. (zh stands for Chinese, not distinguishing simplified or traditional Chinese, nor Country) Anyway, it’s fine.

But, Traditional Chinese is definitely not “tw”… “tw” stands for Taiwan. It is seriously wrong in Hong Kong and China, no proper corporate client could bear this mistake to put “tw” on the URL for Traditional Chinese. This is the biggest hindrance to me at this moment.

It is more appropriate to use “tc” for Traditional Chinese.

I know Weglot is following the ISO stuff, but I guess it was established too long ago. And I know it is hard to change, but is it possible for Weglot to add the code “tc” soon? I am not sure about other languages, but Chinese is really a special case.

Thanks.

1 Like

Hi @anthonychan2509,

Thank you for your feedback. Happy that everything is working great!

We are aware of this issue and it is on our roadmap to find a way to fix this but I don’t know when. I’ll let you know when it is fixed.

Eugene

Hi,
I have recently started using Weglot integration with Webflow and it works great! However, I have difficulties styling the button.

@eugene_weglot perhaps you could help?
We have a chat in the right bottom corner (where the Weglot button appears by default) and therefore I’d like to reposition it.
Can you tell me how I could do it? I’d like it to be either fixed in the footer or top navbar.

Unfortunately, I have only found articles about Wordpress and Shopify button styling.

Thanks in advance! :slight_smile:

Hi @Kasia_Kring,

Sure! If you have any question, the best is to simply contact our support team: support@weglot.com

They will be happy to help you find a better position for your language switcher. Be sure to give them as much information as possible: your website, where you want to put it, … :wink:

1 Like

Thank you @eugene_weglot! :slight_smile:
In fact, have already written to them.

1 Like

Any update?

“tw” does not stands for Traditional Chinese and it is seriously wrong. No client will accept it.

I am facing the problem again… I really want to use Weglot, as I believe it will let me move away from Wordpress to Webflow.

By the way, I did not try yet. Can I choose “tr” ( Turkish ) but in fact I am using it for translating Traditional Chinese?

Hi @anthonychan2509, it’s on our roadmap and we are fully aware that it is an important issue but I can’t tell you when it will be done. Sorry about that.

I’ll let you know when we work on this.

Hi everyone, am very new at Webflow. We are building a site for a client who wanted low maintenance and no code. We are moving platforms from Squarespace to Webflow, which is perfect except for the ability to localise.

The website will mainly cater to users in Southeast Asia where many people are bi- and trilingual. English is commonly used but not as the preferred medium for certain types of engagements, ones our client is looking to cultivate.

This thread is raising the issues with Weglot integration that are very much our concern, thanks @anthonychan2509.

@Chardot, I tried your links but for the docs but they seem to be broken (?). Could you have a look?

@eugene_weglot, we are planning the site with Weglot integration. The issue with the TW Chinese button will also be a huge problem for us, but thankfully at this stage the client only needs Simplified Chinese. However, they are looking to expand to include Traditional Chinese next year, please allow customisation or issue a fix.

Cheers!

Hi @e-respondeo & @anthonychan2509,

We’ve worked on a possible solution. Once you have Weglot installed, please contact our support team at support@weglot.com asking for Remy and mentioning this conversation. He will help you customize the Weglot integration.

Cheers