Как удалить пустые теги

из темы WordPress

Почему появляются пустые теги <p> в теме WordPress?

Пустые теги <p> часто возникают из-за автоматического форматирования контента функцией wpautop(), которая добавляет параграфы и переносы строк в текст. Это особенно заметно при работе с кастомными полями, виджетами или при выводе контента через функции, которые не учитывают разметку HTML. Такие пустые теги влияют на внешний вид, могут создавать лишние отступы и ухудшают семантику страницы.

Основные причины появления пустых <p> тегов:

• Автоматический вызов wpautop() к контенту, где уже есть HTML-разметка.
• Вывод кастомного поля без фильтрации и очистки.
• Использование шорткодов, которые возвращают пустые строки с обрамлением в <p>.
• Редактор Gutenberg и визуальный редактор Classic иногда добавляют лишние параграфы.

Диагностика проблемы: как найти пустые теги <p>

Для диагностики пустых параграфов:

• Откройте исходный код страницы (Ctrl+U или через инструменты разработчика).
• Найдите последовательности <p> </p> или <p><br /></p>.
• Проверьте, какой контент выводится в этом месте шаблона (например, кастомное поле или шорткод).
• Отключите плагины, которые могут автоматически обрабатывать контент и влиять на форматирование.

Также можно временно заменить the_content() на echo get_the_content() в шаблонах, чтобы проверить, влияет ли wpautop() на форматирование.

Пошаговое решение: как убрать пустые <p> теги из темы WordPress

1. Отключение автоматического добавления параграфов для конкретного вывода

Если вы выводите контент через функцию the_content() или кастомное поле, и знаете, что там уже есть HTML, можно отключить wpautop() с помощью фильтра:

remove_filter('the_content', 'wpautop');

Однако это отключит автоматическое форматирование для всего содержимого, что не всегда удобно.

2. Использование wpautop() выборочно

Если контент из кастомного поля, можно обработать его вручную:

$content = get_post_meta(get_the_ID(), 'custom_field', true);
echo wpautop($content, false); // false — отключает добавление <br>

Так вы контролируете, где применять параграфы.

3. Удаление пустых тегов с помощью регулярных выражений

После вывода контента можно отфильтровать его и удалить пустые параграфы:

function remove_empty_p_tags($content) {
  // Удаляем теги <p> без содержимого или с пробельными символами
  $content = preg_replace('/<p>\s*(<br ?\/>)?\s*<\/p>/i', '', $content);
  return $content;
}
add_filter('the_content', 'remove_empty_p_tags', 20);

Обратите внимание, что фильтр с приоритетом 20 применяется после wpautop() (обычно приоритет 10), что позволяет удалить пустые теги уже после автоматического форматирования.

4. Исправление вывода шорткодов

Если пустые параграфы появляются вокруг шорткодов, добавьте фильтр для их очистки:

remove_filter('the_content', 'wpautop');
add_filter('the_content', 'shortcode_empty_p_fix');

function shortcode_empty_p_fix($content) {
    $array = [
        '<p>[' => '[',
        ']</p>' => ']',
        '<p><br />[' => '[',
        ']<br /></p>' => ']',
    ];
    return strtr($content, $array);
}

Это удалит пустые параграфы, обрамляющие шорткоды.

Проверка результата после внедрения

После внесения изменений проверяйте:

• В исходном коде страницы отсутствуют пустые <p> (пустые по содержанию или с <br />).
• Визуально на сайте не появляются лишние отступы или пустые блоки.
• Шорткоды работают корректно, без разрывов и с правильным форматированием.
• Другие части контента не потеряли форматирование (например, отступы и переносы в тексте).

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

Частые ошибки и как их исправить

Ошибка 1: Удаление wpautop() ломает форматирование всего контента

Причина: Вы отключили автоматическое форматирование для всей страницы, а не выборочно.

Решение: Используйте фильтры с приоритетом или применяйте remove_filter('the_content', 'wpautop') только в нужных шаблонах или функциях.

Ошибка 2: Пустые теги появляются после шорткодов

Причина: Шорткоды оборачиваются в параграфы редактором.

Решение: Используйте функцию shortcode_empty_p_fix() из примера выше или управляйте выводом шорткода через do_shortcode() без лишних тегов.

Ошибка 3: Регулярные выражения удаляют нужные теги

Причина: Шаблон регулярного выражения слишком общий.

Решение: Тестируйте выражения на разных типах контента и используйте более точные паттерны, например, проверяя наличие только пробелов внутри <p>.

Практические советы по производительности и безопасности

• Не отключайте wpautop() глобально без необходимости — это может ухудшить читаемость и структуру HTML на сайте.
• Фильтры с регулярными выражениями добавляйте с осторожностью — они влияют на производительность при большом количестве контента.
• Если используете пользовательские поля с HTML, обязательно очищайте и валидируйте содержимое перед выводом, чтобы избежать XSS-уязвимостей.
• Для сложных кейсов форматирования контента рассмотрите использование кастомных блоков Gutenberg, где контроль над разметкой лучше.

Сравнение методов удаления пустых <p> тегов