Shopify themes, liquid, logos, and UX
Hey! How do I decrease the padding around the featured logos bar on the homepage?
Store link: https://z05bmdkpap5a4vd7-12859847.shopifypreview.com
Thanks in advance.
You could try adding this code to the bottom of theme.min.css
.homepage-sections-wrapper.homepage-sections-wrapper--dark {
padding-top:0;
padding-bottom:0;
}
Thanks it worked when I added !important
.homepage-sections-wrapper.homepage-sections-wrapper--dark {
padding-top:0 !important;
padding-bottom:0 !important;
}
The code above actually also changed this "Join Mailing List" section. Which code can specify the logo banner only?
@pjk3635,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:
<style>
[id] [class*='logo-bar-section']{
margin-top: -20px;
margin-bottom: -20px;
}
</style>
It is important to notice that you shouldn't be trimming that with code though, the extra padding comes from the images themselves, there is a lot of white space around them:
This article teaches you how to eliminate that white spacing from images, perhaps it could be beneficial in your situation.
Kind regards,
Diego
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025