Add Snippet To Project
Are you looking for a way to display thumbnails in a list from a specific category on your WordPress site? With the right techniques, you can easily achieve this. In this article, we will guide you through the process of displaying thumbnails in a list format from a specific category using WordPress. Whether you’re a beginner or an experienced user, this article will provide you with the necessary steps to accomplish this task. So let’s dive in and learn how to showcase your category-specific thumbnails in a neat and organized list.
function wpturbo_display_category_thumbnails() {
$category_id = 1; // Replace 1 with the ID of the specific category
$args = array(
'post_type' => 'post',
'posts_per_page' => 10,
'category__in' => $category_id,
'meta_key' => '_thumbnail_id'
);
$query = new WP_Query( $args );
if ( $query->have_posts() ) {
echo '<ul>';
while ( $query->have_posts() ) {
$query->the_post();
echo '<li>';
if ( has_post_thumbnail() ) {
echo '<a href="' . get_permalink() . '">';
the_post_thumbnail( 'thumbnail' );
echo '</a>';
}
echo '</li>';
}
echo '</ul>';
wp_reset_postdata();
}
}
add_shortcode( 'wpturbo_category_thumbnails', 'wpturbo_display_category_thumbnails' );
The code snippet provided allows you to display thumbnails from a specific category in a list format. Let’s break down the code to understand how it works.
First, we define a new function called wpturbo_display_category_thumbnails(). This function will handle retrieving and displaying the thumbnails.
Inside the function, we set the $category_id variable to the ID of the specific category we want to display thumbnails from. You’ll need to replace 1 with the actual ID of the category you want to use.
Next, we define the $args array which includes various parameters for the WP_Query object.
post_typeis set to'post', indicating that we want to query for posts.posts_per_pageis set to10, which limits the number of posts we want to display.category__inis set to$category_id, which filters the posts based on the specific category ID.meta_keyis set to'_thumbnail_id', which ensures that only posts with a featured image (thumbnail) are included in the query.
After setting up the query, we create a new instance of the WP_Query class by passing in the $args array.
Next, we check if there are any posts returned by the query using the have_posts() method of the WP_Query object. If there are, we start generating the HTML markup for the list of thumbnails.
We begin by echoing an opening <ul> tag to indicate the start of an unordered list.
Inside the while loop, we call the the_post() method to set up the current post and move the pointer forward. Then, we echo a <li> tag to mark the start of a list item.
Within the list item, we use the has_post_thumbnail() function to check if the current post has a featured image. If it does, we echo an opening <a> tag and set the href attribute to the permalink of the post using the get_permalink() function.
Inside the <a> tag, we call the the_post_thumbnail() function and pass in 'thumbnail' as the size parameter. This will output the featured image with a thumbnail size. You can replace 'thumbnail' with other available image sizes based on your theme.
Finally, we close the <a> tag and the <li> tag.
After the while loop ends, we echo a closing </ul> tag to mark the end of the list.
Lastly, we call wp_reset_postdata() to reset the post data after the custom query.
To make this functionality easily usable in your WordPress site, we register a shortcode by adding the add_shortcode() function. We set the shortcode name to 'wpturbo_category_thumbnails' and assign it to the wpturbo_display_category_thumbnails() function we defined earlier.
Now, you can use the [wpturbo_category_thumbnails] shortcode anywhere in your WordPress site to display the list of thumbnails from the specified category.