How To Display WordPress Categories Below Astra Post

Today we're going to continue on from my series on how to customize the meta for posts using the Astra WordPress Theme.

How to display the WordPress categories below the content in Astra

  1. In functions.php, create a function that echoes the categories.
  2. Hook the function into astra_entry_content_after.
  3. Stop the category displaying in the default place under the title.

This is how the post is laid out at the beginning:

screengrab showing default Astra post layout

The code we want to echo the categories and hook it into the right place is:

add_action( 'astra_entry_content_after', 'category_tag_after_post' );

function category_tag_after_post() {
  if ( !is_single() ) {
    return false;
  }

  $categories = astra_post_categories();
  echo "<div class='entry-meta'>Category: $categories</div>";
}

Put this code into the functions.php file of your child theme.

Let's go through the code in detail.

add_action( 'astra_entry_content_after', 'category_tag_after_post' );

This tells WordPress where you want to display the category.

The 'astra_entry_content_after' is one of Astra's hooks. If you want it to display somewhere else on the page, you would replace this with that location.

The parameter 'category_tag_after_post' is just the name of the function. It can be anything unique that you want, as long as it's the same as the function name.

if ( !is_single() ) {
  return false;
}

We only want this to display on single blog posts. If it's a page or category, the code will stop processing at this point.

If you want this to run on single posts, category pages and the home page (assuming it's not a static page), use this code:

if (!is_single() AND !is_archive() AND !is_home()) {
  return false;
}

For the final section,

$categories = astra_post_categories();
echo "<div class='entry-meta'>Category: $categories</div>";

You could put this in one line, like so:

echo "<div class='entry-meta'>Category: " . astra_post_categories() . "</div>";

But I like to split it out, both for readability and in case I later want to add in things like tags or last updated date.

The HTML wrapper is optional. If you don't want it to be the same style as the Astra meta under the title, you could just wrap it in <p></p>.

The last step is to turn off displaying the categories in the default place.

Go to Customizer -> Blog -> Single Post, look for the Meta heading and turn off the visibility of Category.

Of course if you want it to stay where it is and have the categories display at the top and bottom, that's perfectly fine too.

WordPress Theme Customizer with arrow pointing to greyed out Category in Astra Single Post

The final result will look like this:

Screengrab of final result with the category displaying under the content

If you have any questions, please drop them in the comments below.

Mike Haydon

Thanks for checking out my WordPress and coding tutorials. If you've found these tutorials useful, why not consider supporting my work?

Buy me a coffee

Leave a Comment