Автоматический перевод Вашего сайта с помощью JS скрипта

06.01

2021

На многих сайтах можно встретить флаги стран, при нажатии на которые происходит автоматический перевод текущей страницы сайта на выбранный язык. Данная функция очень полезна для не русскоязычной аудитория, которая случайно набрела на оставленную Вами полезную информацию. Помню как-то сам набрел на какой-то Албанский сайт с нужным мне ответом и долго пытался понять смысл написанного.

Ситуация за последние несколько лет сильно изменилась и найти рабочего способа автоматически переводить сайты на другой язык уже не встретишь. Google Translate прикрыл эту возможность, а другие сервисы стали делать это только за деньги.

Но решение нашел Vitalii P, который написал небольшой код, умеющий переводить сайты на автомате. Используется все тот же инструмент от Google Translate. Разрабы из Google прикрыли только добавление новых сайтов в эту систему, а старые сайты все также могут пользоваться скриптом автоматического перевода сайтов. Этим и воспользовался Виталий.

Такие кнопки можно добавить для всех стран, которые поддерживаются сервисом, как и делают это многие вебмастера. Они добавляют все доступные страны. На мой взгляд, следует выбрать только несколько стран, аудитория которых посещает Ваш сайт. Я на своем блоге выбрал 3 языка: английский, немецкий и французский. Но хозяин — барин.

Добавляем автоматический переводчик

На github с проектом Виталия можно потестировать работу и детально изучить возможности.

Рабочий пример

На этой странице реализован этот механизм, поэтому можно попробовать:

В песочницу по типу CodePen добавить не получается, так как они не поддерживают куки.

Как поставить автоматический перевод сайта на JS у себя

Ниже приведен код на чистом JS. У автора идеи можно найти код и JQuery.

Файлы для загрузки:

1. Вся магия находится в файле google-translate.js, который можно скачать здесь – google-translate.js
2. Красивые флаги можно взять здесь – lang.zip

Подключаем скрипты на странице:

<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
<script src="/js/google-translate.js"></script>
<script src="//translate.google.com/translate_a/element.js?cb=TranslateInit"></script>

HTML-код:

<div>
   <img src="/images/lang/lang__ru.png" alt="ru" data-google-lang="ru">
   <img src="/images/lang/lang__en.png" alt="en" data-google-lang="en">
   <img src="/images/lang/lang__de.png" alt="de" data-google-lang="de">
   <img src="/images/lang/lang__fr.png" alt="fr" data-google-lang="fr">
   <img src="/images/lang/lang__pt.png" alt="pt" data-google-lang="pt">
   <img src="/images/lang/lang__es.png" alt="es" data-google-lang="es">
   <img src="/images/lang/lang__it.  png" alt="it" data-google-lang="it">
   <img src="/images/lang/lang__zh.png" alt="zh" data-google-lang="zh-CN">
   <img src="/images/lang/lang__ar.png" alt="ar" data-google-lang="ar">
   <img src="/images/lang/lang__nl.png" alt="nl" data-google-lang="nl">
   <img src="/images/lang/lang__sv.png" alt="sv" data-google-lang="sv">
</div>

Если языков мало?

На этой странице есть список всех поддерживаемых языков. Код языка ISO-639 code из таблицы, меняем в параметре data-google-lang.

Скрыть панель Google Translate

Минимальный CSS-код, который нужен для скрытия верхней панели Google Translate:

body {
  top: 0 !important;
}
.skiptranslate {
  display: none;
  height: 0;
}
.language__img {
  cursor: pointer;
}

Автоматический перевод для поддомена

Если Вы хотите внедрить автоматический перевод на поддомен (name.site.ru), то в файле

google-translate.js нужно немного подредактировать. Файл хорошо комментирован. Комментарии на русском языке.

Теги:

Комментарии

Виджет «Google Переводчик» — Поддержка

Виджет «Google Переводчик» позволяет посетителям сайта быстро перевести содержимое сайта на другой язык.

Содержание

Добавление виджета «Google Переводчик»

Чтобы добавить виджет на сайт, выполните указанные ниже действия.

1. В консоли щёлкните Внешний вид → Виджеты.
2. Выберите место для размещения виджета на сайте. Обычно используются подвал и боковая панель, но выбор зависит от вашей темы.
3. Нажмите любую кнопку + вставки блоков (см. справа), чтобы увидеть список всех доступных блоков и виджетов.
4. Прокрутите раздел Виджеты вниз и щёлкните один раз виджет, чтобы добавить его на свой сайт.

Общие сведения о работе с виджетами см. в этом руководстве.

Кнопки вставки блоков

Добавление виджета «Google Переводчик» в редакторе сайта

Этот раздел руководства применяется к сайтам с тарифными планами WordPress.com Business или eCommerce. Если на вашем сайте действует один из устаревших тарифных планов, эта функция доступна для плана Pro.

В темах, поддерживающих редактор сайта, не используются виджеты, поэтому вы не увидите раздел Внешний вид → Виджеты на своей консоли.

Вместо этого можно использовать блок «Произвольный HTML», чтобы отобразить Google Переводчик на веб-сайтах с поддержкой плагинов.

Для этого выполните следующие действия:

1. Добавьте блок «Произвольный HTML» на страницу или в шаблон, где требуется отобразить Google Переводчик.
2. Скопируйте и вставьте указанный ниже код в блок «Произвольный HTML».

// 
//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit

При предварительном просмотре или после публикации страница будет выглядеть вот так:

Использование виджета «Google Переводчик»

Читатели могут щёлкнуть раскрывающееся меню выбора языка, чтобы увидеть список доступных языков для перевода. После выбора языка из списка содержимое сайта будет переведено.

После перевода содержимого сайта в верхней части окна отобразится панель Google Переводчика с указанием выбранного языка. На ней можно щёлкнуть стрелку рядом с текущим языком, чтобы отобразить полный список и выбрать другой язык для перевода, или нажать «Показать оригинал» для перехода к исходной языковой версии сайта. Кроме того, переключаться между языками можно непосредственно с помощью виджета.

Перенаправление посетителей на определённую языковую версию

Альтернативой виджету является ссылка на автоматический перевод содержимого сайта, которая позволяет перенаправить посетителей на определённую языковую версию.

После включения виджета «Google Переводчик» на вашем сайте можно добавить языковой код к URL-адресу сайта, чтобы автоматически перевести его на нужный язык. Например:

• ?lang=id переводит страницу на индонезийский
• ?lang=de переводит страницу на немецкий
• ?lang=es переводит страницу на испанский
• ?lang=fr переводит страницу на французский
• ?lang=zh-TW переводит страницу на тайваньский вариант китайского языка

Для большинства языков достаточно использовать двухбуквенную аббревиатуру в нижнем регистре. Узнать код нужного языка можно в этом списке кодов ISO 639-1. Однако к аббревиатуре некоторых языков необходимо применить код регионального варианта, например ?lang=zh-TW для тайваньского варианта китайского языка.

Разнообразие тарифных планов и ценовых предложений

• Бесплатно

  Оптимальный вариант для студентов

• Personal

  Оптимальный вариант для представления своего хобби

• Premium

  Оптимальный вариант для фрилансеров

• Business

  Оптимальный вариант для малых предприятий

Ваша оценка:

Попрощайтесь с Google Translate для веб-сайтов

Многие организации в значительной степени полагаются на виджет Google Translate для обеспечения бесплатного автоматического перевода своего контента на широкий спектр доступных языков. Инструмент использует машинный перевод для создания каждой «переведенной» версии сайта.

Это было чрезвычайно полезно (хотя и не совсем точно) для предприятий и веб-сайтов, пытающихся расширить свою многоязычную клиентскую базу.

А вот и плохие новости — Google официально объявила о прекращении поддержки виджета поставил большое количество организаций в безвыходное положение, чтобы предоставить локализованный контент своим пользователям.

