wp-lessons.ru wordpress WP-Lessons

Как удалить пустые теги в WordPress без плагинов

Пустые HTML-теги в контенте WordPress могут появляться по разным причинам: ошибки при копировании текста, некорректная работа редактора, некачественные темы или плагины. Они не только ухудшают семантику страницы, но и влияют на производительность и SEO. В этой статье подробно разберём, как эффективно находить и удалять пустые теги в WordPress без использования сторонних плагинов, прямо в коде темы или через функции сайта.

Почему появляются пустые теги в WordPress и как их выявить

Пустые теги — это HTML-элементы без содержимого, например, <p></p>, <div></div>, <span></span>. Они появляются по нескольким причинам:

  • Редактор Gutenberg иногда создаёт пустые параграфы при переключении между блоками.
  • При копировании текста из сторонних источников в редактор вместе с форматированием попадают лишние пустые теги.
  • Некорректно запрограммированные шаблоны или шорткоды, которые возвращают пустой HTML.
  • Автоматические визуальные редакторы, которые могут оставлять пустые контейнеры.

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

Как удалить пустые теги с помощью фильтра контента WordPress

Самый простой и эффективный способ — подключить функцию, которая будет фильтровать весь контент перед выводом и удалять пустые HTML-теги. Для этого в файл functions.php вашей темы добавим следующий код:

function wplessons_remove_empty_tags($content) {
    // Регулярное выражение для поиска пустых тегов <p>, <div>, <span> и т.д.
    $pattern = '/<(p|div|span|section|article|aside)([^>]*)>\s*<\/\1>/i';
    
    // Убираем пустые теги в цикле, пока они есть
    while (preg_match($pattern, $content)) {
        $content = preg_replace($pattern, '', $content);
    }
    return $content;
}
add_filter('the_content', 'wplessons_remove_empty_tags');

Объяснение кода:

  • Регулярное выражение ищет пустые теги <p></p>, <div></div>, <span></span>, а также section, article, aside.
  • Цикл while гарантирует удаление всех вложенных пустых тегов, которые могут появиться после удаления первых.
  • Функция подключается через фильтр the_content, чтобы обработать основной контент поста перед выводом.

Этот подход подходит для большинства сайтов и не требует установки дополнительных плагинов.

Удаление пустых тегов из виджетов и пользовательских полей

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

Очистка виджетов с текстом

Для удаления пустых тегов из виджетов с текстом используйте фильтр widget_text:

function wplessons_remove_empty_tags_widget($widget_content) {
    return wplessons_remove_empty_tags($widget_content);
}
add_filter('widget_text', 'wplessons_remove_empty_tags_widget');

Обработка пользовательских полей и других данных

Если вы выводите пользовательские поля вручную через функцию get_post_meta, можно вручную применять очистку перед выводом:

$raw_meta = get_post_meta($post_id, 'your_meta_key', true);
$clean_meta = wplessons_remove_empty_tags($raw_meta);
echo $clean_meta;

Автоматическая очистка контента при сохранении поста

Чтобы не допускать появление пустых тегов в базе данных, можно очищать контент при сохранении поста. Для этого используем хук save_post:

function wplessons_clean_content_on_save($post_id) {
    // Проверяем права пользователя и тип записи
    if (wp_is_post_revision($post_id) || wp_is_post_autosave($post_id)) {
        return;
    }
    
    $post = get_post($post_id);
    if ($post->post_type !== 'post' && $post->post_type !== 'page') {
        return;
    }
    
    $clean_content = wplessons_remove_empty_tags($post->post_content);
    if ($clean_content !== $post->post_content) {
        // Обновляем контент, если были изменения
        wp_update_post([
            'ID' => $post_id,
            'post_content' => $clean_content
        ]);
    }
}
add_action('save_post', 'wplessons_clean_content_on_save');

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

Использование плагина Clearfy для оптимизации и очистки HTML

Если вы хотите получить более расширенный функционал по очистке и оптимизации кода, обратите внимание на плагин Clearfy Pro. Помимо удаления пустых тегов, он умеет:

  • Оптимизировать вывод кода и удалять лишние атрибуты.
  • Убирать ненужные скрипты и стили.
  • Автоматически удалять комментарии в HTML.

Это полезно для комплексной оптимизации кода вашего сайта.

Советы по предотвращению появления пустых тегов в будущем

Для минимизации появления пустых тегов придерживайтесь следующих рекомендаций:

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

Так вы уменьшите количество пустых тегов и улучшите качество сайта.

×
WordPress
прокачай свой сайт!

Скидка на премиум темы и плагины

Успей забрать скидку ⋙