To continue receiving payouts, you need to secure your account by turning on two-step authentication. If two-step authentication is not turned on your payouts will be paused. Learn more

Debut theme : how to reduce padding between homepage sections and section in product page?

Solved
nair
Tourist
4 0 2

Hi developers,

Hope you are doing good.

I need to reduce padding space between sections in the homepage and some sections in the product page. Can't seem to figure it out on my own.

This is my first shop on Shopify and trying to make it look better.

Thank you in advance.

Capture.PNGCapture2.PNGCapture3.PNGCapture4.PNG

Accepted Solutions (2)

Accepted Solutions
Vikas_Chovatiya
Shopify Partner
449 91 130

This is an accepted solution.

Hi @nair 

1. Go to Online Store->Themes->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.index-section {
    padding-top: 30px;
    padding-bottom: 30px;
}
hr {
    margin: 30px 0;
}
.site-footer__hr {
    margin: 0px 0 20px 0;
}
If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)

View solution in original post

Vikas_Chovatiya
Shopify Partner
449 91 130

This is an accepted solution.

Hi @nair 

1. Go to Online Store->Themes->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.newsletter-section .section-header {
    margin-bottom: 20px;
}
.newsletter-section {
    padding-top: 30px;
}
.newsletter-section .form-single-field {
    margin: 0 auto 30px;
}
.site-footer {
    padding: 20px 0;
}
If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)

View solution in original post

Replies 12 (12)
Vikas_Chovatiya
Shopify Partner
449 91 130

Hi @nair 

Thanks Welcome to the Shopify community!
Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
Vikas_Chovatiya
Shopify Partner
449 91 130

This is an accepted solution.

Hi @nair 

1. Go to Online Store->Themes->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.index-section {
    padding-top: 30px;
    padding-bottom: 30px;
}
hr {
    margin: 30px 0;
}
.site-footer__hr {
    margin: 0px 0 20px 0;
}
If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
nair
Tourist
4 0 2

Hey Vikas! 

My page looks much cleaner and better. Being a social media marketer this was a bit out of my expertise!

Came to right place and got the right help! Thank you!

🙂

nair
Tourist
4 0 2

Hey @Vikas_Chovatiya,

Hope you are doing good.

Just need your help again with the website. Could you please help me with the spacing issue in the newsletter section ōf my website? Want it to be a little more closer and cleaner than the image below.

Do let me know how I could get it enhanced.

nair_1-1598628564059.png

Thanking you in advance!

 

Vikas_Chovatiya
Shopify Partner
449 91 130

This is an accepted solution.

Hi @nair 

1. Go to Online Store->Themes->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.newsletter-section .section-header {
    margin-bottom: 20px;
}
.newsletter-section {
    padding-top: 30px;
}
.newsletter-section .form-single-field {
    margin: 0 auto 30px;
}
.site-footer {
    padding: 20px 0;
}
If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
nair
Tourist
4 0 2

@Vikas_Chovatiya , it worked again!

Looks better and cleaner too 🙂

Thank you for helping out again!

Emelby
Excursionist
16 0 5

Hi there Nair

I tried this on my Debut theme website as way too much spacing between my sections - but didn't work, can you help?

Emelby
Excursionist
16 0 5

sorry I tried again it did work, sorry about that!

Emelby
Excursionist
16 0 5

sorry it did work, but spacing still very wide on mobile site, can you help with that?

Vikas_Chovatiya
Shopify Partner
449 91 130

Hi @Emelby 

Please share Your Site URL

If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
nicolasfloriano
New Member
2 0 0

Hi and good day

I need to reduce padding between two media on Shopify, but if I try with the code that you post one media stay on top of the principal banner. if you can help me, I would be very grateful (sorry if my english is wrong, I don't speak very well), I will put two images to show how it looks

1.png2.png

 

 

tattoosh
Tourist
27 0 2

This doesnt work for me...every time I copy and paste a code from the shopify community it doesnt do anything and then it shows that code at the bottom of the website. Help 😞 ! What am I doing wrong?