A user seeks to reduce excessive white space on their homepage between the slideshow and first collection section in the Warehouse theme.
Solutions Provided:
Two experts offered CSS-based fixes:
PageFly-Noah: Add custom CSS to theme.liquid above </head> targeting the featured collection section with margin: 5px 0 !important. The margin value can be adjusted to control spacing.
David_SHT: Similar approach, adding code to the bottom of theme.liquid above the </body> tag.
Both solutions involve editing theme files through Online Store > Themes > Edit code.
Outcome:
The user confirmed the solution works perfectly on both desktop and mobile. Issue resolved.
Good evening, all. I’d like to know what code adjustments I can make to reduce the white space shown in the photo below on my homepage, which can be found under the slideshow and above the first collection. I’d like this to apply on both mobile and desktop. Thanks in advance for the assistance!
Store: www.mochilo.co
Hi @MOCHILOCO
This is Noah from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the
<style>
[data-section-id="template--16870456656096__featured-collection"] {
margin: 5px 0!important
}
</style>
You can increase the value 5 to make it more spacing
Hope this can help you solve the issue
Best regards,
Noah | PageFly
Hi @MOCHILOCO ,
This is David at SalesHunterThemes.
You can try to follow these steps:
Go to Online Store → Themes → Actions → Edit code.
Go Assets folder → theme.liquid file.
Add the following code in the bottom of the file above tag
If I managed to help you then, don’t forget to Like it and Mark it as Solution!
David | SalesHunterThemes team
Fantastic. Works perfectly. Kudos!
Glad that i can help. Let me know if you need further help.
