Shopify themes, liquid, logos, and UX
Hi all!
I've been playing around with the code and managed to get some things changed but also managed to mess up some of the borders/margins so there are some weird gaps!
Can anyone tell me how to reduce these margins again?
My website is : www.roxiesweetheart.co.uk
I've attached screenshots of the areas I need changing (marked with red) within a doc. file (not sure why I can't upload images)
Thank you 🙂
Solved! Go to the solution
This is an accepted solution.
yes please try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.template-index .main-content {margin-top: 0;}
.shopify-section--slideshow:not(:first-child)+.shopify-section--slideshow .hero--adapt, .shopify-section--slideshow:not(:first-child)+.shopify-section:not(.shopify-section--full-width) {
margin-top: 10px;
}
.index-section {margin-bottom: 10px;}
This is an accepted solution.
yes please try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.collection-card {height: 335px;}
.product-card__image-container {margin-bottom: 100px;}
This is an accepted solution.
i have check again its work as well just product name long issue
This is an accepted solution.
yes please try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.template-index .main-content {margin-top: 0;}
.shopify-section--slideshow:not(:first-child)+.shopify-section--slideshow .hero--adapt, .shopify-section--slideshow:not(:first-child)+.shopify-section:not(.shopify-section--full-width) {
margin-top: 10px;
}
.index-section {margin-bottom: 10px;}
Thank you!
That worked for the gaps at the top and under the gallery but I also need to make the margins between the products photos and product titles in 'what's new' and 'gifts under £10' on the main page please
Thanks again 🙂
if reduce spacing see issue
It looks okay to me... what is the issue?
Thank you
product card box doesn't anglin
I can't really notice! Can you send me the code so I can try it please?
Thank you 🙂
look at this
Text and images dont completely align as it is anyway if you look at the current live website
do you need any help?
Yes I want to reduce the spacing
thank you
This is an accepted solution.
yes please try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.collection-card {height: 335px;}
.product-card__image-container {margin-bottom: 100px;}
great that worked! Can I do the same to the collection underneath too?
that's work whole site
This is an accepted solution.
i have check again its work as well just product name long issue
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024