Blog Index Page CSS

I have my site (https://news.clearviewlibrary.org/) set to display my latest blog posts as my home page. When I set it up I was adding this code to each post to exclude the image at the top of the individual post.

.entry-thumb img {
min-width: auto;
}

.entry-thumb {
display: none;
}

.has-post-thumbnail .entry-featured {
border-bottom: none;
}

What I’d like to do is apply that code sitewide, but exclude the main page (https://news.clearviewlibrary.org/), so it shows the featured image from the post. Normally I would go into the posts list, and hover over the post name and grab the id, and make my css changes with that, but I’m not seeing that main page in the list. How would I go about doing this?

Thanks,
Brad

Hi Brad,

Single post page by default has this class single-post. We can use that to hide images on those post page like this:

.single-post .entry-thumb {
display: none;
}

On the other hand, homepage by default has home class. Then when you set it as blog index page it will add blog class. Look at this: https://screencast-o-matic.com/watch/cqlqfpvXin

Hope this helps

Lely,

Thank you for this explanation. I don’t think I’ve ever set up a blog site before, so this was very helpful and works perfectly.

Be well,
Brad

You’re more than welcome, glad we could help.

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.