Как сделать динамические заголовки H1 в WordPress

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

Почему динамические заголовки H1 важны для SEO и UX

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

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

Как реализовать динамические заголовки H1 в WordPress через код

Рассмотрим несколько примеров кода, которые помогут вывести динамический заголовок H1 в шаблоне single.php или archive.php.

1. Динамический H1 для одиночных записей с учетом категории

В этом примере заголовок будет содержать название записи и основную категорию:

function wpstock_dynamic_h1_title() {
    if (is_single()) {
        $categories = get_the_category();
        $category_name = '';
        if (!empty($categories)) {
            $category_name = $categories[0]->name . ' - ';
        }
        echo '<h1>' . esc_html($category_name . get_the_title()) . '</h1>';
    } elseif (is_archive()) {
        the_archive_title('<h1>', '</h1>');
    } else {
        the_title('<h1>', '</h1>');
    }
}

В шаблоне вместо стандартного <h1><?php the_title(); ?></h1> используйте вызов wpstock_dynamic_h1_title();.

2. Динамический H1 для страниц с пользовательскими фильтрами

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

function wpstock_dynamic_h1_filters() {
    if (is_post_type_archive('product')) {
        $filter = isset($_GET['filter']) ? sanitize_text_field($_GET['filter']) : '';
        if ($filter) {
            echo '<h1>Товары по фильтру: ' . esc_html($filter) . '</h1>';
        } else {
            the_archive_title('<h1>', '</h1>');
        }
    } else {
        the_title('<h1>', '</h1>');
    }
}

Этот метод хорошо подходит для сайтов с каталогами и фильтрами, например, интернет-магазинам.

Использование плагинов для управления динамическими заголовками H1

Если вы не хотите писать код вручную, существуют плагины, которые упрощают управление заголовками:

• Yoast SEO — позволяет задавать шаблоны заголовков для различных типов страниц, включая динамические параметры.
• All in One SEO Pack — аналогичный функционал с возможностью подстановки переменных в заголовках.
• WPSEO Custom Titles — добавляет дополнительные возможности по управлению заголовками без необходимости программировать.

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

Советы и рекомендации по созданию эффективных динамических H1

1. Учитывайте контекст страницы

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

2. Не забывайте про безопасность

Всегда используйте функции очистки данных, такие как esc_html() или sanitize_text_field(), чтобы избежать XSS-уязвимостей при выводе динамического контента.

3. Тестируйте на разных типах страниц

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

Пример комплексного решения с кастомным типом записи и шаблоном заголовка

Предположим, у вас есть кастомный тип записи portfolio. Вы хотите, чтобы заголовок H1 на архиве выводил «Портфолио: {Категория}», а на одиночной записи — «{Название записи} — проект из категории {Категория}».

function wpstock_dynamic_h1_portfolio() {
    if (is_post_type_archive('portfolio')) {
        $term = get_queried_object();
        echo '<h1>Портфолио';
        if ($term && !is_wp_error($term)) {
            echo ': ' . esc_html($term->name);
        }
        echo '</h1>';
    } elseif (is_singular('portfolio')) {
        $categories = get_the_terms(get_the_ID(), 'portfolio_category');
        $category_name = '';
        if (!empty($categories) && !is_wp_error($categories)) {
            $category_name = $categories[0]->name;
        }
        echo '<h1>' . esc_html(get_the_title()) . ' — проект из категории ' . esc_html($category_name) . '</h1>';
    } else {
        the_title('<h1>', '</h1>');
    }
}

Подключите этот вызов в шаблонах, связанных с портфолио, чтобы улучшить восприятие и SEO.

Заключение

Динамические заголовки H1 в WordPress — это эффективный способ повысить качество сайта и его позиции в поисковой выдаче. Используйте кодовые примеры для кастомизации, а при необходимости — плагины для упрощения работы. Главное — делать заголовки релевантными, уникальными и безопасными.

Для расширенных возможностей по SEO и оптимизации рекомендуем ознакомиться с продуктами на WPSHOP.ru, которые помогут автоматизировать многие процессы.