Need help making my front page image slideshow smaller in the Venue Theme

[jmurray907]

Hello! The image slideshow on my front page is too large. How do I reduce the image size? Using the Venue theme.

[AnneLuo · Accepted solution]

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the </head> tag

<style>
 @media screen and (min-width: 1024px) {
   .slick-slide img {
      height: 500px;
   }
 }
</style>

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

[AnneLuo]

Hi, @jmurray907 

Please share the store URL so that I can assist you.

[jmurray907]

H @AnneLuo  www.phoenixequineproducts.com

Thank you!

[AnneLuo · Accepted solution]

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the </head> tag

<style>
 @media screen and (min-width: 1024px) {
   .slick-slide img {
      height: 500px;
   }
 }
</style>

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

[jmurray907]

It worked for the front page, but now the photo on other pages is reduced.

https://phoenixequineproducts.com/products/phoenix-equine-100-merino-wool-saddle-pad-in-lilac

And on this page there's a line of code showing at the bottom

https://phoenixequineproducts.com/collections/custom-leatherwork-saddle-pads

[AnneLuo · Accepted solution]

Modify the code I provided above

<style>
 @media screen and (min-width: 1024px) {
   .home-carousel .slick-slide .home-carousel__item img {
      height: 500px;
   }
 }
</style>

And for: On this page there's a line of code showing at the bottom

You need to put the code inside the <style></style> tag

If you will unable to fix the issue then I'm happy to do this for you, let me know.