How to change size of featured blog post image so it's not huge on blog post page?

streetskitchen

The image on the blog page is far too large, and fills the page meaning people have to scroll down to read the article - shown in attached screenshots, how do I change this to show a smaller image? 

akhilesh

Hello 

Thanks for asking query to again . 

Right now  the  width of the image is in full width . That's why its showing you huge . 

To change  width of the image    as your need add the below css code inside the  Appearance >> customizer >> additional css box . 

@media (min-width: 768px) { 

.site-content .post .post-thumbnail img {

    width: 45%;

}

}

Change width value as  your need . 

Let me know for further assistance . 

Thanks 

streetskitchen

Thanks, this works for individual blog pages but now the image is too small on the Blog Masonry 3 page - https://www.streetskitchen.org/street-news - see image. 

How to keep full width image on blogs when shown as 3 columns, but not full width on individual blog page??

akhilesh

Hi 

For this add the below css code instead of previous css code . 

@media (min-width: 768px) { 

.single-post  .site-content .post .post-thumbnail img {

    width: 45%;

}

}

Let me know for further assistance 

Thanks  

streetskitchen

Thanks, this works EXCEPT on this page - https://www.streetskitchen.org/category/blog lol

akhilesh

Hello 

For this also  add the  below css code inside the  Additional  css box .

 @media (min-width: 768px) { 

.category  .site-content .post .post-thumbnail img {

    width: 45%;

}

}

Let me know for further assistance . 

Thanks 

akhilesh

Hello 

Did the above solution work for you ?

Thanks 

streetskitchen

Perfect akhilesh! Thanks!