currentLanguage

Sets or gets the site's current display language.

Description

Setting the currentLanguage property changes the site's display language. The current page is reloaded in the newly set language.

Set the current language using a two-letter language code. The code must represent one of the languages set to show on your site. You can retrieve your site's languages and corresponding language codes using the siteLanguages property.

Getting the currentLanguage property gets the two-letter language code of the site's current display language.

Type:

stringRead & Write

Was this helpful?

Get the site's current display language

Copy Code

1import wixWindowFrontend from 'wix-window-frontend';
2
3// ...
4
5let language = wixWindowFrontend.multilingual.currentLanguage; // "en"

Set the site's current display language

Copy Code

1import wixWindowFrontend from 'wix-window-frontend';
2
3// ...
4
5wixWindowFrontend.multilingual.currentLanguage = "es";

Create a button used to toggle between two languages

This example assumes you have a site set up to display in both English and Spanish. It also assumes you have a button with the ID toggleLanguage.

An onClick event handler is registered for the button. The event handler checks the site's current language and then sets the site to change to the other available language.

Copy Code

1import wixWindowFrontend from 'wix-window-frontend';
2
3// ...
4
5$w.onReady( function () {
6  $w("#toggleLanguage").onClick( (event) => {
7    if(wixWindowFrontend.multilingual.currentLanguage === "en"){
8      wixWindowFrontend.multilingual.currentLanguage = "es";
9    }
10    else {
11      wixWindowFrontend.multilingual.currentLanguage = "en";
12    }
13  } );
14} );
15

Create a dropdown used to change between available languages

This example assumes you have a site set up to display in multiple languages. It also assumes you have a dropdown element with the ID languageDropdown.

When the page loads, the site's available languages are retrieved. Then, the JavaScript map() function is used to change the retrieved language information into the format expected by the dropdown's options property. Next, the JavaScript filter() function is used remove the current language from the list. Finally, the dropdown's options property is set using the formatted language list.

An onChange event handler is registered for the dropdown element. The event handler changes the site's current language based on the language chosen by the user.

Copy Code

1import wixWindowFrontend from 'wix-window-frontend';
2
3// ...
4
5$w.onReady(function () {
6  const languages = wixWindowFrontend.multilingual.siteLanguages;
7
8  let languageOptions = languages.map((obj) => {
9      return { label: obj.name, value: obj.languageCode };
10  });
11
12  const currentLanguage = wixWindowFrontend.multilingual.currentLanguage;
13  const filteredLanguageOptions = languageOptions.filter(obj => obj.value !== currentLanguage);
14
15  $w('#languageDropdown').options = filteredLanguageOptions;
16
17  $w("#languageDropdown").onChange((event) => {
18      wixWindowFrontend.multilingual.currentLanguage = event.target.value;
19  });
20});
21

Filter a dataset based on the site's current display language

This example assumes you have a site set up to display in both English and Spanish. It also assumes you have a collection that contains data in both languages. The collection has a language field that indicates each item's language. The following code filters a dataset connected to the collection so it only contains items that correspond to the site's current language.

Copy Code

1import wixWindowFrontend from 'wix-window-frontend';
2import wixData from 'wix-data';
3
4// ...
5
6$w.onReady( function () {
7  let language = wixWindowFrontend.multilingual.currentLanguage;
8  $w("#myDataset").setFilter( wixData.filter().eq("language", language) );
9} );
10