Hi.
You can make use of the nth-child CSS selector to apply styles to certain posts in your loop, such as:
#main article:nth-child(4), #main article:nth-child(8) { font-weight: 700; }
The above code applies a heavy font-weight to the 4th & 8th post of the homepage loop using TwentySixteen theme.
If you can provide me with a link to your website I’ll take a closer look and write you the correct code for the theme you’re currently using.
Thanks for your reply but I am using my own theme. http://behindgraphics.com/ Can you do something on it. I have posted only 6 posts in this one. So you can use 4th and 6th post for different class.
Just a slight change to the above code, use this:
#main .post:nth-child(4), #main .post:nth-child(6) { font-weight: 700; }
Just add your own styles to these classes, you can also adjust (4) and (6) to choose different posts.
seems you are usgin post_class() in the loop of your theme.
therefore, review https://codex.wordpress.org/Function_Reference/post_class#Add_Classes_By_Filters
and try for example (added into functions.php of your theme):
add_filter( 'post_class', 'extra_post_class' );
function extra_post_class( $classes ) {
global $wp_query;
if( $wp_query->current_post == 3 ) $classes[] = 'post-number-4';
if( $wp_query->current_post == 5 ) $classes[] = 'post-number-6';
if( $wp_query->current_post == 7 ) $classes[] = 'post-number-8';
return $classes;
}
this will be applied to all loops in index pages, and archive pages, etc…
Lots of thanks to ThemeSumo and Michael. I will use your suggestions and let you know the result. Thanks again.
#main .post:nth-child(4n+4)
Will select every 4th post, to infinity.
Ok Jacob thanks a lot. But currently I am facing some other problem. I have post in the thread here https://wordpress.org/support/topic/posts-not-publishing-6?replies=3
My posts are not being published. I have googled it out and it some kind of cached problem. Hopefully someone would know about it.
