Streaming live at 10am (PST)

Full Multi Language Site - Easy to set-up and to use!


Its finally possible. Multi Language Webflow Pages

You can use it in your CMS or Static pages and you can change the language with Buttons or with the Link - how you like. Its really easy to implement and it’s free!

Lets do it:

Put this into your Before </body> tag:

var DEAFULT_LANG = "en";
var LANG_REG_EXP = /\[\[([a-z]{2})\]\]([^\[]+)/g;
var isStorageEnabled = ! (typeof localStorage == 'undefined');
var user_lang = (navigator.userLanguage||navigator.browserLanguage||navigator.language||DEAFULT_LANG).substr(0,2);

var getLangParam = function(){
    var arr = /lang=([a-z]{2})/g.exec(;
    return arr ? arr[1] : null;

var getLangFromStorage = function(){
    return isStorageEnabled ? localStorage.getItem('lang') : undefined;

var setLang = function(lang){
    user_lang = lang;
        localStorage.setItem('lang', user_lang);

var applyLang = function(){

function textNodesUnder(el){
  var n, a=[], walk=document.createTreeWalker(el,NodeFilter.SHOW_ALL,null,false);
  return a;

var globalDict = [];

    user_lang = getLangParam() || getLangFromStorage() || user_lang;

        localStorage.setItem('lang', user_lang);

    // bugfix for IE11
    // if multilingual sentence is divided into sevaral text node, restore original text node
        if(LANG_REG_EXP.test($(this).text().replace(/\n/g,"")) && $(this).html().indexOf("<") == -1){
        var $v = $("#" + $(this).attr("id"));
        if($v.length > 0 && LANG_REG_EXP.test($v.text().replace(/\n/g,"")) && $v.html().indexOf("<") == -1){
        return LANG_REG_EXP.test(v.nodeValue);
        var dict = {};
        var arr;
        while((arr = LANG_REG_EXP.exec(v.nodeValue)) != null){
            dict[arr[1]] = arr[2];
        globalDict.push({elm:$(v).parent()[0], dict:dict});        

Thats it! Now lets use it:

If you write your Text, write it like this:
[[en]]This is English[[de]]Das ist Deutsch

You can add as many Languages you want.

To select the right language, you have now two ways.

Way 1 - The Link Way

To open the website with the right language, just type ?lang=en at the end of your link
The script shows you now only the right language.

Way 2 - The Button Way

You want a Button that can change the language without a reload? Then use this.

Put this into your Inside <head> tag:

    window.onload = function() {
        var anchors = document.getElementsByTagName('*');
        for(var i = 0; i < anchors.length; i++) {
            var anchor = anchors[i];
            anchor.onclick = function() {
                code = this.getAttribute('whenClick');

Put a Button on your Page and set a custom Attribute
Name: whenClick
Value: setLang('en')



You can use this method on your Collection Pages too.
The selected language kept in memory.

So, i hope it helps a bit.

Extra - The Dream for your Clients

If you want two separate Text Blocks in your CMS Collection, there is a great way.

Set your Text Blocks up in the Collection Settings like you normally do.

Put this after your Script in Before </body> tag

<!-- Language: Englisch -->
    	$(".english").html(function(i,v) {
        return "[[en]]" + v + "[[en]] <b></b>";});

Copy this for every language you want and change the [[en]] and the .english to your language.

Example Germany:

<!-- Language: German -->
    	$(".german").html(function(i,v) {
        return "[[de]]" + v + "[[de]] <b></b>";});

If you now add your text to your Page, add the class of your language .english for example.

Thats it!


You’re an angel - life saver solution


This sounds not bad, but what is with SEO will this affect it and in which way? Also I would know how the workflow for clients would be when they edit text on the page.


Its awesome for Clients! :slight_smile: If you use the CMS Variant, the Client have no differences to before. For the other its just adding the [[en]]


Ok I will try this out, but whats about the SEO. Will this affect the SEO positive or negative?


Google see all versions of the text, because you write it on your page. So i think it’s worked.