Show category descriptions

Here’s How To Show The Categories Description In WordPress

Table of Contents

One of the most efficient ways of arranging posts into a more logical structure in WordPress is to use categories and tags. They also have the added benefit of improving the general user experience on the website by making the posts more accessible to readers. The majority of WordPress users utilize categories and tags for these objectives on a regular basis, but they rarely use them to their full potential. Even though this article focuses solely on categories, the same approach applies to tags as well.

To begin with, category pages automatically aid in the SEO of your website by offering content that corresponds to specific keywords and phrases. They also provide a way to navigate through a certain set of topics that your readers could find interesting. Despite this, there is one component in categories that are frequently overlooked on WordPress sites: the description.

Category descriptions go along with the category title and provide information about the items in the category. You can increase traffic to category pages with vague or uninteresting titles, or those that would otherwise be disregarded by visitors, by showing a description. Despite its utility, this function is neglected because it is not activated by default in WordPress and is dependent on the theme you install.

How To Show A Category Description In WordPress

In this article, we'll look at two different ways to show category descriptions in WordPress. Custom code snippets are required in both approaches.

The first will allow you to show descriptions on category archive pages, which is where most people expect to see them. The second will allow you to display them on any page of your .

However, before proceeding, you should build a backup of your website just in case something goes wrong. It's also a good idea to brush up on your FTP skills, as FTP will be required for accurately inputting the code.

Finally, it's worth noting that this post is aimed mostly at intermediate and advanced WordPress users. To put it another way, even though we tried to cover everything in this article, depending on your WordPress knowledge, you may need to conduct some further study. Let's get started now.

How To Add A Category Description To WordPress

Before we look at how to display a category description in WordPress, let's look at how to add one. Go to Posts > Categories first to add a description to a category. There are two parts there: one for creating new categories, and the other for viewing your existing categories.

Fill out the Add New Category box on the left to create a new category. This comprises giving the category a name, providing a slug to it, designating a parent category (if necessary), and writing a description in the Description box. When you're finished, click the Add New Category button to make a new category.

ADDING CATEGORY DESCRIPTION TO WORDPRESS

If you wish to add or change the description for an existing category, however, you must first locate it in the list of existing categories on the right. To see the other options, you'll need to hover over it. Finally, select Update to create a new description or edit an existing one.

WORDPRESS POST CATEGORY EDIT

This will take you to the category edit screen, where you may change the description in the Description area. Press the Update button at the bottom to save the information you've entered.

Displaying The Category Description On Category Archive Pages

Although you may anticipate a category to display a category description after you've added it in the previous step, this is not the case. It is not the typical WordPress behavior to display category descriptions, and it is entirely dependent on the theme you are using.

On category archive pages, some themes display the description, while others do not. As a result, regardless of the theme you're using, the first option we'll go through is how to show a category description on a category archive page.

In usually, the archive description() is all that is required to display the category description. The function displays the description for archives (category, tag, phrase, or author) if they've been inserted earlier. Meaning, if other archives have been uploaded, the code can be used to display descriptions for them as well. It also lets you specify the HTML element that will encapsulate the description.

Example:

The archive description would be encased in a div HTML element with the class underwp-category-description in the following code.

