Как удалить или изменить заголовок виджета в WordPress? Скрываем, заменяем теги h2-h3-h4 и стилизуем заголовок.

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

Как удалить заголовок виджета вручную?

Добавлять код мы будем в файле functions.php вашей темы, предварительно не забудьте сделать бэкап данного файла. Открываем functions.php спускаемся вниз и добавляем следующий код.

add_filter( 'widget_title', 'hide_widget_title' );
function hide_widget_title( $title ) {
    if ( empty( $title ) ) return '';
    if ( $title[0] == '!' ) return '';
    return $title;
}

После добавления кода, переходим в раздел виджетов и в поле заголовок перед названием пишем «!», например «!Последние записи». Отмеченные таким образом заголовки не будут выводиться на сайте.

Как это выглядит в админке.

Это старый проверенный способ, который скрывает заголовок виджета.

Как скрыть заголовок виджета с помощью плагина?

Второй вариант не выводить заголовок для виджета – это использовать плагин. Есть очень удобный и многофункциональный плагин, который добавляет много опций к виджетам, он называется – «Widget Options». Одной из опций при редактировании виджетов является функция по скрытию заголовка конкретно выбранного блока.

Алгоритм работы тут следующий. Устанавливаем  и активируем плагин «Widget Options».

После этого переходим в раздел меню «Внешний вид» — «Виджеты». Добавляем новый виджет, открываем его вкладку, и мы увидим новые настройки, которые собственно и добавляет плагин «Widget Options».

Выбираем вкладку настроек (шестеренку) и активируем чекбокс – «Check to hide widget title».

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

Как добавить свою ссылку для заголовока виджета в WordPress?

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

Для решения этой задачи я буду использовать плагин – «HTML Widget Titles» (разработчик Jaimyn Mayer). Устанавливаем и активируем его. При поиске плагина в админке можете задавать фразу «HTML Widget Titles Jaimyn Mayer».

Переходим в раздел «Внешний вид» — «Виджеты».

Открываем интересующий виджет и добавляем в поле заголовок, следующий код.

[a href=http://www.yourlink.com]Your Title[/a]

Вы указываете свое название виджета и ссылку.

Вот как это должно выглядеть. Нажимаем «Сохранить». В виджете сверху должна добавиться ваша ссылка, например вот так.

После этого ваш заголовок виджета отобразиться в виде ссылки.

Если хотите, чтобы ссылка открывалась в новом окне браузера, то укажите следующий код.

[a href=http://www.yourlink.com target=_blank]Your Title[/a]

Как поменять html структуру заголовка виджета?

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

Меняем шаблон заголовка при регистрации виджета

Для этого идем в файл functions.php и находим примерно следующий код.

function twentynineteen_widgets_init() {

register_sidebar(
    array(
        'name'          => __( 'Footer', 'twentynineteen' ),
        'id'            => 'sidebar-1',
        'description'   => __( 'Add widgets here to appear in your footer.', 'twentynineteen' ),
        'before_widget' => '<section id="%1$s" class="widget %2$s">',
        'after_widget'  => '</section>',
        'before_title'  => '<h2 class="widget-title">',
        'after_title'   => '</h2>',
    )
);

}
add_action( 'widgets_init', 'twentynineteen_widgets_init' );

Для изменения структуры заголовков меняем html код в полях: «before_title», «after_title».

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

Код для изменения html структуры заголовка виджета

Для этого, также переходим в файл functions.php и внизу файла добавляем следующий код.

function my_custom_widget_title_tag( $params ) {
$params[0]['before_title'] = '<div class="widget-title widgettitle">' ;
$params[0]['after_title']  = '</div>' ;
return $params;
}
add_filter( 'dynamic_sidebar_params' , 'my_custom_widget_title_tag' );

Этот код изменить теги для всех заголовков в виджетах сайдбара. Вы можете внутри функции делать проверку на конкретный виджет в формате: $params[‘widget_id] или $params[‘widget_name] и редактировать только один виджет.

Как видите, во всех случаях изменения кода вы можете добавлять свои классы для заголовков этих блоков и стилизовать их на свое усмотрение.

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

Поделиться в социальных сетях:
Нет комментариев к данной статье

Оставить новый комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *