Переводчик сайтов OnLine

GLOOMY · 1 Мар 2022

Привествую всех!

У меня вопрос. Есть Для просмотра ссылки Войди или Зарегистрируйся, на него поставил виджет гугл переводчика, но вот глюченный он.
Мало того что в предложениях не все слова переводит, так еще и логотип этот снизу списка языков, который не убрать.

Xотел попробовать поставить "Яндекс переводчик", почитал на Для просмотра ссылки Войди или Зарегистрируйсякак его кастомизировать, да у меня весь шаблон поехал.

Хотелось бы чтоб как в виджете гугла, языки были в выпадающем списке, как на вышеуказанном Для просмотра ссылки Войди или Зарегистрируйся на данный момент.

Буду рад, если кто поможет реализовать.

Majesty · 1 Мар 2022

Есть вот такой вариант, я использовал как-то на сайте, все работает

Код:

<div class="lang">
<span class="langHeader ru" id="lang" onclick="if (!window.__cfRLUnblockHandlers) return false; headerDropdownLang();">Ru</span>
<div class="dropdown-lang-content" id="langDropdown">
<a data-google-lang="ru" class="language__active">Русский</a>
<a data-google-lang="en">English</a>
<a data-google-lang="de">German</a>
<a data-google-lang="zh-TW">Chinese</a>
</div>
</div>

к примеру это добавлял в шаблон шапки header в меню, но это на ваше усмотрение уже куда вставить и как оформить

Перед </body> добавим код

JavaScript:

<script type="text/javascript">
        $(function() {
            $('.langHeader#lang').addClass(TranslateInit());
        });
    </script>

В файл с скриптами добавить

JavaScript:

function headerDropdownLang() {
    document.getElementById("langDropdown").classList.toggle("show")
}

function headerDropdownMob() {
    document.getElementById("logindrop-mob").classList.toggle("show")
}

function Dropdown(e, o = ".dropdown__toggle", t = ".dropdown__menu", n) {
    this.element = e, this.toggler = e.querySelector(o), this.menu = e.querySelector(t), this.toggleHandler = e => this.toggle(e), this.toggler.addEventListener("click", this.toggleHandler)
}

function commLoaded() {
    document.querySelectorAll(".dropdown__selector").forEach(e => {
        new Dropdown(e)
    })
}
$(document).on("mouseup", function(e) {
    let o = $(".dropdown-lang-content.show");
    o.is(e.target) || 0 !== o.has(e.target).length || o.removeClass("show")
}), $(".logindrop-mob").click(function() {
    $(".dropdown-lang-content").css("bottom", "-410px").fadeIn({
        queue: !1
    }).animate({
        bottom: "0"
    }, {
        display: "block"
    }, {
        queue: !1,
        duration: 1e3
    }), $(".lang__init").fadeIn({
        queue: !1
    }).animate({
        queue: !1
    })
}), $(".dropdown-lang-content").click(function() {
    $(".dropdown-lang-content").css("bottom", "0").animate({
        bottom: "-410px"
    }, {
        queue: !1,
        duration: 1e3
    }).fadeOut({
        queue: !1
    }), $(".lang__init").fadeOut({
        queue: !1
    }).animate({
        queue: !1
    })
}), $(".lang__init").click(function() {
    $(".dropdown-lang-content").css("bottom", "0").animate({
        bottom: "-410px"
    }, {
        queue: !1,
        duration: 1e3
    }).fadeOut({
        queue: !1
    }), $(".lang__init").fadeOut({
        queue: !1
    }).animate({
        queue: !1
    })
});

Только лишнее нужно удалить, сейчас не могу потестировать

В <head> подключаем

Код:

<link href="//translate.google.com" rel="preconnect">
<script src="/js/lang.min.js" type="text/javascript"></script>

И загрузить по пути /js/ файл Для просмотра ссылки Войди или Зарегистрируйся
Подогнать под себя, все

Работает на данном сайте

Скрытое содержимое для пользователя(ей): GLOOMY

Переводчик сайтов OnLine

GLOOMY

Постоялец

Majesty

Мой дом здесь!