Some of the most underutilized fields in WordPress are the category, tag, and taxonomy description fields. These fields can actually be displayed on the front-end and used to really build out your category and tag pages.
The problem is category description fields (or any taxonomy description fields) are limited to just basic html markup (i.e. a href, strong, etc) but what if you want to also include other html?
Here’s a nifty block of code that allows you to do just that. It removes the sanitize filters from any taxonomy description field (i.e. blog category, custom taxonomy).
Add the following code to your functions.php file and then add some html to your category, tag, or taxonomy description fields and then view them on your site (you’ll need to have the correct php code in your theme templates in order for it to show up).
Code to Remove HTML Filters
$filters = array( 'pre_term_description' ); foreach ( $filters as $filter ) { remove_filter( $filter, 'wp_filter_kses' ); } foreach ( array( 'term_description' ) as $filter ) { remove_filter( $filter, 'wp_kses_data' ); } |
Now the code is setup to easily pass in other items you’d like to remove the filters from. For example, if you also want to add html to your link description and user profile description fields, just add these two items to the $filters array like so:
Remove Filter From Additional Fields
$filters = array( 'pre_term_description', 'pre_link_description', 'pre_user_description' ); |
Here’s the code you’ll want to have in your theme template file (i.e. category.php) in order to display the new descriptions. Some themes may not already have this in there which means it won’t show up.
Code to Display Description on Category Page
$category_description = category_description(); if ( ! empty( $category_description ) ) echo apply_filters( 'category_archive_meta', '<div class="category-desc">' . $category_description . '</div>' ); |
To display the description for other taxonomy pages, you’ll need this code added to your taxonomy-[TAXONOMY_NAME].php template.
Code to Display Description on Custom Taxonomy Page
$term = get_term_by( 'slug', get_query_var('term'), get_query_var('taxonomy') ); echo '<h1>' . esc_html( $term->name; ) . '</h1>'; echo '<p class="desc">' . esc_html( $term->description; ) . '</p>'; |
That’s it. Now you can build out your boring category, tag, and custom taxonomy pages with rich html descriptions.
Here’s the final result. The image path was incorrect which is why the image isn’t showing up correctly.
Like this tutorial? Subscribe and get the latest tutorials delivered straight to your inbox or feed reader.