Перевести шаблоны Elementor & Divi без нарушения макета

Вы всё сделали правильно. Вы купили премиум-тему, нашли файл .po, аккуратно перевели его и загрузили .mo в папку с языками. Строки в заголовке темы обновляются корректно. Нижний колонтитул отображается на испанском. Ваша страница оформления заказа WooCommerce локализована. Но затем вы открываете главную страницу, и каждый заголовок, кнопка и текстовый блок, созданные с помощью Elementor, по-прежнему на английском языке.

Вы проверяете файл .po. Вы видите английские строки в коде. Вы переводите снова. Ничего не меняется. Вы очищаете кеши. Ничего не меняется. Вы убеждаете себя, что что-то сломано, пока кто-то на форуме мягко не указывает: Elementor (и Divi, и Beaver Builder, и Bricks) не хранят контент в файлах .po. Они никогда этого не делали. Вы боролись с проблемой, которая неразрешима с помощью выбранного вами подхода.

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

Почему Elementor и Divi не используют файлы .po

Файлы .po хранят строки, которые находятся в коде — вызовы __( 'Shop', 'mytheme' ), разбросанные по шаблонам PHP. Инструмент сборки WP-CLI может извлекать эти строки в шаблон .pot, переводчики работают с файлами .po, а скомпилированные файлы .mo загружаются во время выполнения.

Контент конструктора страниц отличается. Когда вы вводите «Добро пожаловать в наш магазин» в виджет заголовка Elementor, этот текст не находится ни в одном файле PHP. Он сохраняется как JSON (Elementor) или как блок шорткода (Divi) в таблице wp_postmeta, связанной с записью, куда вы его поместили.

Где на самом деле хранится контент конструктора страниц

Elementor хранит дерево виджетов каждой страницы в postmeta под ключом _elementor_data. Откройте любую запись в базе данных, и вы найдете массив JSON, описывающий каждую секцию, колонку и виджет, с встроенными настройками и содержимым:

{
  "id": "a1b2c3",
  "elType": "widget",
  "widgetType": "heading",
  "settings": {
    "title": "Welcome to our store",
    "size": "xl",
    "header_size": "h1"
  }
}

Divi хранит контент своих страниц в виде шорткодов, встроенных в post_content:

[et_pb_section][et_pb_row][et_pb_column type="4_4"]
  [et_pb_text]Welcome to our store[/et_pb_text]
[/et_pb_column][/et_pb_row][/et_pb_section]

Bricks, Beaver Builder и Oxygen следуют тому же шаблону со своим собственным форматом. Ни один из этих видов контента никогда не затрагивается файлами .po / .mo.

Что на самом деле находится в файлах .po

Сам плагин конструктора страниц содержит строки пользовательского интерфейса — надписи кнопок в редакторе, сообщения об ошибках, уведомления администратора. Они находятся в файлах .po и действительно переводятся вашими файлами .mo в wp-content/languages/plugins/. Обычно это сбивает людей с толку: они переводят строки «Elementor» и видят пользовательский интерфейс редактора на испанском, но фактическое содержимое, которое они создали с помощью этих виджетов, остается на английском.

Это различие также является основной причиной половины обращений в нашем руководстве по устранению неполадок, связанных с отображением переводов — читатель ожидает, что файлы .mo будут влиять на контент, который он видит на внешнем интерфейсе, но контент находится в базе данных, а не в коде.

Что на самом деле охватывают файлы .po на сайте с конструктором страниц

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

Файлы .po / .mo переводят

• Строки шаблонов темы: get_template_part, жёстко закодированный текст в header.php, footer.php, functions.php.
• Строки пользовательского интерфейса плагинов: страница оформления заказа WooCommerce, метки администратора Yoast, метки полей Contact Form 7.
• Пользовательский интерфейс плагина конструктора страниц: кнопки редактора Elementor, сообщения о подтверждении сохранения Divi.
• Динамические строки, которые плагины выводят на внешний интерфейс: WooCommerce «Добавить в корзину», «Нет в наличии», суммы корзины.

Файлы .po / .mo НЕ переводят

• Заголовки, абзацы, текст кнопок, введённые в виджеты Elementor.
• Подписи к изображениям, эффекты наведения, заголовки аккордеонов внутри модулей Divi.
• Контент в многократно используемых шаблонах, глобальных секциях, сохранённых блоках.
• Метки пользовательского CSS или встроенные скрипты внутри виджетов конструктора.

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

Два пути локализации конструктора страниц

Существует ровно два способа перевода контента конструктора страниц, и оба имеют реальные компромиссы.

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

Используйте мультиязычный плагин, такой как WPML, Polylang или TranslatePress. Он создает копию каждой страницы для каждого языка. В Elementor вы дублируете весь макет и заменяете текст в каждой копии. В Divi вы копируете блок шорткода и переводите текст между тегами.

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

Минусы: Линейное масштабирование — 5 языков означают в 5 раз больше работы с макетом. Любое изменение дизайна должно быть применено 5 раз. База данных быстро растёт. Кеширование усложняется.

Путь второй: уровень перевода строк