the_archive_description( '
', '
' );

You'll need to put it in the right theme template file for it to display the archive description. Depending on your theme's file structure, that file could be the category.php or archive.php file, or another template file.

However, because modifying your theme's template files directly isn't good coding practice, we'll show you how to achieve the same outcome with hooks.

Apart from the risk of disrupting your website, altering the template files of your theme will result in any changes being lost when you update the theme. Rather, the custom code you write should be “hooked” onto a suitable hook.

Consider hooks as little code placeholders that developers leave inside files to assist you to understand this notion. You may achieve the same functionality by “hooking” your code onto them as if it were explicitly inserted inside the template file in the same spot as the placeholder hook. The advantage of doing so is that you can FTP the entire hooked code into your child theme's functions.php file or a site-specific plugin, making it secure from theme updates.

Hooks are divided into two types: action hooks, which are used to add new features, and filter hooks, which are used to change current features. We'll need to use an action hook because our goal is to show the category description, which hasn't been shown before. With that in mind, we built the code you see below as an example.

if ( ! function_exists( 'your_function_name' ) ) {
function your_function_name() {
if ( is_category() ) {
the_archive_description( '
', '
' ); } } add_action( 'your_hook_name', 'your_function_name' ); }

Let's dissect this code.

It depicts a function called your function name() that is called from the hook your hook name using the add action() function. If there isn't another function with the same name, the function is called. The major section of the code uses the archive description() method to display the archive description.

We enclosed the code in an is category() conditional statement since we only want to show the description on category pages. The description will only appear on the category archive page, in other words. To utilize this code effectively, you must replace your function name and your hook name sections with the appropriate values.

While coming up with a name for the function isn't difficult (you can call it whatever you want), choosing the right hook to utilize can be difficult. You'll need to either look through your theme's files for the best hook or speak with the authors of your theme about it.

The function name for this article is display description on category archive pages, and the action hook is elementor_action_before_page_content_holder action before page content holder. The code that we used, in the end, is provided below.

if ( ! function_exists( 'display_description_on_category_archive_pages' ) ) {
function display_description_on_category_archive_pages() {
if ( is_category() ) {
the_archive_description( '
', '
' ); } } add_action( 'elementor_action_before_page_content_holder', 'display_description_on_category_archive_pages' ); }

This code, however, cannot be copied and pasted to other themes because it contains a hook particular to the theme. You must replace the example function name with your own and a hook specific to the theme you're using. After you've finished writing the code, place it in your child theme's functions.php file or a site-specific plugin.

The category description will appear on the category archive pages once you've entered the code into the relevant location. This description frequently necessitates additional CSS code to style it to match the theme.

CSS code like that, on the other hand, is created on a case-by-case basis. As a result, you'll need to write your own CSS code that fits your theme's design and the rest of your website. You can use a CSS selector to help you style the description.

The underwp-category-description class, which was included in the wrapper div HTML element, is the one we added to the code so we can utilize it for stylization now.

For example, we used the following CSS code:

.underwp-category-description {margin: 40px 0;}

And this will create an archive page from the Elementor theme.

Making Category Description Visible Across Your Entire WordPress Site

While the ability to display the category description at any time is a significant improvement, some WordPress users may be limited if it is only visible on category archive pages. This option is for those of you who want the description to appear across your entire website, including pages and articles.

By writing the following code, we were able to enable this feature:

if ( ! function_exists( 'underwp_categories_with_descriptions_list' ) ) { function qodef_categories_with_descriptions_list( $atts ) { $default_atts = array( "cat_ids" => '' ); $params = shortcode_atts( $default_atts, $atts ); $categories = array(); if ( ! empty( $params['cat_ids'] ) ) { $categories = explode( ',', $params['cat_ids'] ); } $output = "
"; if ( ! empty( $categories ) ) { foreach ( $categories as $category_id ) { if ( ! is_wp_error( get_the_category_by_ID( $category_id ) ) ) { $output .= "

" . get_the_category_by_ID( $category_id ) . "

"; $output .= category_description( $category_id ) . "
"; } else { $output .= "
" . esc_html__( 'Not a valid ID.', 'textdomain' ) . "
"; } } } else { $output .= "
" . esc_html__( 'No category IDs were inserted.', 'textdomain' ) . "
"; } $output .= "
"; return $output; } add_shortcode( 'categories_with_descriptions', 'underwp_categories_with_descriptions_list' ); }

Let's take a closer look at this code.

It stands for categories with descriptions, a custom shortcode. The underwp categories with descriptions list() function were used to build it, and the add shortcode() function was used to register it as a shortcode.

We'll give you a general summary of what the desired effects of this shortcode are and how it should be utilized rather than going into depth about each section of the code.

Only one parameter, cat ids, is accepted by this custom shortcode, and the default value is an empty string. The cat ids option is a list of category IDs that should be inserted, separated by a comma (,). Three alternative outcomes are possible depending on the parameters you enter.

If no category IDs were entered, a notice indicating “No category IDs were entered.” appears. Otherwise, a notice indicating Not a valid ID. is displayed for every invalid entry, whether it is an invalid ID or something that isn't an ID at all.

Finally, the name and description of each valid are displayed, with the category name connecting to the category archive page.

Let's look at how to use this shortcode now that you know what it's supposed to do. As previously stated, it only accepts a list of category IDs as an argument. As a result, you'll need to know how to determine the ID of a specific post category in order to use it.

To do so, go to Post > Categories and click the Edit button next to one of your categories to see its ID.

WORDPRESS POST CATEGORY EDIT

This will bring up the edit screen for the categories. By looking at the page's URL, you'll be able to determine the category's ID. The ID is the number following the category&tag ID= section of the URL. The category ID in the example below is 16.

WORDPRESS CATEGORY ID

You can then go back to the Dashboard without changing anything on the previous panel.

We can look at how a shortcode is utilized once you've determined the IDs of all the categories you want to display with this shortcode.

To utilize a custom shortcode, you must call it from within another shortcode that adds text. These shortcodes for adding text may have different names depending on whatever page builder plugin you're using. It's the Text Editor in Elementor. It's the Text Block for WP Bakery. It's a specific Shortcode block for Gutenberg.

For this post, we are going to use the Gutenberg editor. Open up your post to edit. Search for the shortcode block by clicking on the “+” button in the editor.

CATEGORY DESCRIPTION 1

However, because our shortcode allows a parameter, we must include it in addition to the value(s) we wish to utilize as the parameter value (s).

As previously indicated, our shortcode accepts only one parameter, cat ids, which should be a list of category IDs separated only by commas (,).

This list of category IDs should be enclosed in quotes, and no comma is required if only one category ID is included.

Example:

shortcode with single category ID

[categories_with_descriptions cat_ids = “11”]

shortcode with multiple category ID's

[categories_with_descriptions cat_ids = “35,56,87”]

Example a) demonstrates how to insert a shortcode call for a single category with an ID of 11. Example b) on the other hand, demonstrates how to insert a shortcode call for various categories with IDs of 35, 56, and 87 in this case.

Keep in mind that these example IDs must be replaced with appropriate category IDs from your website. You can also add as many category IDs as you like, as long as they follow the pattern outlined in the samples.

To save your input, press the Update/publish button after inserting the relevant shortcode call into the Shortcode widget.

CATEGORY DESCRIPTION SHORTCODE

Now open the link to the post we just saved. It will display the category names and descriptions.

We haven't formatted its design so it might look a bit off. You might have to work on its CSS to set its design right.
To edit its CSS, go to Appearance > Customize > Additional CSS. Here you can insert the CSS code of your choice and test whichever design suits your theme.

For this example, let's go with this CSS code:

.category-list .list-item {
padding-bottom: 50px;
border-bottom: 2px dotted black;
}
.category-list .list-item h3 {
font-size: 14px;
}

This CSS code will get you started stylizing your category information display. To make it more WordPress friendly, you can use this code by placing in a separate CSS file and uploading it by FTP to your WordPress installation.

If you plan to do that, then you have to study more about WordPress's wp_enqueue_style() function. This function enqueues styles and scripts to WordPress.

Show Category Description Using Elementor Plugin

As you see above, this task in WordPress is time-consuming. It requires your complete attention because if you miss any line or even a comma, you might end up with a lot of errors.

To fix or hide WordPress errors or warnings, check out our other post about it here: Best Plugins For WordPress To Hide Warnings And Notices

If there was a plugin that can do all of this, wouldn't that be helpful? Yes!

Unfortunately, there are no free plugins as of now that can do these for WordPress posts. There are plugins for woo-commerce but for showing category descriptions, there are no free plugins in the WordPress repository.

Elementor Pro which is a paid plugin helps you display category descriptions in WordPress with ease. You do not have to make your hands dirty with coding by use of this plugin.

Open up the Elementor editor panel for the post. Drag and drop the Text Editor widget below the category title.

CATEGORY DESCRIPTION ELEMENTOR

Click on the dynamic link of the widget. Select the Archive Description for the dropdown.

Now save the changes with the Update button. Voila! You have now an archive description showing up on the page.

Final Words

WordPress category descriptions provide more information about a category and encourage users to view posts that they might otherwise overlook if they only had the category title to rely on. WordPress, on the other hand, does not offer a built-in option for displaying category descriptions. Instead, you'll have to display them with some coding skills.

We explored three distinct approaches to display category descriptions in this article, as well as some code examples. It's entirely up to you whether you want the descriptions to appear only on category archive pages or on any page.

We also covered crucial intermediate and advanced WordPress subjects including how to create custom shortcodes and how to use them, as well as how to use WordPress hooks. And finally, we also showed you the easiest way of all by using the Elementor Pro plugin.

We hope this post was helpful in both adding a WordPress category description and boosting your WordPress knowledge. Let us know in the comments below.

Share This Article:
Facebook
Twitter
LinkedIn
Pinterest
WhatsApp
Email
Reddit
Related Articles:
image size reduce online
Facebook
Free Image Size Reduction Trick

Without Any Plugin Did you know that a normal website gets most of its weight from the images used in it? It is true. The majority of website size is mostly because of the images used in its pages. Optimizing images without losing quality is a difficult task for average

Read More »
free wordpress hosting
Plugins
Host Your WordPress Website For Free Forever

Hosting a WordPress website can be an expensive thing if not done properly. It can go from just a few dollars to thousands of dollars a month. Finding WordPress hosting can be a difficult task. If you own a small blog or website that you do not update often then

Read More »
free high quality backlinks
Backlinks
Get Free High Quality Backlinks The Creative Way

A backlink in the SEO world is a link from a post or a page on one website to another. If a website is linking to your content, it means you got a backlink. These backlinks are also called “inbound links”. Sometimes they are also called “incoming links”. Carrying a

Read More »
wordpress database structure
WordPress
A Beginners Tutorial to WordPress Database Structure

One of the numerous reasons for WordPress’ success is its beginner-friendly approach, which needs users to have little to no technical skills. This makes learning the fundamentals of website development as simple as using the WordPress interface, plugins, and themes. WordPress, which was first released over a decade ago, has

Read More »
semrush review
Search Engine Optimization (SEO)
A Review Of SEMRush – The Best SEO Tool?

There are a lot of services that claim to be able to tell you everything about your website in order to improve its performance. Some even offer software to help you with this task. One of them is called SEMrush and has been around since 2009. It’s one of the

Read More »
Subscribe to our newsletter
Chat With Our SEO community members On discord
Discord SEO Community Chat
  • Just-iko avatar Just-iko Thank you very much for answering ☑️ ✨
  • ddev66 avatar ddev66 Put your content in the right HTML tags and Google will show it this way.

    In the picture that you show, the first content is put in a list with bold headings.
    The second content is a FAQ on that page.

    Put in the right HTML tags and Google will pick it up nicely.
  • Just-iko avatar Just-iko Hello, I'm a newbie in this field, any guidance would be appreciated :) some questions please, is there any idea on how to make our website could appears like that in Google search? The one that I marked..
  • ddev66 avatar ddev66 Semrush or Ahrefs will help you for spying competitors.

    I think Semrush has a trial period as well.
  • Aadhi avatar Aadhi Buy semrush, you can buy it at cheap rate by using Group buy method
  • SG.CK avatar SG.CK Any free tool for spy traffic and ranking ?
  • ddev66 avatar ddev66 Search on google “htaccess redirect rules”
    Put them in your website’s htaccess file if you are using Apache
  • BrunoAfonso avatar BrunoAfonso how should I go to solve this issue
  • BrunoAfonso avatar BrunoAfonso Can you explain a little bit more? My website is not wordpress, I use amazon web services
  • ddev66 avatar ddev66 You can make a 301 redirect to the correct page on your website.
    If you are using Wordpress then SEO plugins like rank math have this feature.
    If you don’t want to use SEO plugins then there are many good redirect plugins in the Wordpress repository.
    And if you are not using Wordpress then .htaccess file is your friend.
  • BrunoAfonso avatar BrunoAfonso For example, is this image, the second link "THU Main Event" goes to a different page that it's supposed to. How do I fix this.
  • BrunoAfonso avatar BrunoAfonso So I have a website and when you search for it, one of the hyperlinks that google provides goes to the wrong page, is there a specific way for me to change that?
  • ddev66 avatar ddev66 Need more explanation
  • BrunoAfonso avatar BrunoAfonso Hello people, does anyone know how to fix a hyperlink within a google search?
  • ddev66 avatar ddev66 Semrush shows you all the links that it considers as toxic in its domain overview dashboard. You can then use these website list to disavow in GSC.
  • rrakesharmaa avatar rrakesharmaa I want to remove high spam backlinks via Disavow tool. So i need these links.
  • ddev66 avatar ddev66 extract high spam score backlinks.
    This is little confusing for me to understand

    Do you want to remove high spam backlinks to your website or do you want to receive backlinks from websites that have a high spam score?
  • yaswanth avatar yaswanth Now I use the Search console live URL inspector. It shows the page source and screenshot with an error(If any).
    Result: The page is not mobile friendly in the screenshot. All the element's styles are broken.

    Now, I feel like, " What the hell is happening in rich result tester? The google bot shows everything is ok, and in the search console, this is happening."

    # Problem Digging Stage final stage - Solving the problem
    The easiest way to solve the problem is to compare the thing and find the difference.
    Is rich results tester a google bot? Yes!
    Is it owned by google? Yes!
    Is it have any link with the official search console crawler? No!

    Now, What is the difference between 2 crawlers?
    Their IPs are different. They work differently.

    Summary: Google bot (Offical bot) is not able to crawl all elements in the webpage. It is not able to read all styling files. All other bots(services that use crawl as Google Bot) can view/crawl the page.

    List of official google bot IPs: https://developers.google.com/search/apis/ipranges/googlebot.json

    Solution: Rather than digging into all files, we changed the hosting server located in the exact location.

    Thank you for reading this article. It takes a few mins to read this article, but It took hours to find the correct problem with a solution. If you find this article valuable, give it a like and if you have any questions, feel free to ask them.
  • yaswanth avatar yaswanth Solving Critical Indexing Problem (CASE STUDY)

    Last week I received a message from a friend he is requesting me to help him index a page of his website. I said, " Wait, sometime google will index automatically" Then he said he was getting problem with his homepage. So, I started digging. First, I want to find the problem. Then all other things were easy.

    # Problem Digging Stage 1 - Analyze the top layers
    Checking the basic things
    1) No Index tags
    2) Canonical tags
    3) Website page Age

    Result: Nothing Found

    # Problem Digging Stage 2 - Getting Deeper
    1) Checking status codes (If there is any redirects, 404 error, or soft 404 errors)
    2) Using an SEO browser to check the web page accessibility
    3) Trying with different user agents

    Result: Nothing Found

    # Problem Digging Stage 3 - Analyzing and
    comparing past and current stages of webpage
    1) Checking the Wayback machine for any spam content history
    2) Checking the search console for errors
    3) Other page's indexability

    Result: I got some clue. Search console shows "Page is not mobile friendly."

    # Problem Digging Stage 4 -Finding the reason for the search console error.
    When I checked the web page with SEO Browser, the page was mobile friendly, and I also tried "crawl as Googlebot." Everything looks good. Then where is the problem?

    One thing was confirmed google is not able to view the webpage clearly. And all other bots are not getting any problems.

    So, I decided to use only google properties in the further process (Because only the google bot gets stuck).
    I selected three tools to process further.
    1) Google page speed insights
    2) Google rich results tester
    3) Search console Live URL inspector

    First, I used page speed insights to check If the google bot can crawl/view the page or not(If there are any issues in crawling, then the tool returns a lighthouse error)
    Result: everything is ok

    Second I used Google rich results tester. It provides the page source and screenshot of the webpage.
    Result: everything is ok
  • achann avatar achann Backlink actually link that provided outside web, so if you use instagram and insert your web link that still counted as backlink.
  • achann avatar achann If you want to be free, why not using mailchimp for email blast. Or maybe you can use whatsender for whatsapp blast, there is nulled version I think.
  • achann avatar achann Um.. Maybe you can use whatsapp blast and give link? Or maybe you can use email marketing and give link to your web?
  • rrakesharmaa avatar rrakesharmaa How can I extract high spam score backlinks for my website? Is there any free tool that provides all high spam score sites HELP ME PLEASE 🙂
  • nkap avatar nkap <@211319858258771968> hey, would you be able to share the website that you want guest posts on? I’m in touch with a few fintech businesses and can ask them whether they’d be interested in putting a post on your site.
  • ddev66 avatar ddev66 <@211319858258771968> it sure will work. Make sure to write that it’s free to post as guests. A lot of websites do not mention this and writers usually think it’s paid opportunity only.

    Keep us updated of how well this goes for your website.
  • soutaraku avatar soutaraku Thank you so much for the detailed guide. I'll see if I can put up the Guest Post page to start with! I hope my email gets bombarded in a good way haha
  • ddev66 avatar ddev66 You should start putting up a page called Guest Posting on your other website where you put articles, etc.. and put all the requirements there which you are looking for in the guest posts. Make sure to leave your email as well for easier contacts.

    Build up some links to this page. Because most of the writers are looking to write for high metrics website that have good DA, TF, etc...

    Once you have a page setup it will help you get attention from people who are searching on Google.

    Next you can start sending the URL of this page to people whom you think might be interested to write for your service on social networks like twitter, linkedin, etc.

    Also list this page URL on websites that have posts like free guest posts list in SaaS, free guest posts list in "your niche", etc. Something like this: https://underwp.com/the-best-free-guest-posting-websites-list-in-2022-over-3000/

    These will get you enough traction to attract guest posts from various contributors over the time. Your email will be bombarded with emails following the above tips.
  • soutaraku avatar soutaraku I can translate guest post to Japanese and put it on our website to share stories from overseas. I thought it would be interesting for our readers and a good way for link building.
  • soutaraku avatar soutaraku It's not titled as contribute/guest posts page, but there's a website we put interview articles and such. We surely can put guest posts on that website.
  • ddev66 avatar ddev66 <@211319858258771968> does your website have contribute/guest posts page?
  • soutaraku avatar soutaraku Hi guys! I'm a Japanese SEO specialist/ content editor working for a fintech company, and looking for someone to put guest posts on our website (preferably about fintech or SaaS market). Are there any good place to look for people willing to guest post?

    In Japan, not many people write guest posts, so I'm kinda lost. Twitter trick is only guiding light to me, <@838326478924021760>. Thanks for sharing.
  • Deleted User avatar Deleted User trying it out right now
  • nkap avatar nkap Great idea! Will definitely try it out. Thanks mate.
  • ddev66 avatar ddev66 A good trick to get guest posts for your website. <@456226577798135808> <@755307075625549854>
  • Büşra avatar Büşra Thank you very much. I'll try 😊
  • nkap avatar nkap Yeah me too!!
  • naaz avatar naaz <@755307075625549854> Thank you for the detailed answer. Hope <@341197404302737408> finds the right solution for this.
  • nkap avatar nkap <@341197404302737408> Just these:

    You can try 3 things: (I suggest you try the 3rd option first)

    1. If there are any links in your coverage report that’s actually not from your domain/property, I’d recommend you use the Search Console’s removal tool to remove these from your property.

    2. If you’re using any page builders like elementor etc make sure you turn off search engine indexing for things like templates. You can find this in Yoast SEO settings. With this setting your templates and unnecessary pages won’t be indexed. Are you using elementor by any chance?

    3. It’s also possible that your site has been hacked. If random URLs are appearing in analytics and search console the first thing that you should do is check your .htaccess file to see if someone has put any rewrite rules.
  • ddev66 avatar ddev66 <@755307075625549854> got any views on this?
  • ddev66 avatar ddev66 did you change your permalinks sometime back in last few months?
  • naaz avatar naaz <@838326478924021760> bringing to your attention on this.
  • Büşra avatar Büşra hello guys! I need to help about SEO optimation. I'm using wordpress Yoast. I saw dummy link like as ``` https://myURL.com/cuisine/35/17498``` I haven't these in page. Btw ı'm using google search console. Why may be this? Is anyone has idea about that?
  • ankit662003 avatar ankit662003 does anyone know how to create seo silos?
  • ankit662003 avatar ankit662003 hi
  • ddev66 avatar ddev66 Just know that we are all here to help each other
  • ddev66 avatar ddev66 No worries mate.
  • Alex25 avatar Alex25 The thing is idk what to ask .
    I'm just stuck
  • ddev66 avatar ddev66 Drop your queries here

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.