Display the Terms of a Post in WordPress

How to Display the Terms of a Post in WordPress (Step-by-Step)

by

When you’re working with custom taxonomies in WordPress — or even the built-in ones like categories and tags — it’s important to know how to display the terms assigned to a specific post.

In this tutorial, you’ll learn how to show the terms of a post using get_the_terms() and the_terms() — all explained step by step for beginner developers.

🧠 What Are Terms in WordPress?

In WordPress, terms are individual items within a taxonomy.

For example:

  • In the category taxonomy → Tech, Design, Tutorials are terms.
  • In a custom taxonomy technology → JavaScript, PHP, Python are terms.

🧱 Step 1: Add Terms to a Post

First, make sure your post (or custom post type) has terms assigned. You can do this in the WordPress admin by selecting:

Post → Edit → Categories / Tags / Custom Taxonomy

Assign some values (like “JavaScript” or “CSS”) before continuing.

🔄 Step 2: Use the_terms() to Display Terms

If you just want to print terms as links, this function is the easiest:

<?php
the_terms(
  get_the_ID(),
  'technology', // taxonomy name
  'Technologies: ', // text before the list
  ', ', // separator between terms
  '' // text after the list
);
?>

✅ Explanation:

  • get_the_ID(): Gets the ID of the current post.
  • 'technology': Replace with your taxonomy slug (category, post_tag, or a custom one).
  • 'Technologies: ' → label before the list
  • ', ' → separator between each term

Output Example:

Technologies: JavaScript, CSS, PHP

Each term is automatically linked to its archive page.

📚 Step 3: Use get_the_terms() for More Control

If you need to customize the output, you can use get_the_terms():

<?php
$terms = get_the_terms(get_the_ID(), 'technology');

if ($terms && !is_wp_error($terms)) {
  echo '<ul class="term-list">';
  foreach ($terms as $term) {
    echo '<li><a href="' . get_term_link($term) . '">' . esc_html($term->name) . '</a></li>';
  }
  echo '</ul>';
}
?>

✅ What’s happening here:

  • get_the_terms() returns an array of term objects.
  • We loop through each and use get_term_link() for the term URL.
  • This approach gives full control over HTML structure (like wrapping in <ul>).

🎨 Optional CSS Styling

.term-list {
  list-style: none;
  padding-left: 0;
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.term-list li a {
  background-color: #7179F4;
  color: white;
  padding: 4px 10px;
  border-radius: 4px;
  text-decoration: none;
  font-size: 0.9rem;
}

✅ Final Result

You’ve now learned how to:

  • Display terms from any taxonomy in WordPress
  • Use both simple and customizable functions
  • Style the output to match your project

This is essential when working with categories, tags, or any kind of custom grouping.

Leave a Comment