В данной статье я опишу мой подход к локализации сайта, который я довольно успешно применил.
Я просмотрел практически всю информацию на данную тему и преобразовал ее под свои нужды.
Мой подход далеко не идеальный, поэтому делитесь замечаниями и вариантами доработок, возможно мы улучшим статью.
Данный гайд основывается на версии 1, но думаю и для второй будет актуален.
Вот список на который я опирался:
https://habr.com/ru/post/305802/
В списке выше есть источник тут и тут, который прекрасно описывает как локализовать сайт, если используются стандартные плагины RainlabBlog и RainlabStaticPages.
Я же буду говорить о примере, когда данные плагины практически не используются и сайт делается на своих компонентах, что я наблюдаю гораздо чаще.
Постановка задачи
- локализация статического контента
- локализация динамического контента в плагинах и компонентах
- локализация интерфейса (меню, футер, функциональные элементы)
- локализация ссылок
Что нам понадобиться
В моем случае я использовал смежный функционал двух плагинов: RainlabTranslate и ContentEditor.
Далее я объясню как их использовать и для чего каждый.
Локализация статики
Я буду показывать на demo теме октября. Ее переводом мы и займемся.
Локализации статики — это самое простое. Для этого я использовал ContentEditor. Во первых это удобно для клиента, а во вторых он замечательно расширяется RainlabTranslate.
После установки переходим в настройку Транслейта и устанавливаем языки. Их название и локали.
Я добавил русский и сделал его по умолчанию.
Отлично. Теперь у нас доступен режим подраздела для наших локалей.
Можем перейти и попробовать: http://localhost:8888/ru и http://localhost:8888/en. Пока что никаких изменений.
Теперь задаем контент эдитор. Суть плагина в том, что мы оборачиваем контент в паршил, которые хранятся в директории контента themes/demo/content. Расширение транслейта происходит за счет того, что у нас создаются поддиректории для каждого языка автоматом.
Для контент эдитора я использую твиг тег такого вида:
{% component 'contenteditor' file="lang/home/numbers" class='' fixture='div'%}
Создаем директорию themes/demo/content/lang. И так же в главном layout обяъявляем компонент контент эдитора — [contenteditor]
И далее для примера переведем кусок контента на главной. Перенесем контент блок wellcome.htm в lang и импортируем в виде паршила контент эдитора.
В таком виде:
url = "/"
layout = "default"
==
<div class="jumbotron">
<div class="container">
{% component 'contenteditor' file="lang/home/welcome" class='' fixture='div'%}
</div>
</div>
Отлично у нас появилась кнопка редактирования и область контента стала подсвеченной.
Теперь можем отредактировать контент под разными локалями http://localhost:8888/ru и http://localhost:8888/en. Кстати я передумал 🙂 основной язык все таки будет английский а переводить будем на русский. Поэтому на локаль en оставляем без изменений, а на локали ru переводим.
Как то так.
Таким же способом можно перевести и другие блоки достаточно внезависимости от сложности верстки. Тоже самое касается других страниц.
При этом если мы посмотрим на директорию контент, то увидим rulang папку. Так же будет и с остальными языками.
Плюсы:
— удобно для пользователя
— игнорируется сложность верстки
— редактирование любых страниц без использования StaticPages плагина
— сколько угодно языков
Минусы
— шаблон дробится на вставки из контент эдитора, что усложняет поиск элементов.
Дальнейший перевод рассмотрим в следующих частях.
