How to highlight the current post in the current category post list in Elementor

Опубликовано: 23 Февраль 2025
на канале: CSS Express
280
3

This tutorial will teach you how to filter the posts in the list using the current post category. That way your post list will display ONLY the posts of the same category as the one that you are currently viewing.

Then, we will include the current post in that list. That's something that is missing in the 'Related Posts' widget in Elementor!

And lastly, we will highlight that current post in the list using a custom CSS class.

No paid plugins, just PHP and CSS!

First, use a 'Posts' widget on your Single Post template if you are using Elementor Pro.

Then assing a custom CSS class to it and a custom Query ID.

We will then add a bit of custom PHP code to our Code Snippets plugin. Don't worry, you can just copy and paste this code!

And in the end, we can go to our custom CSS and style the assigned CSS class to our current post in the list in order to highlight it.

No PHP knowledge is required! We are using a free Code Snippet plugin to add the PHP code.

https://wordpress.org/plugins/code-sn...

💻 Grab the PHP code here:
https://www.cssgamelab.com/2024/11/28...

🚀 Interactive CSS Basics course for designers and non-coders:
https://www.cssgamelab.com/

👉 Get 20% off using the code VELVET20OFF at Checkout.

––––––––––––––––––––––––––––––

PURCHASE AND DOWNLOAD ELEMENTOR PRO:

https://be.elementor.com/visit/?bta=6...

––––––––––––––––––––––––––––––

SIMPLE CUSTOM CSS AND JS PLUGIN:

To use custom CSS code with Elementor FREE, I am using the Simple Custom CSS and JS plugin for Wordpress that you can download here:

https://wordpress.org/plugins/custom-...

Have fun and thanks for watching!

If this tutorial helped you, please share or subscribe.

––––––––––––––––––––––––––––––

This video and description may contain affiliate links. If you click on a link and make a purchase, I will receive a commission from the sale. That way you are supporting my channel and allowing me to keep making videos and posts like this. I only promote products that I use, have experience with and support, such as Elementor Pro.

––––––––––––––––––––––––––––––

Have a specific problem in Elementor that you don't know how to solve with CSS? Comment below to let me know which video you would like to see next!