How to crop this picture so you can see the products because when you enter my website you can see a giant picture and you have to scroll down to see the products.
Topic summary
Issue: The homepage hero/slideshow image in the Refresh theme is too tall, pushing products below the fold; the goal is to show products without scrolling.
Proposed fixes:
- CSS approach (desktop/tablet): In Online Store → Theme → Customize, add custom CSS to the homepage section:
@media screen and (min-width: 750px){ .slideshow { height: 45vh !important; } }
This limits the slideshow height to 45% of the viewport height (vh), making products visible sooner. Screenshots provided show the result. - No‑code setting: In Theme Customizer, open the Slideshow section and adjust the “Slide height” option to reduce the banner height. A screenshot illustrates where to change this.
Notes:
- “vh” is a CSS unit based on viewport height; 45vh equals 45% of the screen height.
- Images in the thread are illustrative but not required to apply the solutions.
Status: No confirmation from the original poster; both methods appear viable. The discussion remains open without a marked resolution.
You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Customize.
Step 2: Find the section on the homepage and add the following code to the custom css box.
@media screen and (min-width: 750px){
.slideshow {
height: 45vh !important;
}
}
After modification, you can see the product.
If you will unable to implement the same then I’m happy to do this for you, let me know.
I can implement the code changes so that this will work well for you.
Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!
Hello @ZephyrShop ,
I understand you are looking to change the size of the banner image, so that feature collection will appear without scrolling.
You can change the banner height using the theme customizer.
-
Open the Theme Customizer → Click On Slideshow https://prnt.sc/jZ-XqbgY8sjW
-
Now you can change the Slide height.
I hope the solution helps.
Please share if you have any query.
Thank you.