Перейти к содержимому


Мультиязычность С Помощью Google Translate


  • Авторизуйтесь для ответа в теме
В этой теме нет ответов

#1 Никита Панин

Никита Панин

    Пользователь

  • Модератоpы
  • 46 сообщений

Отправлено 05 Февраль 2021 - 12:26

Можно имитировать мультиязычность сайта с помощью Google Translate, через переключение флажков. Выглядит это следующим образом :

Безымянный1.png

Данная реализация, подходит для всех шаблонов, поддерживающих cookie (практически для всех) .

Для этого перейдём в раздел Сайт  ---> Редактор шаблонов ---> в шаблоне "НTML" найдём :

</head>

и перед найденной строкой добавим :

<script src="js/google-translate.js"></script>
<script src="//translate.google.com/translate_a/element.js?cb=TranslateInit"></script>

далее найдём строку :

<body>

и после найденной строки, вставим (блок в котором выводятся флажки) :

<div class="language">
<img src="{ASSETS_IMAGES_PATH}lang__ru.png" alt="ru" data-google-lang="ru" class="language__img">
<img src="{ASSETS_IMAGES_PATH}lang__en.png" alt="en" data-google-lang="en" class="language__img">
<img src="{ASSETS_IMAGES_PATH}lang__de.png" alt="de" data-google-lang="de" class="language__img">
<img src="{ASSETS_IMAGES_PATH}lang__uk.png" alt="uk" data-google-lang="uk" class="language__img">
</div>

далее перейдём в файл forall.js и добавим (в самый конец) :

const googleTranslateConfig = {
lang: "ru",
};

function TranslateInit() {

let code = TranslateGetCode();
// Находим флаг с выбранным языком для перевода и добавляем к нему активный класс
$('[data-google-lang="' + code + '"]').addClass('language__img_active');

if (code == googleTranslateConfig.lang) {
// Если язык по умолчанию, совпадает с языком на который переводим
// То очищаем куки
TranslateClearCookie();
}

// Инициализируем виджет с языком по умолчанию
new google.translate.TranslateElement({
pageLanguage: googleTranslateConfig.lang,
});

// Вешаем событие клик на флаги
$('[data-google-lang]').click(function () {
TranslateSetCookie($(this).attr("data-google-lang"))
// Перезагружаем страницу
window.location.reload();
});
}

function TranslateGetCode() {
// Если куки нет, то передаем дефолтный язык
let lang = ($.cookie('googtrans') != undefined && $.cookie('googtrans') != "null") ? $.cookie('googtrans') : googleTranslateConfig.lang;
return lang.substr(-2);
}

function TranslateClearCookie() {
$.cookie('googtrans', null);
$.cookie("googtrans", null, {
domain: "." + document.domain,
});
}

function TranslateSetCookie(code) {
// Записываем куки /язык_который_переводим/язык_на_который_переводим
$.cookie('googtrans', "/auto/" + code);
$.cookie("googtrans", "/auto/" + code, {
domain: "." + document.domain,
});
}

и в конце добавим иконки флагов на сайт, для этого распакуем данный архив :
Прикрепленный файл  language.zip   3,2К   9 Количество загрузок:

и добавим на сайт все изображения из архива
Безымянный23.png




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных