Changing footer - debut theme

Solved
Tourist
49 0 2

Hi,

 

I am using the Debut theme and I want to change the footer so instead of columns I can list the menu items across the page (like the header menu).  At the moment listing them downwards is making the footer huge, especially in mobile view.

 

The site is www.ellennyswim.com.

 

Thanks!

0 Likes

Success.

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

@media only screen and (max-width: 749px){
.site-footer__linklist-item {
    padding: 5px 0 !important ;
}
.site-footer__item {
    margin-bottom: 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
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Tourist
49 0 2

Hi,

 

Thanks for your reply.  That didn't work unfortunately.

0 Likes

This will work for mobile view.
As i can see after adding this css it will look like this in mobile view:

126.jpg

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
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Tourist
49 0 2

Ah I see.  That's definitely better thank you.  Is there a way to do the same on desktop view to remove all the extra space?  Thank you for your help!current footer.JPG

 

 

 

0 Likes

Which space you want to remove on desktop can you share screenshot?

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
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Tourist
49 0 2

Hi again, 

 

I've attached a screenshot - bit rough, but basically the top and bottom bits marked here with black squares.current footer.JPG

0 Likes

Success.

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

@media only screen and (min-device-width: 480px){
.site-footer {
    padding: 0px 55px 0 !important;
}
.site-footer__content {
    height: 160px!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
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Tourist
49 0 2

Oh that's fantastic!  Thank you so much.

 

May I ask another question?  Do you know how to make the social icons in the footer white?

0 Likes

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

a.social-icons__link {
    color: white;
}
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
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes