WP SITES

Log in

Display List of Tags

—

by

Brad Dalton

This tutorial provides 5 different code examples which enable you to display a list of tags anywhere in your theme.

tags

In the 1st example, the code displays the list using the loop start hook and includes the count.

add_action( 'loop_start', 'list_tags_with_count' );
function list_tags_with_count() {
$tags = get_tags( array('orderby' => 'count', 'order' => 'DESC') );
foreach ( (array) $tags as $tag ) {
echo '<li><a href="' . get_tag_link ($tag->term_id) . '" rel="tag">' . $tag->name . ' (' . $tag->count . ') </a></li>';
    }
}

The 2nd example removes the tag count:

add_action( 'loop_start', 'list_tags_no_count' );
function list_tags_no_count() {
$tags = get_tags( array('orderby' => 'count', 'order' => 'DESC') );
foreach ( (array) $tags as $tag ) {
echo '<li><a href="' . get_tag_link ($tag->term_id) . '" rel="tag">' . $tag->name . '</a></li>';
    }
}

The 3rd example adds a custom class to each listed tag:

add_action( 'loop_start', 'list_tags_with_class' );
function list_tags_with_class() {
$tags = get_tags();
$html = '

<ul class="post_tags">';
foreach ( $tags as $tag ) {
    $tag_link = get_tag_link( $tag->term_id );
            
    $html .= "<li><a href='{$tag_link}' title='{$tag->name} Tag' class='{$tag->slug}'>";
    $html .= "{$tag->name}</a></li>";
    }
$html .= '</ul>

';
echo $html;
}

The 4th example works on single posts and displays tags for each post in a list.

add_action('loop_start','list_single_post_tags');
function list_single_post_tags() {
if ( is_singular('post')) {
    echo get_the_tag_list('

<ul><li>','</li><li>','</li></ul>

');
    }
}

See get_the_tag_list for more information.

Custom Tag List Widget

This code enables you to create your own tag list widget similar to the native tag cloud widget included in WordPress.

custom-tag-widget

You’ll need to load the file from your functions file and register the widget using the following code.

In this example, we’ll load the file from a child theme using get_stylesheet_directory()

require_once( get_stylesheet_directory() . '/class-wp-widget-tag-list.php' );

function register_tag_lists_widget() {
    register_widget( 'WP_Widget_Tag_List' );
}
add_action( 'widgets_init', 'register_tag_lists_widget' );

And then create a file named class-wp-widget-tag-list.php in your child themes root directory using the following code.

Related Tutorials

Comments

6 responses to “Display List of Tags”

  1. Tim Burkart Avatar
    Tim Burkart

    Hi Brad,

    I tried unsuccessfully to pay with Paypal and then Google pay but neither worked.

    I’ll try again with a credit card.

    1. Brad Dalton Avatar
      Brad Dalton

      Hi Tim. Did you get a error message? I would like to know what happened when you tried to use PayPal. Thanks.

  2. Tim Burkart Avatar
    Tim Burkart

    How can I customize this to display a tag cloud for a specific category; or by the current category on a category archives page?

    1. Brad Dalton Avatar
      Brad Dalton

      Hi Tim. That would require some work to complete and is not a simple modification. If you’d like to go ahead, you can book a 1 hour consultation and i will complete the work for you. https://wpsites.net/product/hourly-consulting/

      1. Tim Burkart Avatar
        Tim Burkart

        Hi Brad,

        I just purchased a 1 hour consultation. Please proceed with the work for this customization.

        Thank you!

        1. Brad Dalton Avatar
          Brad Dalton

          Here you go Tim https://wpsites.net/?p=111322

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.