How to display all WordPress tags?

🕒 ~3 min read

That is registered in the functions.php file. In this guide, we will show you how to add code to display all tags and style them.

1. Adding a Function to functions.php

Create a new function in your theme’s functions.php file. This code will collect all available tags from the database and form an HTML list with links to these tag pages:

PHP

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

    if (empty($tags)) return 'No tags';

    $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');

This code creates a shortcode [all_tags] that you can use anywhere on your site (in posts, pages, or widgets).

2. Using the Shortcode

To display the list of all tags, simply insert the following shortcode in the desired location:

[all_tags]

After saving, you will see a list of all tags formatted as an HTML list.

3. Styling

To make the tags look attractive, add the following CSS styles to your theme’s style.css file:

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. How it Works

  • The get_terms() function retrieves all tags from the database. We specify the parameter 'hide_empty' => false to show even those tags that are not associated with any posts.
  • The [all_tags] shortcode makes it easy to insert the tag list anywhere on your site without additional plugins.
  • The CSS styles make the tag output more attractive and user-friendly.

5. Conclusion

Now you know how to display all WordPress tags via functions.php and format them as a stylish list. This method is ideal for creating a tag cloud or a page with a list of all labels on your site.

Basics of Web Development: An Overview of Core Concepts and Technologies

How to create a website for a personal blog on WordPress/Elementor?

SEO optimization of websites on Elementor: best practices for 2025

Elementor: creating landing pages and complex web pages