Venture Theme Blog "Featured Image" Size

[UpperMountain]

2nd thread of the day, thanks @JHKCreate for your help on the last one, huge help.

Ok, so I'm almost "there" with my blog setup.

I have 2 more coding issues I don't know how to solve myself:

1) When you go to my blog page (https://uppermountainllc.com/blogs/news-products-stories), the blog images are enormous.  I'd like them to still be there, but just a lot smaller visually.  Is there a way to reduce the image size of the "Featured Image" on this page?

The "Featured Image" literally takes up the entire page:

2) Once you click on the actual Blog Post ("read more"), I don't feel you need the "Featured Image" any longer.  Is there a way I just eliminated it altogether on the actual Blog Post (https://uppermountainllc.com/blogs/news-products-stories/paracord-pulleys) once someone clicks through? Thank you.

 

 

[JHKCreate · Accepted solution]

Hi @UpperMountain 

Happy to help!

For issue #1 add the following code to your theme.scss.css file at the end:

@media only screen and (min-width: 750px)
{
.article__photo-container {
    position: relative;
    width: 50%;
}
}

#shopify-section-article-content > div.content-block > div.content-block__full-image.content-block__full-image--large.small--one-whole.medium-up--one-whole > div.content-block__full-image.content-block__full-image--large > div {
    display: none;
}

Let me know!

[JHKCreate · Accepted solution]

Hi @UpperMountain 

Happy to help!

For issue #1 add the following code to your theme.scss.css file at the end:

@media only screen and (min-width: 750px)
{
.article__photo-container {
    position: relative;
    width: 50%;
}
}

#shopify-section-article-content > div.content-block > div.content-block__full-image.content-block__full-image--large.small--one-whole.medium-up--one-whole > div.content-block__full-image.content-block__full-image--large > div {
    display: none;
}

Let me know!

[UpperMountain]

 @JHKCreate thanks again, for issue #1, perfect size.  Is there a way to center the image over the blog text here?

https://uppermountainllc.com/blogs/news-products-stories

..and, it looks like you've also solved issue #2 in the code!  NICE, thank you.

[JHKCreate · Accepted solution]

Perfect @UpperMountain 

Add this code for the centering:

.article__photo-container {
    margin: auto;
}

That should do it!

[UpperMountain]

@JHKCreate, worked like a charm, thank you!

[Flash_king24]

Hey, do I put that entire listing of code? 

[elgs]

How do I change the height of the image?