How to Create a Thumbnail Gallery of Posts/Topics

For those of you that aren’t bloggers, this might not be a post that will interest you. But if you are, I wanted to share a neat little discovery with my recent blog re-design.

New Category Gallery with text

With my old design, a couple of my main menus led to pages with multiple categories and lists of posts. The way I was generating the thumbnails for each post within a certain category was through InLinkz. I loved that you were able to create titles and choose images for each of your thumbnails and decide which order they appeared.

Old Category Thumbnails

However, the downside was that I had to manually add and link up a post if I wanted it to appear. It was hard to remember to do this on a regular basis which meant my topics and categories went un-updated for several weeks or months at a time.

Not a huge deal, but it was just extra work.

With my new design, I knew I wanted to make it easier for you all to find posts and wanted to feature a list of thumbnails for even more categories of posts. The thought of having to go through and manually add so many more posts just didn’t seem appealing though.

I wanted to find something that was more seamless, that would automatically populate and update without me having to do too much.

Enter, Category Thumbnail List plugin. The easiest way ever to create a thumbnail gallery of posts/topics.

This plugin is awesome. It took me no time at all to generate 22 {you read that right, 22} pages of thumbnails for each category of posts I wanted to feature. You can imagine how long that would have taken me had I had to link them all up manually.

Once you have the plugin installed, the first thing you’ll do is insert the below code on your page in the text tab, replacing the number with your individual category number.

Thumbnail Code

You can find your category number by clicking on ‘Categories’ under ‘Posts’ and hovering over the category. You’ll see some text appear at the bottom of your screen along with a number. That’s the number you’ll put in place of the ’14’ you see above.

Category ID Number

And that’s really it. All the posts related to that particular category will appear on the page. You might have to tweak and edit your categories depending on what types of posts you want displayed on each page.

You are able to tweak how the thumbnails appear if you see things you wish to edit. To change the order of how they appear you can click on ‘Category Thumbnail List’ under the ‘Settings’ tab.

plugin settings

Here’s where you can decide how you want your thumbnails to appear and be ordered. Whether by date or title and whether you want them descending or ascending.

If you click on the link at the bottom where it says ‘update the thumbnail sizes here’ you can adjust how big or how small you want the thumbnails to be.

Update CSS stylings

You might also have to add a little to spacing depending on how big you set your thumbnail sizes and how long your titles are. For example, when mine first loaded, a few of my titles were being covered up by the image below.

increasing spacing

If you click on ‘You may need to update your CSS when changing the thumbnail size’ under the plugin settings, it will take you to the css code where you can customize appearance.

Now I know ‘css’ sounds intimidating, but I promise it’s not. You can edit one thing at a time and refresh your screen to see what changed and can always edit and change it back to the original settings.

When I changed the first margin number to 20 and the last to 20, that increased the spacing between each thumbnail.

Customizing CSS

And prevented the post titles from getting covered up.

correct formatting

This will change the formatting for all your thumbnails and isn’t page specific.

But, now you have pretty post thumbnail images all perfectly categorized and you never have to manually do anything ever again.

New Category Gallery

Each time you write a post and tag it with one of the categories, it will automatically appear in your thumbnail gallery.

Easy peasy!

Post Signature

You May Also Like:

Opt In Image
Subscribe for everyday inspiration

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *