Добавьте виджет перевода на свой сайт ConveyThis

Подведите итог этому посту следующим образом: 7 мин чтения

Виджет перевода — это кнопка или меню, которые посетители используют для переключения вашего сайта на другой язык. Вы можете добавить его тремя способами: создать его самостоятельно на API машинного перевода, установить плагин перевода для вашей CMS или вставить фрагмент JavaScript из службы перевода веб-сайта. Правильный выбор зависит не столько от кнопки, сколько от того, что за ней происходит: можно ли редактировать переводы и получает ли каждый язык свой собственный адрес, который могут индексировать поисковые системы.

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

1. Создайте его на API перевода

Старый бесплатный фрагмент Google “Website Translator” ( google_translate_element код, который показывают многие старые руководства) достигает конца своей поддержки, как объясняется в нашем Альтернатива виджету Google Translate гид. Google указывает владельцам сайтов на платный Облако Перевод API вместо. С помощью API разработчик может отправить текст вашей страницы на перевод и отобразить результат в пользовательском языковом меню.

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

2. Установите плагин перевода CMS

Если ваш сайт работает на WordPress, Shopify, Joomla или аналогичной платформе, плагин или приложение для перевода обычно являются кратчайшим путем. Большинство плагинов добавляют собственный переключатель языка, который можно поместить в меню, боковую панель или нижний колонтитул. Некоторые хранят переводы в вашей базе данных CMS; другие, включая ConveyThis, хранят их в облачной панели управления и предоставляют их вашему сайту. Смотреть Интеграция WordPress и Shopify интеграция страницы со спецификой платформы.

3. Вставьте фрагмент JavaScript из службы перевода

Для сайтов, созданных на основе чего-либо еще (пользовательский стек, конструктор сайтов, статический сайт), служба типа ConveyThis предоставляет вам один скрипт для вставки в <head> каждой страницы. Скрипт добавляет переключатель и предоставляет переведенную версию, когда посетитель выбирает язык. Есть 35 интеграций для общих платформ и JavaScript интеграция охватывает все остальное.

Illustration of a website with a language menu

Как добавить переключатель языка ConveyThis

Шаги одинаковы, какую бы платформу вы ни использовали, меняется только шаг установки.

Создайте учетную запись и добавьте свой домен. На панели управления ConveyThis выберите свою платформу (или “JavaScript” для пользовательского сайта), введите свой домен и задайте исходный язык и языки, которые вы хотите добавить.
Установить. В WordPress установите плагин ConveyThis из каталога плагинов и введите ключ API на панели управления. На Shopify установите приложение ConveyThis. Для других сайтов скопируйте фрагмент, показанный на панели управления, и вставьте его в <head> раздел всех страниц. Большинство конструкторов сайтов имеют для этого настройку “пользовательский код” или “код заголовка”.
Проверьте переключатель. Перезагрузите свой сайт. По умолчанию переключатель отображается в правом нижнем углу; в первый раз это может занять несколько минут.
Просмотрите переводы. Первый проход — машинный перевод. Откройте панель управления для редактирования отдельных предложений, используйте визуальный редактор чтобы исправить текст в контексте, добавьте глоссарий правила для названий брендов и продуктов, а также приглашайте переводчиков или коллег с командными ролями.

ConveyThis language button settings in the WordPress plugin

Стиль и расположение переключателя

В настройках домена вы можете выбрать:

Позиция. Фиксированный угол экрана или “Пользовательский” для размещения переключателя внутри выбранного вами элемента, например главного меню. Вы вводите идентификатор элемента (например menu, без #). The руководство по положению показывает, где находится настройка для сайтов JavaScript и WordPress.
Выпадающий список или список, и в какую сторону открывается меню.
Флаги, названия или коды. Вы можете отображать названия языков, коды языков, флаги или их комбинации. Вы также можете изменить какой флаг представляет язык, например флаг Великобритании вместо флага США для английского языка.

Разработка коммутатора, который люди смогут использовать

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

Показывать названия языков, а не только флаги. Флаги представляют страны, а не языки. На испанском языке говорят более чем в двадцати странах, и гостю из Мексики не разрешается искать испанский флаг. Если вы используете флаги, соедините их с названием языка.
Напишите название каждого языка на этом языке. «Deutsch», «Español», «日本語» легче заметить, чем «немецкий», «испанский», «японский» для тех, кто в них нуждается.
Поместите его туда, где люди этого ожидают. Заголовок или основная навигация являются наиболее распространенным местом, а нижний колонтитул - вторым местом. Плавающая угловая кнопка работает, но убедитесь, что она не закрывает виджеты чата или баннеры файлов cookie на мобильных устройствах.
Держите посетителя на одной странице. При переключении языка должна отображаться переведенная версия страницы, на которой они находятся, а не отправляться на домашнюю страницу.
Запомните выбор. Как только кто-то выберет язык, сохраните его при просмотре.
Будьте осторожны с автоматическими перенаправлениями. Перенаправление людей по языку браузера может помочь, но всегда оставляйте переключатель видимым, чтобы они могли его изменить. ConveyThis имеет необязательное перенаправление на язык браузера это выключено, если вы его не включите.

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

Чтобы найти на других языках, каждому переводу нужен свой URL-адрес, например example.com/es/ или es.example.com, с переведенным заголовком и метаописанием на этой странице и хрефланг теги, связывающие версии вместе. Google объясняет это в своем руководстве управление многоязычными сайтами.

ConveyThis обслуживает переводы на URL-адреса на реальном языке (подпапки, поддомены или ?lang параметр), транслирует метатеги и структурированные данные, а также автоматически добавляет hreflang. Если вы создаете свой собственный виджет на API, вам придется создавать все это самостоятельно. The многоязычная страница SEO освещает детали.

Протестируйте, прежде чем объявить об этом

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

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

Сколько это стоит

ConveyThis имеет бесплатный тарифный план для одного языка и до 5000 слов, чего достаточно, чтобы попробовать коммутатор на небольшом сайте. Платные планы начинаются от 12 долларов в месяц за 30 000 слов. Слова учитываются только тогда, когда посетителям показывается переведенный контент, а трафик ботов не учитывается. The страница цен перечисляет каждый план.

Если вы решаете, какую часть сайта переводить и в каком порядке, начните с как перевести целый сайт. Пошаговый план проекта см как перевести сайт.

Добавьте виджет перевода на свой сайт

Три способа добавить виджет перевода