Как правильно переводить строки с HTML в WordPress (без поломки разметки)

Работа с i18n в WordPress чаще всего ломается в одном месте — когда в строке перевода появляется HTML. Сначала «вроде работает», потом подключается другой язык — и разметка начинает вести себя непредсказуемо. Разберёмся, как делать правильно.

<h2><b><?php _e('<b>Calculator</b> storage cost', 'storage-calculator'); ?></b></h2>

Вариант 1 — простой и безопасный

Если порядок слов не критичен:

<h2>
    <b><?php esc_html_e('Calculator', 'storage-calculator'); ?></b>
    <?php esc_html_e('storage cost', 'storage-calculator'); ?>
</h2>

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

Вариант 2 — универсальный и гибкий (через printf)

Если нужен один перевод и возможность менять порядок слов:

<h2>
<?php
printf(
    __('%1$sCalculator%2$s storage cost', 'storage-calculator'),
    '<b>',
    '</b>'
);
?>
</h2>

В .pot попадёт строка:

msgid "%1$sCalculator%2$s storage cost"
msgstr ""

В ru.po:

msgid "%1$sCalculator%2$s storage cost"
msgstr "%1$sКалькулятор%2$s стоимости хранения"

Как это работает технически

1. __() возвращает переведённую строку
2. printf() заменяет плейсхолдеры на <b> и </b>
3. Формируется корректный HTML

Итоговый результат:

<b>Калькулятор</b> стоимости хранения

Никакой магии. Только позиционная подстановка аргументов.

Дополнительная защита

Если проект крупный и есть риск, что в перевод добавят лишний HTML:

<h2>
<?php
printf(
    wp_kses_post(__('%1$sCalculator%2$s storage cost', 'storage-calculator')),
    '<b>',
    '</b>'
);
?>
</h2>

Чего делать не стоит

<?php _e('<b>Calculator</b> storage cost', 'storage-calculator'); ?>

• HTML внутри переводов
• Высокий риск поломки вложенности
• Невозможно контролировать структуру разметки
• Проблемы масштабирования проекта