Получите продающий сайт «под ключ» за 20 дней: уникальный дизайн, подключение интеграций, удобный функционал
Реклама. ООО «Инсейлс Рус»‎ ИНН 771484376 erid: 2Ranyo5dJeU

Языковые версии магазина

inSales позволяет изменить основной язык сайта, а также сделать сайт мультиязычным. Это дает возможность:

  • редактировать на разных языках названия, описания и прочие характеристики товаров, категорий, блогов и статических страниц;
  • использовать мультиязычные XML/YML выгрузки на товарные площадки;
  • переключаться посетителям сайта между языковыми версиями;
  • делать импорт товаров индивидуально для каждой языковой версии.

Большинство операций с языками производится в разделе Настройки → Языки:

  1. Смена основного языка
  2. Добавление нового языка
  3. Перевод контента (товаров, категорий, блогов и страниц)
  4. Перевод элементов темы оформления (кнопок, меню, надписей)
  5. Перевод темы в файле messages.json
  6. Перевод при помощи копирования шаблонов
  7. Добавление переключателя языка на сайт

Смена основного языка

Для изменения текущего языка нажмите кнопку «Сменить» в разделе «Языки» (1), выберите нужное значение из списка (2) и кликните по кнопке «Сменить» (3):

Система выведет информационное сообщение:

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

Непосредственно язык в панели администратора не изменится, он останется прежним. Однако на сайте автоматически будут переведены элементы темы оформления вроде виджетов, кнопок и меток (если шаблон это поддерживает) и системные страницы (личный кабинет и оформление заказа).

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

Личный кабинет покупателя и оформление заказа почти всегда переводятся автоматически, так как содержимое данных страниц подтягивается не из шаблона, а с серверной части платформы:

Добавление нового языка

Для активации мультиязычности нужно добавить язык в разделе Настройки → Языки:

Система предложит заполнить следующие поля:

Язык – здесь выбирается язык из списка предустановленных в системе.

Название – название языка, которое будет отображаться на сайте. Как правило, названия пишутся на том же языке, который и выбран, в нашем случае в поле желательно вписать слово English. В шаблоне выводится через Liquid-переменную {{ language.title }}.

Иконка – здесь можно загрузить свою картинку, которая будет отображаться, если в шаблоне предусмотрен вывод иконок языков. В шаблоне URL иконки доступен через Liquid-переменную {{ language.icon_url }}.

Показывать на сайте – нужно ли показывать язык в списке языков на сайте.

Когда язык создан, он появляется в секции «Дополнительные языки»:

Можно кликнуть по названию языка и изменить его настройки (1), удалить его из системы (2) или добавить еще один язык (3).

Перевод контента (товаров, категорий, блогов и страниц)

Если в разделе Настройки → Языки добавлен хотя бы один дополнительный язык, в правом верхнем углу панели администратора появится переключатель:

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

Для удобства при заполнении соответствующих полей также показывается, какой язык выбран сейчас:

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

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

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

Перевод элементов темы оформления (кнопок, меню, надписей)

inSales предлагает два способа перевода шаблона.

Первый способ предполагает редактирование файла messages.json и является рекомендуемым.

Второй способ заключается в копировании темы в разделе «Дизайн». При этом создается столько копий, сколько языковых версий нужно поддерживать. Мы не рекомендуем использовать этот вариант, поскольку это может вызвать путаницу в будущем, сильно затрудняет внесение правок в шаблон и увеличивает время выполнения любой доработки в коде.

Перевод темы в файле messages.json

Для начала советуем ознакомиться с инструкциями по использованию раздела «Дизайн». В документации по ссылке подробно рассказывается об общих принципах работы раздела, а также о редактировании кода шаблона. Если нужно внедрить мультиязычность через messages.json, то с большой вероятностью пригодятся базовые навыки владения HTML, Liquid и JSON.

JSON – текстовый формат, который позволяет построить удобный список фраз в конструкции такого вида:

{
  "ru": {
    "comment_add": "Добавить комментарий"
  },
  "en": {
    "comment_add": "Add comment"
  }
}

Как видно, в файле представлены два языка – ru и en. При необходимости шаблон может обращаться к нужному языку и забирать из него нужный перевод фразы, обозначенной как comment_add

Для начала убедитесь, что messages.json существует в используемой теме. Для этого зайдите в редактор кода и откройте папку «Настройки шаблона»:

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

  1. Скачайте шаблон на компьютер (кнопка «Действие → Скачать»).
  2. Откройте архив и найдите папку config.
  3. Добавьте файл messages.json в данную папку и запакуйте архив обратно.
  4. Загрузите измененный архив обратно в панель администратора (кнопка «Действие» рядом с ранее скачанной темой → «Загрузить»).

В результате должен получиться тот же самый архив, что и был загружен, но с файлом messages.json в папке config.

Некоторые архиваторы (допустим, WinRAR для Windows) дают возможность добавить файл в архив, не распаковывая его и не запаковывая обратно. Делается это простым перетаскиванием:

