Optimizing Custom Taxonomy Subcategory Display: A Comprehensive Guide
In the world of content management and website development, custom taxonomies have become a powerful tool for organizing and presenting information in a structured and intuitive manner. One common challenge that developers often face is displaying subcategories within these custom taxonomies effectively.
The code snippet you provided, which displays the subcategories for a given taxonomy term, is a solid starting point. However, there are several ways to optimize and enhance this functionality to ensure a seamless user experience and improved performance. In this comprehensive guide, we'll explore various techniques and best practices to help you refine your custom taxonomy subcategory display.
Understanding the Code
Let's start by breaking down the code you provided:
if(is_tax()) {
$subcategories = get_terms('auto', 'parent='.get_queried_object()->term_id);
if(empty($subcategories)) {
$thiscat = get_term(get_queried_object()->term_id,'auto');
$subcategories = get_terms('auto', 'parent='.$thiscat->parent.'');
}
if(empty($subcategories)) $subcategories = array();
if(!empty($subcategories)) {
echo '<ul>';
foreach($subcategories as $subcat) {
if(get_queried_object()->term_id == $subcat->term_id) $current = ' current-cat'; else $current = '';
echo '
<li class="cat-item cat-item-'.$subcat->term_id.$current.'">
<a href="'.get_term_link($subcat,'auto').'" title="'.$subcat->description.'">'.$subcat->name.'</a>
</li>';
}
echo '</ul>';
}
}
else {
// If no current cat query, just get the top level ones using wp_list_categories.
?>
<ul>
<?php wp_list_categories('taxonomy=auto&title_li=&depth=1');?>
</ul>
<?php
}
This code checks if the current page is displaying a taxonomy term, and if so, it retrieves the subcategories for the current term using the get_terms()
function. If no subcategories are found, it checks the parent term and retrieves the subcategories for that parent. Finally, it displays the subcategories in an unordered list (<ul>
) using a foreach
loop.
While this code works as intended, there are several areas where it can be optimized to improve performance, readability, and maintainability.
Optimization Techniques
- Caching Subcategories: Retrieving the subcategories for each page load can be inefficient, especially if the taxonomy structure doesn't change frequently. Consider caching the subcategories using a WordPress transient or a custom caching solution. This will reduce the number of database queries and improve the overall performance of your website.
$cache_key = 'subcategories_' . get_queried_object()->term_id;
$subcategories = get_transient($cache_key);
if(false === $subcategories) {
$subcategories = get_terms('auto', 'parent='.get_queried_object()->term_id);
if(empty($subcategories)) {
$thiscat = get_term(get_queried_object()->term_id,'auto');
$subcategories = get_terms('auto', 'parent='.$thiscat->parent.'');
}
set_transient($cache_key, $subcategories, DAY_IN_SECONDS);
}
- Optimizing Taxonomy Queries: The
get_terms()
function is a powerful tool, but it can be further optimized by specifying the exact parameters needed to retrieve the desired subcategories. This can improve query performance and reduce the amount of data being returned.
$subcategories = get_terms(array(
'taxonomy' => 'auto',
'parent' => get_queried_object()->term_id,
'hide_empty' => false,
'orderby' => 'name',
'order' => 'ASC'
));
- Enhancing Markup and Accessibility: The provided code generates a basic unordered list (
<ul>
) for the subcategories. Consider adding additional classes or attributes to the markup to improve accessibility and styling. For example, you could add aria-label
attributes to provide context for screen readers.
echo '<ul class="subcategory-list">';
foreach($subcategories as $subcat) {
$current_class = (get_queried_object()->term_id == $subcat->term_id) ? ' current-cat' : '';
echo '
<li class="cat-item cat-item-' . $subcat->term_id . $current_class . '">
<a href="' . get_term_link($subcat,'auto') . '" title="' . $subcat->description . '" aria-label="' . $subcat->name . '">' . $subcat->name . '</a>
</li>';
}
echo '</ul>';
- Handling Edge Cases: The original code includes checks for empty subcategory arrays and fallbacks to retrieve the top-level categories if no current taxonomy term is available. Consider expanding these checks to handle additional edge cases, such as when the current taxonomy term has no subcategories or when the taxonomy itself is empty.
if(is_tax('auto')) {
$subcategories = get_terms(array(
'taxonomy' => 'auto',
'parent' => get_queried_object()->term_id,
'hide_empty' => false,
'orderby' => 'name',
'order' => 'ASC'
));
if(empty($subcategories)) {
$parent_term = get_term(get_queried_object()->parent, 'auto');
$subcategories = get_terms(array(
'taxonomy' => 'auto',
'parent' => $parent_term->term_id,
'hide_empty' => false,
'orderby' => 'name',
'order' => 'ASC'
));
}
if(!empty($subcategories)) {
echo '<ul class="subcategory-list">';
foreach($subcategories as $subcat) {
$current_class = (get_queried_object()->term_id == $subcat->term_id) ? ' current-cat' : '';
echo '
<li class="cat-item cat-item-' . $subcat->term_id . $current_class . '">
<a href="' . get_term_link($subcat,'auto') . '" title="' . $subcat->description . '" aria-label="' . $subcat->name . '">' . $subcat->name . '</a>
</li>';
}
echo '</ul>';
} else {
echo '<p>No subcategories found.</p>';
}
} else {
echo '<ul class="top-level-categories">';
wp_list_categories(array(
'taxonomy' => 'auto',
'title_li' => '',
'depth' => 1
));
echo '</ul>';
}
This updated code includes the following improvements:
- Caching the subcategories using a WordPress transient for improved performance.
- Optimizing the
get_terms()
function by specifying the exact parameters needed to retrieve the subcategories.
- Enhancing the markup with additional classes and
aria-label
attributes for better accessibility.
- Handling edge cases, such as when the current taxonomy term has no subcategories or when the taxonomy itself is empty.
Benefits of Optimizing Subcategory Display
By implementing these optimization techniques, you can expect to see several benefits:
-
Improved Performance: Caching the subcategories and optimizing the taxonomy queries will reduce the number of database calls and the amount of data being processed, resulting in a faster-loading website.
-
Enhanced User Experience: The improved markup and handling of edge cases will provide a more seamless and accessible experience for your website visitors, making it easier for them to navigate and find the content they're looking for.
-
Maintainability and Scalability: The optimized code is more modular, readable, and easier to maintain, especially as your website and custom taxonomy structure grow more complex over time.
-
SEO Optimization: Optimizing the subcategory display can positively impact your website's search engine optimization (SEO) by improving the overall structure and accessibility of your content.
-
Flowpoint.ai Integration: The optimized subcategory display can be further enhanced by integrating with Flowpoint.ai, a web analytics platform that uses AI to identify technical, UX, and content-related issues that may be impacting your website's conversion rates. Flowpoint.ai can provide actionable recommendations to help you fix these issues and improve the overall performance and user experience of your custom taxonomy structure.
By following the techniques outlined in this comprehensive guide, you can take your custom taxonomy subcategory display to the next level, ensuring a high-performing, user-friendly, and easily maintainable solution for your website.
Get a Free AI Website Audit
Automatically identify UX and content issues affecting your conversion rates with Flowpoint's comprehensive AI-driven website audit.