Shopify themes, liquid, logos, and UX
I just asked this question in the forum and realised I have another area on my homepage that has a major white gap!
Between image slideshow and newsletter sign up! Am I doing something that is creating these gaps?
Can I remove this gap here :)?
Thank you!
Please share your store URL also the preview code if password protected.
Add this code at the bottom of your theme.css file.
.newsletter-section {
padding-top: 0px !important;
}
Each section has some top and bottom padding (Gaps), we can reduce it if you want. You have added some css code incorrectly in the theme.css file which is creating some gaps for the header, under the footer, and other elements. Do let me know if the following code reduces the gap for the newsletter section.
That made a difference! THANK YOU!!
Could you please give me a code for another gap I have please?
I got an even bigger gap between 'gallery' and a review carousel that I have added to my homepage!
These gaps are happening because of these line of code.
What was the purpose of adding those? as this (class) is linked with other code too.
.grid__item {
position: relative;
min-height: 450px;
}
.grid__item form {
position: absolute;
bottom: 0px;
margin-bottom: 15px;
}
@media only screen and (max-width: 769px) {
.grid__item {
min-height: 350px;
}
}
You can see this it's also effecting product page styling.
Something has gone wrong somewhere! Oh no!
Sorry which product page is that? When I click my SHOP button my products seem to show up fine!?
@climaxcosmetics, The product with images seems fine.
It might be! Is this how they usually look on Shopify??
The 'add to cart' button is touching the images below and
Wait let me send you the code.
Thank you!!
Removing this code helped all those big gaps! Yay!
But I had added that because my product layout is all wonky. If you click 'ggbeautyshop' you will see the add to cart button, the photos, alignment is off. That code had fixed that.
Not sure how to align everything correctly without that code...
It is showing that way because you haven't added the product image yet. Add the product image and test.
Good Luck.
Add an image for testing, you will see the difference.
In the 'ggbeautyshop' tab I have all images uploaded for my products. That's where I noticed the images, add to cart button and alignment is all off!
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024