Новым пользователям не разрешено загружать виджет, а текущие пользователи, хотя их сайты еще могут работать прямо сейчас, могут случайно обнаружить, что виджет больше не работает для них в один прекрасный день. В ряде организаций это изменение уже произошло.

Вы можете спросить, зачем Google отказываться от такой успешной технологии? Отраслевые эксперты считают, что Google отказался от сервиса по ряду причин:

• Экономическое бремя . Хотя Google Translate API был очень популярен, некоторые люди считают, что финансовое бремя, связанное с предоставлением услуги, обработкой контента и хранением переведенного контента, было денежной головной болью, приносящей мало пользы Google.
• Злоупотребление условиями использования API . Предполагаемое использование API заключалось в обеспечении перевода в среду, в которой контент будет уточняться, улучшаться и помогать в обучении механизма машинного перевода. Этот рабочий процесс позволил бы получить переведенный контент более высокого качества, чтобы укрепить поисковый бизнес Google. К сожалению, многие компании использовали API в качестве платной коммерческой услуги и не улучшали контент.
• Загрязнение проиндексированного контента — изначальная мощь Google Translate исходила из чистой силы почти бесконечного количества переведенного человеком контента, проиндексированного и доступного в качестве основы для обработки машинного перевода. Как обсуждалось в предыдущем пункте, когда пользователи распространяют машинный перевод без человеческих улучшений, а затем этот контент индексируется Google, пул материалов, используемых для обучения механизма машинного перевода, загрязняется неточным переводом, что приводит к нисходящей спирали качества перевода. база данных.

Но давайте вернемся к влиянию устаревшего API на клиентов. Чтобы полностью понять затруднительное положение пользователей API, важно знать, как работает виджет.

Меню выбора языка Google Translate

Просто добавив плагин или несколько строк кода в серверную часть веб-сайта, пользователи позволили своему веб-сайту отображать свой контент на множестве языков. Инструмент создаст на сайте раскрывающееся меню со списком доступных языков.

Виджет также позволял направлять посетителей на автоматически переведенную версию сайта, перенаправляя их на определенный URL-адрес с добавленным идентификатором языка. Если просто добавить оператор (например, «?lang=de»), виджет отобразит машинно переведенную версию страницы на немецком языке. Эта функция позволила разработчику перенаправить пользователей на версии сайта с автоматическим машинным переводом, используя собственный переключатель языка вместо большого всплывающего окна, показанного ранее в этом посте.

Многие организации использовали этот виджет для связи со своими клиентами и сотрудниками. Преимуществом была стоимость (бесплатность) и плавное внедрение виджета на любой сайт. Несколько минут работы моментально обеспечили многоязычный сайт.

Главной проблемой сервиса было качество продукции. В некоторых случаях перевод был смехотворным. В других контент был сносным или достаточным, чтобы пройти, не вызывая особого смущения. Тип материала на сайте определяет качество машинного перевода. Сайт, содержащий технический контент, творческий маркетинговый контент или отраслевой жаргон, обычно приводит к плохому машинному переводу. Если вы решите использовать машинный перевод, вы должны быть готовы предоставить своим клиентам некачественный материал и впоследствии рискуете быть неправильно понятым или дать своим клиентам неправильное представление о вашей организации.

Риск использования машинного перевода для контента, предназначенного для клиентов, связан с обменом сообщениями. Говорите ли вы своим клиентам, что готовы инвестировать $0, чтобы предоставить им надлежащий перевод? Готовы ли вы сообщить, что эти рынки или языки не являются приоритетными для вашей организации? Это опасное сообщение для отправки, в первую очередь, если вы полагаетесь на свою глобальную аудиторию для значительной части вашего общего дохода.

Для тех, кто все еще хочет использовать Google для перевода, реинкарнация службы Google MT ориентирована на профессионалов. Результат перевода теперь имеет стоимость за слово и включает компонент нейронного обучения, который полагается на то, что конечные пользователи загружают проверенные переводы для постоянного улучшения результатов.

