Мультиязычный сайт
Оглавление:
Что такое мультиязычный сайт
Мультиязычный сайт — это сайт, контент которого доступен на нескольких языках. Переключение между языковыми версиями доступно кликом на элемент Языковое меню.
Как добавить элемент Языковое меню
Добавить элемент Языковое меню можно в любой секции.
Для добавления доступны как статичный, так и абсолютный (свободно-позиционируемый) элемент Языковое меню.
Настройки стиля в Языковом меню
Во вкладке Стиль можно настроить внешний вид языкового меню.
Вид иконки. Выберите как должен отображаться язык:
Форма иконки флага. Выберите форму: прямоугольная, прямоугольная с закругленными краями или круг.
Вид меню. Выпадающее меню или в ряд.
Если вы выбираете выпадающее меню, в свернутом состоянии будет отображаться язык отображаемой страницы.
Выберите Ориентацию (по горизонтали или по вертикали), настройте Размер иконки (вручную или выберите из пресетов) и Отступы.
Параметры текста. Настройте параметры текста: цвет, размер, жирность, межбуквенный интервал и оформление. При нажатии на иконку настроек откроются расширенные параметры редактирования текста.
Добавление нового языка
Зайдите в Настройки элемента.
Во вкладке Языки нажмите Добавить.
В выпадающем списке выберите флаг страны, введите название языка, укажите ссылку для перехода. При выборе языка пользователя переадресует по указанной ссылке.
Дефолтным будет являться язык, установленный в настройках страницы. Он всегда будет первым в списке, его порядок изменить не получится. Для остальных языков порядок можно менять.
В статье далее поговорим о том, какой вариант ссылки выбрать и как ее настроить.
Настройка формата ссылок
Мультиязычным сайт можно сделать как в рамках одного сайта, так и на нескольких сайтах.
Примеры:
У вас простой сайт, например, сайт ресторана.
Ассортимент и валюта не зависят от локализации клиента, и от выбранного языка должен меняться только язык контента. В этом случае достаточно настроить простой переход по ссылкам в рамках одного сайта.
Ассортимент и валюта не зависят от локализации клиента, и от выбранного языка должен меняться только язык контента. В этом случае достаточно настроить простой переход по ссылкам в рамках одного сайта.
Например, пользователь переходит с главной страницы site.ru/ на русском языке, на страницу site.ru/fr/ для французского языка и site.ru/en/ для английского языка.
В этом примере вы можете использовать относительные ссылки (часть ссылки после названия домена, отделенного /, например, /en/contacts/ ).
У вас сложный сайт, где валюта и ассортимент товара различаются в зависимости от локализации.
В этом случае рекомендуется приобретать тариф Бизнес и создавать разные сайты для разных языков. Например, site.ru для русской версии, и site.com для английской версии.
В этом случае рекомендуется приобретать тариф Бизнес и создавать разные сайты для разных языков. Например, site.ru для русской версии, и site.com для английской версии.
Тогда в качестве ссылки указывайте абсолютную ссылку, с полным путем до сайта. Например, https://site.com/contacts/ для перехода на английскую версию сайта.
Переменные
Переменные целесообразно использовать в ситуации, когда у вас сложный сайт с множеством страниц, и вы хотите чтобы при смене языка пользователь оставался в том же разделе. Другими словами, переменные обеспечивают переходы между двумя идентичными страницами на разных языках.
ВАЖНО: Для того, чтобы переменные работали корректно, нужно задать одинаковую структуру в адресах страниц. Например, site.com/contacts/ и site.ru/contacts/.
Переменная {uri}
Например, вы хотите, чтобы при переходе с русской страницы site.ru/contacts/ открывалась такая же страница, но на английском языке site.com/contacts/.
В поле для ссылки укажите:
site.ru/{uri} для русского языка
site.com/{uri} для английского языка.
site.ru/{uri} для русского языка
site.com/{uri} для английского языка.
Браузер автоматически подставит адрес страницы, на которой находится посетитель
вместо переменной {uri}
вместо переменной {uri}
Переменная {clean_uri}
Эта переменная поможет вам при создании мультиязычного сайта в рамках одного домена.
Принцип работы переменной похож на обычную {uri}, но из адреса страницы будет вырезаны первые два символа заключенные в / (боковые слэши).
То есть значение /en/contacts/ для {uri} будет соответствовать значению /contacts/ для {clean_uri} (см. таблицу с примерами ниже).
Пример мультиязычного сайта с настроенной структурой страниц по языкам:
— Русские страницы: /, /contacts/, /about/
— Английские страницы: /en/, /en/contacts/, /en/about/
— Французские страницы: /fr/, /fr/contacts/, /fr/about/
— Русские страницы: /, /contacts/, /about/
— Английские страницы: /en/, /en/contacts/, /en/about/
— Французские страницы: /fr/, /fr/contacts/, /fr/about/
Если для английского языка указать ссылку https://site.com/en/{clean_uri}, при переходе со страницы Контакты (/fr/contacts/ для французской версии или /contacts/ для русской), браузер вырежет первые символы /fr из адреса. И в значении переменной останется /contacts/. Это значение будет подставлено в указанную вами ссылку вместо переменной и получится адрес: https://site.com/en/contacts/
В строке браузера адрес поменяется с https://site.com/ru/contacts/ на https://site.com/en/contacts/, и визуально для посетителя поменяется только язык страницы.
Примеры значений переменных для разных страниц:
Адрес страницы | Значение переменной {uri} | Значение переменной {clean_uri} |
---|---|---|
site.com/ | / | / |
site.com/menu/ | /menu/ | /menu/ |
site.com/ru/menu/ | /ru/menu/ | /menu/ |
site.com/ru/pp/menu/ | /ru/pp/menu/ | /pp/menu/ |
site.com/rus/menu/ | /rus/menu/ | /rus/menu/ |
Параметр fallback
При использовании переменных может возникнуть ситуация, когда на английском сайте нет страницы с таким же адресом, как на русском сайте или наоборот. В этом случае при выборе языка откроется страница с ошибкой 404 (страница не существует).
Чтобы этого не произошло, можно указать в ссылке параметр fallback. Если добавить в ссылку перехода параметр ?fallback=/, то пользователь будет перенаправлен на страницу, которую вы укажете после ссылки.
Пример:
Для английского языка указана ссылка site.com/{uri}?fallback=/
Для английского языка указана ссылка site.com/{uri}?fallback=/
Это означает, что при клике на английский флаг платформа будет искать на английском сайте страницу с таким же адресом, как на текущей странице сайта. Если на английском сайте страницы с таким же адресом нет, произойдет переход на / (главную страницу).
Создание мультиязычного сайта в рамках одного сайта
Такой вариант подойдет для приема заявок от пользователей, для информационных лендингов, портфолио.
Важно!
Параметры сайта: например, валюту и интеграции можно настроить только на весь сайт
Параметры сайта: например, валюту и интеграции можно настроить только на весь сайт
1. Создайте на сайте страницы на разных языках, например, русскую и английскую версию сайта.
2. Задайте язык для каждой страницы в Настройках страницы. На этом языке будут отображаться системные надписи: ошибки в формах, сообщения о скидках, промокодах, согласие на обработку персональных данных и другие.
3. Добавьте на каждую страницу в шапку элемент Языковое меню.
Опционально: Сделайте шапку глобальной секцией. Так ее можно будет использовать на разных страницах сайта: изменения в одной секции автоматически применяются ко всем остальным. Это позволит быстро управлять языковым меню без необходимости вносить правки на каждой странице.
4. Настройте языки и переходы по ссылкам.
Создание мультиязычного сайта на отдельных сайтах
В этом варианте сайты создаются на отдельных доменах. Для каждой версии сайта можно настроить свою валюту и интеграции.
Этот вариант создания мультиязычного сайта доступен на тарифе Бизнес. В тарифах «Стартовый» и «Малый бизнес» есть ограничения по количеству сайтов, тариф «Бизнес» позволяет создавать более одного сайта.
1. Создайте сайты на разных языках, например, русскую и английскую версии сайта.
2. В настройках каждого сайта укажите Язык, соответствующий языку контента, настройте валюту, заполните товары, подключите интеграции и прочие настройки сайта.
3. Добавьте в шапку элемент Языковое меню.
Опционально: В рамках каждого сайта делайте шапку глобальной секцией. Так ее можно будет использовать на разных страницах сайта: изменения в одной секции автоматически применяются ко всем остальным. Это позволит быстро управлять языковым меню без необходимости вносить правки на каждой странице.
4. Настройте языки и переходы по ссылкам.
Звонок по России бесплатный
8 (800) 555-45-12
© 2012 – 2024 ООО «Флексби»