/    Sign up×
Bounties /Pin to ProfileBookmark

multilingual site

multilingual site using duplication

there is a folder along the way

path:

Desktop\project\name_project

which is the root of the site project

They told me to translate the site from English to Russian through duplication, duplicate the necessary files in the /ru folder, which is along the way

path:

Desktop\project\name_project/en

It seemed like I connected everything as it should, but nothing was working at all, so I decided to resort to GPT chat, 2 hours to no avail)

file for Russian version (header.html)

HTML:

MENU

services

about us

portfolio

contacts

EN

/

RU

for English

HTML:

MENU

services

about us

portfolio

contacts

EN

/

RU

when you click on RU, the page simply reloads and takes you to the link http://localhost:3333/?lang=ru and the same back only to http://localhost:3333/?lang=en, the switch returns to the active form on EN)

what is the problem?

languageswitcher.js:

document.addEventListener(‘DOMContentLoaded’, function () {

const englishLink = document.getElementById(‘englishLink’);

const russianLink = document.getElementById(‘russianLink’);

const languageSeparator = document.getElementById(‘languageSeparator’);

function switchLanguage(language) {

console.log(`Switching to ${language}`);

const currentPath = window.location.pathname;

const params = new URLSearchParams(window.location.search);

const currentLang = params.get(‘lang’) || ‘en’;

if (language !== currentLang) {

params.set(‘lang’, language);

const newPath = `${currentPath}?${params.toString()}`;

console.log(`New path: ${newPath}`);

window.location.href = newPath;

}

}

englishLink.addEventListener(‘click’, function (event) {

event.preventDefault();

switchLanguage(‘en’);

});

russianLink.addEventListener(‘click’, function (event) {

event.preventDefault();

switchLanguage(‘ru’);

});

// Check the language when loading the page

const params = new URLSearchParams(window.location.search);

const currentLang = params.get(‘lang’) || ‘en’;

console.log(`Current language: ${currentLang}`);

// If the language in the request parameters does not match the current language, switch the language

if (currentLang === ‘ru’) {

switchLanguage(‘ru’);

}

});

to post a answer
Back-endCSSHTMLJavaScript

1 Replies

Davinci•003 auto-replyFrom your description, it seems like you are trying to implement a language switcher for your website. However, the issue here is that you are only changing the URL parameter but not actually loading the content from the respective language folder.

The JavaScript code you have written only changes the URL parameter lang to en or ru but it does not load the content from the respective language folder. You need to modify your code to load the content from the respective language folder when the language is switched.

Here is a simple example of how you can do it:

``javascript
document.addEventListener('DOMContentLoaded', function () {
const englishLink = document.getElementById('englishLink');
const russianLink = document.getElementById('russianLink');

function switchLanguage(language) {
console.log(
Switching to ${language});
const currentPath = window.location.pathname;
const newPath = currentPath.replace(//(en|ru)//,
/${language}/);
console.log(
New path: ${newPath});
window.location.href = newPath;
}

englishLink.addEventListener('click', function (event) {
event.preventDefault();
switchLanguage('en');
});

russianLink.addEventListener('click', function (event) {
event.preventDefault();
switchLanguage('ru');
});
});
`

In this code, when the language is switched, the
switchLanguage` function replaces the language part of the current URL with the new language and then redirects to the new URL. This will load the content from the respective language folder.

Please note that this is a simple example and might not work perfectly for your case. You might need to adjust it according to your project's structure and requirements.

Was this helpful?

×

Success!

Help @ExfiL123 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 3.3,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,

tipper: Anonymous,
tipped: article
amount: 10 SATS,
)...