И что теперь? Что делать клиентам теперь, когда они не могут использовать Google Translate API на своем сайте?

В следующем посте мы расскажем о стратегиях, которым клиенты могут следовать, чтобы заменить Google Translate API в своих процессах перевода.

 

Скачать инфографику

Как Google перевести веб-сайт

(Изображение предоставлено Google)

Очень полезно знать, как Google переводит сайт. Интернет — это большое пространство, и иногда вы можете наткнуться на веб-сайт, который не на вашем родном языке. В таких ситуациях имеет смысл перевести веб-сайт с помощью Google, чтобы вы могли получить необходимую информацию.

Можно перевести веб-сайт через веб-приложение Google Translate (открывается в новой вкладке). Это делается путем копирования и вставки URL-адреса веб-страницы в текстовое поле «Перевести» и выбора языка, на который вы хотите перевести, из раскрывающегося меню. Страница автоматически откроется в новой вкладке и будет полностью переведена.

• Как загрузить Google Chrome
• Как обновить Chrome
• Как открыть общий доступ к папке Google Диска

Хотя описанный выше метод работает хорошо, на самом деле существует гораздо более удобный способ перевести веб-сайт на ваш родной язык, который Google переводит веб-сайт прямо в вашем браузере. Это быстрее, чем открытие Google Translate, и позволяет вам полностью перемещаться по веб-сайту без необходимости индивидуально переводить каждую конкретную страницу.

Ниже приведено наше пошаговое руководство о том, как Google перевести веб-сайт в браузере Chrome. Просто следуйте инструкциям, и вы сможете просматривать всю сеть независимо от того, с какими языками вы сталкиваетесь.

Чтобы Google переводил веб-сайт прямо в браузере, вам потребуется полностью обновленная версия Google Chrome. Если вы не уверены, что Chrome обновлен на вашем компьютере, обратитесь к нашему руководству , как обновить Chrome .

1. Откройте веб-сайт, который вы хотите перевести Google . Во-первых, просто перейдите на веб-сайт, который вам нужно перевести, как обычно.

2. При посещении веб-сайта, язык которого отличается от языка вашего браузера по умолчанию, в правой части адресной строки должен появиться небольшой значок. Нажмите эту кнопку , чтобы начать перевод.

(Изображение предоставлено Google)

3. Chrome автоматически определит язык веб-сайта. Вы можете перевести веб-сайт на язык вашего браузера по умолчанию к выбрав его в поле параметров .

Google мгновенно переведет веб-сайт, и теперь вы сможете просматривать его содержимое, как обычно.

(Изображение предоставлено Google)

4. Если вы хотите перевести веб-сайт на дополнительный язык, который не является языком вашего браузера по умолчанию, нажмите кнопку с тремя точками , чтобы открыть опцию « Выберите другой язык.»

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

(Изображение Кредит: Google)

• Подробнее: Как экспортировать хромированные закладки

Лучшие сделки с ноутбуками Chromebook

Сниженная цена

(Opens in New)

(Openens in New)

6666666666666666666666666666666666666666666666666666666666 (Opens in New New Book)

. (открывается в новой вкладке)

149,99 $

(открывается в новой вкладке)

107,99 $

(открывается в новой вкладке)

View Deal (открывается в новой вкладке) 9Цена снижена новая вкладка)

(открывается в новой вкладке)

401,28 $

(открывается в новой вкладке)

199,99 $

(открывается в новой вкладке)

Просмотреть предложения (открывается в новой вкладке)

3

Получите мгновенный доступ к последним новостям, самым горячим обзорам, выгодным предложениям и полезным советам.

Свяжитесь со мной, чтобы сообщить о новостях и предложениях от других брендов Future. Получайте от нас электронные письма от имени наших надежных партнеров или спонсоров.

Рори — редактор сделок Tom’s Guide в Великобритании.