there is a folder along the way 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 Desktop\project\name_project\ru
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)
<a href="/" class="logo">
<img src="/ru/images/logo.svg" alt="">
</a>
<nav class="header__menu menu">
<div class="menu__hamburger" id="menu">МЕНЮ</div>
<div class="menu__holder" id="nav">
<ul class="menu__list">
<li class="menu__item"><a href="/#services" class="menu__link link anchor" id="services">услуги</a></li>
<li class="menu__item"><a href="/#about" class="menu__link link anchor" id="about">о нас</a></li>
<li class="menu__item"><a href="/#portfolio" class="menu__link link anchor" id="portfolio">портфолио</a></li>
<li class="menu__item"><a href="/#contacts" class="menu__link link anchor" id="contacts">контакты</a></li>
</ul>
<div class="menu__close" id="menuClose"></div>
</div>
</nav>
<div class="lang">
<a href="#" class="lang__item lang__item--active" data-lang="en" id="englishLink">EN</a>
<span id="languageSeparator">/</span>
<a href="/ru/index.html" class="lang__item" data-lang="ru" id="russianLink">RU</a>
</div>
for english vers
<a href="/" class="logo">
<img src="/images/logo.svg" alt="">
</a>
<nav class="header__menu menu">
<div class="menu__hamburger" id="menu">MENU</div>
<div class="menu__holder" id="nav">
<ul class="menu__list">
<li class="menu__item"><a href="/#services" class="menu__link link anchor" id="services">услуги</a></li>
<li class="menu__item"><a href="/#about" class="menu__link link anchor" id="about">о нас</a></li>
<li class="menu__item"><a href="/#portfolio" class="menu__link link anchor" id="portfolio">портфолио</a></li>
<li class="menu__item"><a href="/#contacts" class="menu__link link anchor" id="contacts">контакты</a></li>
</ul>
<div class="menu__close" id="menuClose"></div>
</div>
</nav>
<div class="lang">
<a href="#" class="lang__item lang__item--active" data-lang="en" id="englishLink">EN</a>
<span id="languageSeparator">/</span>
<a href="/ru/index.html" class="lang__item" data-lang="ru" id="russianLink">RU</a>
</div>
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');
});
const params = new URLSearchParams(window.location.search);
const currentLang = params.get('lang') || 'en';
console.log(`Current language: ${currentLang}`);
if (currentLang === 'ru') {
switchLanguage('ru');
}
});
need to do this with folders ru index.html was loaded when you clicked on the RU button`