i18 support

i18next is a full-featured i18n javascript library for translating your webapplication.

Example demo text

You can change the language of demo text as well as the menu with simple function fire on buttons click. Try it:
EN ES

Step 1

To add i18 support for your app you need to define what text you would like to translate. The best way to define your text is to store it in external json file. For example:

Each language you should have own json file!
en.json

  "app":
    "name": "Example"
  },
  "nav":
    "dashboard": "Dashboards",
    "graphs": "Graphs",
    "mailbox": "Mailbox",
  },
}
es.json

  "app":
    "name": "Example"
  },
  "nav":
    "dashboard": "Salpicadero",
    "graphs": "Gráficos",
    "mailbox": "El correo",
  },
}

Step 2

Next you need to add html indicators in all place you want to use i18.

<div id="i18_links">
    <span data-i18n="nav.dashboard"> </span>
    <span data-i18n="nav.graphs"> </span>
    <span data-i18n="nav.mailbox"> </span>
</div>

Step 3

Next you need to initialise the i18next plugin:
json files are located in /locales folder.

$.i18n.init(
    resGetPath: 'locales/__lng__.json',
    load: 'unspecific',
    fallbackLng: false,
    lng: 'en'
}, function (t)
    $('.i18_links').i18n();
});

Step 4

After that if you want to change the language you just need to add buttons and fire the i18n.setLng() function.

HTML markup

<a class="btn btn-default set_en"> Set EN language</a>

<a class="btn btn-default set_es"> Set ES language</a>

Javascript code

$('.set_en').on('click', function ()
    i18n.setLng('en', function()
        $('.i18_links').i18n();
    });
});

$('.set_es').on('click', function ()
    i18n.setLng('es', function()
        $('.i18_links').i18n();
    });
});

More info about specific function and configuration options you can find on official i18next documentation.

Set of the 780 flag icons for all countries. All flags are avalible with 16x16, 32x32 and 64x64 size.

flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag flag