Как вывести все теги WordPress ?

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

1. Добавление функции в functions.php

Создайте новую функцию в файле functions.php вашей темы. Этот код будет собирать все доступные теги из базы данных и формировать HTML-список с ссылками на страницы этих тегов :

function show_all_tags_shortcode() {
    $tags = get_terms(array(
        'taxonomy'   => 'post_tag', 
        'hide_empty' => false,     
    ));

    if (empty($tags)) return 'Нет меток'; 

    $output = '<ul class="all-tags-list">';
    foreach ($tags as $tag) {
        $output .= '<li><a href="' . get_term_link($tag) . '">' . esc_html($tag->name) . '</a></li>';
    }
    $output .= '</ul>';
    return $output;
}
add_shortcode('all_tags', 'show_all_tags_shortcode');

Этот код создает шорткод [all_tags], который можно использовать в любом месте вашего сайта (в записях, страницах или виджетах).

2. Использование шорткода

Чтобы вывести список всех тегов, просто вставьте следующий шорткод в нужное место:

[all_tags]

После сохранения вы увидите список всех тегов, оформленный в виде HTML-списка.

3. Оформление стилями

Для того чтобы теги выглядели привлекательно, добавьте следующие CSS-стили в файл style.css вашей темы:

.all-tags-list {
    list-style: none; 
    padding: 0;      
    display: flex;    
    gap: 10px;       
    flex-wrap: wrap;  
    justify-content: center; 
}

.all-tags-list li {
    padding: 5px 10px; 
    border-radius: 5px; 
    border: 1px solid #FFFFFF29; 
}

.all-tags-list li a {
    text-decoration: none; 
    color: #fff;           
    font-weight: 400;      
    font-size: 16px;       
    transition: color 0.3s ease; 
}

.all-tags-list li:hover {
    background: #fff; 
    border: 1px solid #000; 
}

.all-tags-list li:hover a {
    color: #000; 
}

4. Как это работает

  • Функция get_terms() собирает все теги из базы данных. Мы указываем параметр 'hide_empty' => false, чтобы показывать даже те теги, которые не связаны ни с одной записью.
  • Шорткод [all_tags] позволяет легко вставить список тегов в любое место вашего сайта без дополнительных плагинов.
  • CSS-стили делают вывод тегов более привлекательным и удобным для пользователей.

5. Заключение

Теперь вы знаете, как вывести все теги WordPress через functions.php и оформить их стильным списком. Этот метод идеально подходит для создания облака тегов или страницы с перечнем всех меток на вашем сайте.

Эффект наложения подчеркивания на текст

Как выбрать правильные инструменты для веб-разработки?

Подчеркивание текста при наведении