Debut theme footer line spacing for mobile and desktop.

Solved
Highlighted
Excursionist
13 0 3

Hi guys, 

I would like to reduce the space between the newsletter subscribe button and that border line on mobile.

Mobile line spacing.png

& I would also like to reduce the spacing from the heading and the paragraphs on the desktop browser as well as the spacing between the newsletter subscribe button. Could anyone please assist me with the code needed to input on my CSS.

Desktop line spacing.png

The red arrows are the spaces I would like to make more smaller/narrow.

Kind Regards,

TheEcomGuy

0 Likes
Highlighted

Hello,
Please share your site url.
So that i can check and let you know the exact solution here.

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Excursionist
13 0 3

Hi,

URL: https://zendlashop.com/

Thanks for your help!

0 Likes
Highlighted

This is an accepted solution.

Hello TheEcomGuy,
1)To reduce the space between the newsletter subscribe button and that border line on mobile.
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

@media only screen and(max-width:768px){
hr.site-footer__hr {
    margin-top: 10px!important;
}
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
1 Like
Highlighted

Hello TheEcomGuy,
2)To reduce the spacing from the heading and the paragraphs on the desktop browser as
well as the spacing between the newsletter subscribe button.
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

@media only screen and (min-width: 750px)
.site-footer h4, .site-footer .h4 {
    margin-bottom: 10px!important;
}
footer.site-footer {
    margin-top: 30px!important;
}
hr.site-footer__hr {
    margin-top: 0px!important;
}
}

 

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Excursionist
13 0 3

Hi,

It's not working for me I am getting an error when inputting the code. 

Error Code.png

Heres the code for reference:

Code Zen.png

 

Thanks for your help!

0 Likes
Highlighted

This is an accepted solution.

Please replace above code with

@media only screen and (min-width: 750px){
.site-footer h4, .site-footer .h4 {
    margin-bottom: 10px!important;
}
footer.site-footer {
    margin-top: 30px!important;
}
hr.site-footer__hr {
    margin-top: 0px!important;
}
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
1 Like
Highlighted

Hello @TheEcomGuy 

In previous code '{' is missing please replace above code in your theme.scss.liquid file.

 

 

Hope this will work for you

Thanks....

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
1 Like
Highlighted
Excursionist
13 0 3

Thank you so much for your help, outstanding!

0 Likes
Highlighted
Tourist
19 0 1

Hi Pallavi, Im also having trouble, are you able to help?

I want to reduce the line spacing in my footer menu on mobile view
https://house-of-matilda.myshopify.com/

Thanks in advance!!!

Screen Shot 2020-08-28 at 1.15.54 pm.png

0 Likes