Важно: шаблон с пустым messages.json загрузить в панель администратора не получится. Если не получается самостоятельно сформировать данный файл, то скачайте его здесь. Файл по ссылке содержит минимально необходимый набор текстовых данных, чтобы платформа его приняла и успешно подгрузила архив. В случае затруднений также можете обратиться в техподдержку inSales.

Принцип использования файла следующий:

1. Пользователь входит на сайт и попадает на базовую версию с основным языком. Для перехода на нужную языковую версию в адресной строке к текущему URL-адресу нужно дописать специальный параметр ?lang=*, где вместо звездочки вписывается сокращенное общепринятое обозначение языка (ru, en, ua, pl и т.д.).

2. Чтобы не приходилось дописывать параметр в URL, в шапке сайта обычно добавляется специальный переключатель в виде выпадающего списка или иконок с флагами стран (подробнее см. секцию «Добавление переключателя языка на сайт» ниже).

3. Как уже говорилось выше, страницы личного кабинета и оформления заказа переводятся автоматически. Всевозможные тексты из панели администратора (названия меню и пунктов, названия/описания товаров/категорий, тексты страниц и т.п.) шаблон подтягивает напрямую с платформы.

4. С остальными элементами (виджеты, кнопки, метки, всплывашки, формы, предупреждения и т.д.) работа строится иначе.

Чтобы шаблон мог подтянуть нужный текст из messages.json, нужно соблюсти два условия:
– в messages.json содержится нужная фраза;
– в шаблоне она вызывается через объект messages в Liquid.

Например, фраза comment_add, которую мы рассматривали выше, должна вызываться через переменную {{ messages.comment_add }}. В этом случае, когда пользователь будет находиться на основной русскоязычной версии сайта, ему выведется "Добавить комментарий", а когда переключится на английский язык – Add comment.

Иногда можно встретить текст, который прописан напрямую в коде шаблона:

Это плохая практика, такой код не поддерживает мультиязычность. Нам потребуется внести фразу в messages.json, а потом вызвать ее через Liquid. Дополним наш messages.json и поправим строчку со скриншота:

{
  "ru": {
    "comment_add": "Добавить комментарий",
    "error_email": "Неправильно указан e-mail"
  },
  "en": {
    "comment_add": "Add comment",
    "error_email": "Invalid e-mail"
  }
}

Ключ error_email придумали в данном примере самостоятельно. Обратите внимание, что если внутри конструкции {...} несколько строк, в конце каждой из них нужно проставлять запятую. В конце последней строки запятая не ставится.

По аналогии с примером выше находим все возможные фразы, которые прописаны прямо в шаблоне, переносим их в messages.json, а затем удаляем фразу из шаблона и вписываем переменную {{ messages.* }}, вызывающую фразу по ключу.

По умолчанию новые темы, разработанные inSales и доступные в нашей галерее (в том числе бесплатные), имеют поддержку русского и английского языка. Остальные языки с большой вероятностью нужно будет добавлять вручную.

Перевод при помощи копирования шаблонов

Альтернативным вариантом включения мультиязычности на сайте является копирование шаблона оформления. Чтобы скопировать тему, зайдите в раздел Сайт → Дизайн и возле исходной темы нажмите «Действие → Копировать», после чего выберите язык:

Копия шаблона появится в разделе «Установленные шаблоны». Для ее перевода перейдите  в HTML-редактор:

Далее введите нужное слово в поиск по файлам шаблона:

Например, на сайте есть фраза "Показать похожие", введите ее в поле для поиска. Затем нажмите на нужную строку в результатах и измените текст, после чего сохраните изменения:

Проделываем аналогичные шаги с другими фразами.

Чтобы опубликовать тему, нажмите «Опубликовать»:

Так как активный шаблон на другом языке, англоязычный шаблон встанет с ним рядом, и они будут работать совместно:

Добавление переключателя языка на сайт

Для добавления переключателя необходимо знание разметки HTML, а также шаблонизатора Liquid. В базовом варианте код переключателя выглядит так:

{% if languages.size > 1 %}
  <div>
    {% for language in languages %}
      <a href="{{ language.switch_url }}">
        <img src="{{ language.icon_url }}">
      </a>
    {% endfor %}
  </div>
{% endif %}

На странице он выводится в таком виде:

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

Если затрудняетесь добавить код самостоятельно, напишите в техническую поддержку inSales. Данная доработка выполняется бесплатно.

Оставить оценку

Оценка успешно отправлена.
Она будет проверена администратором перед публикацией.
Перед публикацией все оценки проходят модерацию

Оценки: 0

Остались вопросы?
Отправь тикет в техподдержку!
Еще нет своего магазина?
Создайте интернет-магазин на платформе inSales
Всё для продаж уже внутри!
Нажимая кнопку «Зарегистрироваться», я принимаю Пользовательское соглашение и Политику конфиденциальности
Недавно просмотренные статьи
Продолжая пользоваться сайтом,
вы соглашаетесь с использованием cookie