Некоторые плагины (Polylang Pro, модуль WPML String Translation, TranslatePress) могут выводить отдельные строки внутри виджетов конструктора страниц для перевода, а затем заменять их во время рендеринга. Вы поддерживаете один макет, и плагин переводит строки на месте.

Плюсы: Единый источник истины для макета. Изменения дизайна применяются везде.

Минусы: Более низкая гибкость, когда длина переведенного текста значительно меняется. Некоторые виджеты (сложные с вложенным содержимым, динамическими списками, формами) не выводят строки чисто. Затраты на производительность при каждом рендеринге.

Наше сравнение Polylang, WPML и TranslatePress более подробно описывает компромиссы каждого плагина.

Сохранение разметки виджетов в безопасности во время перевода

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

Опасные зоны Elementor

Виджеты Elementor встраивают шорткоды и динамические теги в текстовые настройки. Поле заголовка виджета заголовка может содержать:

Welcome to <strong>our</strong> [user_name] store

Этот [user_name] является динамическим тегом — Elementor заменяет его именем вошедшего в систему пользователя при рендеринге. Если перевод искажает его, пользователям отображается буквальное «[user_name]».

Иконки внутри кнопок используют атрибуты класса, которые не должны переводиться. Альтернативный текст изображения хранится отдельно от URL изображения. Макеты колонок используют настройки, специфичные для контрольных точек (title_mobile, title_tablet), которые требуют индивидуальной обработки.

Вложенность шорткодов Divi

Шорткоды Divi имеют глубокую вложенность: [et_pb_section][et_pb_row][et_pb_column][et_pb_text]. Переводчик, который будет рассматривать блок как обычный текст, закодирует квадратные скобки, переведет значения атрибутов или потеряет закрывающие теги. Любое из этих действий повреждает модуль, и Divi отказывается его отображать.

Безопасный шаблон

Для любого конструктора перевод должен:

1. Разобрать формат виджета (JSON для Elementor, AST шорткода для Divi).
2. Пройтись по дереву, идентифицируя только видимые пользователю текстовые поля.
3. Заблокировать шорткоды, динамические теги, HTML-атрибуты и встроенный CSS.
4. Отправить переводчику только текстовые поверхности с контекстом.
5. Вставить переведенный текст обратно в исходную структуру.

Это тот же принцип, который наш движок применяет к файлам .po. Руководство по переводу файлов .po без нарушения переменных кода подробно описывает шаблоны %s и заполнителей — эквивалентом для конструктора страниц являются шорткоды и динамические теги.

Гибридный рабочий процесс, который действительно работает

Для большинства команд практическим решением является комбинирование обоих подходов.

Шаг 1: Перевод пользовательского интерфейса темы и плагинов через файлы .po

Экспортируйте файлы .pot из вашей темы и ключевых плагинов (WooCommerce, Yoast, UI конструктора страниц). Переведите их один раз с помощью облачного переводчика, который поддерживает формат .po. Поместите скомпилированные файлы .mo в wp-content/languages/. Это обрабатывает 80% строк интерфейса вашего сайта с практически нулевым текущим обслуживанием.

Шаг 2: Выбор мультиязычного плагина для динамического контента

Установите Polylang или WPML для контента записей, страниц и продуктов. Настройте структуру URL (/es/, /fr/) и теги hreflang. Это обеспечивает вам инфраструктуру для контента базы данных на разных языках.

Шаг 3: Выборочное дублирование шаблонов конструктора страниц

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

Шаг 4: Использование перевода строк для повторяющихся блоков

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

Шаг 5: Проверка качества

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

Распространенные ошибки и как их избежать

Несколько ловушек, которые встречаются в каждом проекте локализации конструктора страниц.

Альтернативный текст изображений не переводится

Elementor и Divi хранят альтернативный текст для каждого экземпляра виджета, а не в Медиатеке. Перевод исходного изображения не переводит альтернативный текст во всех виджетах, которые его используют. Обновляйте альтернативный текст на каждой дублированной странице.

Формы и пользовательские поля

Контактные формы, встроенные в виджеты конструктора страниц, имеют свои собственные строки (метки, заполнители, сообщения проверки). Ознакомьтесь с нашим руководством по переводу Gravity Forms и Contact Form 7 для получения информации о формах.

Глобальные виджеты и шаблоны

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

Истечение срока действия кеша перевода

Конструкторы страниц агрессивно кешируют отображаемый HTML. После перевода очистите все кеши, включая кеш CSS Elementor (Elementor > Инструменты > Перегенерировать CSS) и статический кеш CSS Divi.

Подводя итог

Перевод сайта, созданного с помощью Elementor или Divi, не сложнее перевода статической темы — он просто требует правильной ментальной модели. Строки темы и плагинов находятся в файлах .po и распространяются через файлы .mo. Контент конструктора страниц находится в базе данных и распространяется через мультиязычные плагины или ручное дублирование. Смешивание этих двух путей является наиболее частой причиной разочарования «почему мои переводы не работают».

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

Готовы переводить файлы .po вашей темы и плагинов, не нарушая разметку виджетов? Попробуйте SimplePoTranslate бесплатно — кредитная карта не требуется. Загрузите .po, скачайте безопасные переводы, поместите в wp-content/languages/.