Solved

Changing the padding of sections in Debut theme.

jnb246
Tourist
7 0 2

I would like to change the vertical padding of the sections. However I want to be able to change them individually. I require different spacing for the individual sections. Please help me out:) Thanks!

Accepted Solution (1)
KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

@jnb246 

please add this code

div#shopify-section-1595510426391 {
    padding: 0;
}
div#shopify-section-1595516901005 {
    padding-top: 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 bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 23 (23)

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @jnb246 

Welcome to the Shopify community!
and Thanks for your Good question.

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 bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
jnb246
Tourist
7 0 2

Hello Ketankumar,

Thank you!

https://wasteless-world.myshopify.com

KetanKumar
Shopify Partner
36839 3635 11972

@jnb246 

Thanks for URL

let me know which section do you need to reduce spacing?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
jnb246
Tourist
7 0 2

I would like to have a smaller space between the rich text section and the slideshow.

KetanKumar
Shopify Partner
36839 3635 11972

@jnb246 

Thanks for clear

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

.index-section {
    padding-top: 35px;
    padding-bottom: 35px;
}
div#shopify-section-image-bar {
    padding-bottom: 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 bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
jnb246
Tourist
7 0 2

Thank you but it does not solve my problem:

Screenshot 2020-07-28 at 13.42.31.png

I would like for the text to be closer to the slider.

KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

@jnb246 

please add this code

div#shopify-section-1595510426391 {
    padding: 0;
}
div#shopify-section-1595516901005 {
    padding-top: 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 bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
jnb246
Tourist
7 0 2

Thank you it works perfectly!

I have another question should I post a new thread or can I ask you here?

Thanks again!

KetanKumar
Shopify Partner
36839 3635 11972

@jnb246 

Thanks for your support and your compliment.

yes, please as you like a new post or 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 bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
jnb246
Tourist
7 0 2

Thank you.

My question is regarding the text at the top of the homepage. When the site is viewed on a mobile phone the "shadow" behind the whit text is gone. With a white background I cannot read it anymore, so I would like to have the shadow on the mobile phone as wel.

 

This is on a computer screen:Screenshot 2020-07-28 at 18.57.23.png

 

 

This is on a mobile phone screen: Screenshot 2020-07-28 at 18.59.35.png

 

KetanKumar
Shopify Partner
36839 3635 11972

Yes, add code this code also.

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

.mega-title, .mega-subtitle {
    text-shadow: 0 0 4px rgba(0,0,0,0.4);
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
jnb246
Tourist
7 0 2

Perfect!

Thank you very much for your help!

KetanKumar
Shopify Partner
36839 3635 11972

@jnb246 

Thanks for your compliment.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
drearom
Tourist
8 0 1

Hi I changed hamburger icon to word MENU on my Debut theme but the MENU word is cropped on mobile view.

Refer below:

drearom_0-1603182587069.png

 

Please let me know how to adjust header paddings to show the word MENU correctly.

Thank you so much.

Website: steriwand.ph

 

KetanKumar
Shopify Partner
36839 3635 11972

@drearom 

Thanks for post 

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

@media only screen and (max-width: 749px) {
.site-header__icons .btn--link, .site-header__icons .site-header__cart {
    font-size: 13px;
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
bestinthegame
Tourist
9 0 5

Hi Guys

Please can you help - at some point i removed the padding above the Kit Inspired logo, but now the home page looks strange and is too tight to the top. how can i put a little more space above the logo but also less space under it! 

 

Appreciate your help.


Wayne

Padding.png

KetanKumar
Shopify Partner
36839 3635 11972

@bestinthegame 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you 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 bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
bestinthegame
Tourist
9 0 5
KetanKumar
Shopify Partner
36839 3635 11972

@bestinthegame 

sorry for that issue i have ck now but i can't see

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
bestinthegame
Tourist
9 0 5

https://www.bestinthegame.co.uk/collections/kitinspired

 

Maybe its more obvious here because Kit Inspired. logo is visible?

KetanKumar
Shopify Partner
36839 3635 11972

@bestinthegame 

thanks for detail please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
this code apply for after 5 - 6 second

.collection-header .section-header.text-center {
    margin: 20px 0px 15px;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
bestinthegame
Tourist
9 0 5

Thank you so much - is it possible to do this for the home page and product pages the images are butted right up to the top line with no padding. 

KetanKumar
Shopify Partner
36839 3635 11972

@bestinthegame 

yes please add this code 

ul.a-unordered-list.a-vertical.a-spacing-mini {
    margin-left: 15px;
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing