FROM CACHE - en_header

change footer menu to vertical

Solved
dimitri9
Tourist
3 0 4

Dear all,

 

I need to change the footer menu to vertical. Any hint?

 

Thanks, Dimitri

Schermafbeelding 2020-05-07 om 04.37.53.png

 

 

Accepted Solution (1)

Accepted Solutions
KetanKumar
Shopify Partner
33393 3352 11052

This is an accepted solution.

Hello, @dimitri9 

Thanks for URL.

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

.site-footer__linklist-item {
    width: 100%;
}
.site-footer__item {
margin-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

View solution in original post

Replies 33 (33)
KetanKumar
Shopify Partner
33393 3352 11052

Hello, @dimitri9 

Thanks for post.

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
dimitri9
Tourist
3 0 4

Thanks a lot. Sure: https://lumorin.com/

KetanKumar
Shopify Partner
33393 3352 11052

This is an accepted solution.

Hello, @dimitri9 

Thanks for URL.

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

.site-footer__linklist-item {
    width: 100%;
}
.site-footer__item {
margin-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
dimitri9
Tourist
3 0 4

Ok  many thanks! 🙂 Need to edit the code.

batecolifestyle
Tourist
9 0 2

Thanks so much!! This totally worked and super quick!

KetanKumar
Shopify Partner
33393 3352 11052

@batecolifestyle 

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
Pazeña
Shopify Partner
3 0 2

Worked great for my shopify store, easy to do, thanks so much

KetanKumar
Shopify Partner
33393 3352 11052

@Pazeña 

Thanks for update.

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
Lisaskloset
Tourist
6 0 5

You're awesome!!!! This worked on my debut theme. Thank you for this!!!

KetanKumar
Shopify Partner
33393 3352 11052

@Lisaskloset 

Thanks for update and support

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
pine
New Member
2 0 2

Can you do the opposite way @KetanKumar ? trying to figure out how to go from a vertical footer menu to a horizontal footer menu. 

Im a little stuck 

Thanks 🙂

KetanKumar
Shopify Partner
33393 3352 11052

Hello, @pine 

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
pine
New Member
2 0 2

Thanks for getting back so quickly @KetanKumar 

Site URL is www.thepineco.com.au I just want it horizontal on desktop view, not mobile. 

 

Thanks 🙂

KetanKumar
Shopify Partner
33393 3352 11052

@pine 

Thanks for update

yes, please add this code

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 (min-width: 768px) {
.links-footer ul li {
    display: inline-block;
    padding: 0px 5px;
}
}

 

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
ScenesOfBeauty
Tourist
4 0 3

Heyy! I have tried add this code but its still not changing my menu from horizontal to vertical - I'm not very tech savvy! Could you let me know what I am maybe doing wrong? My URL is https://scenes-of-beauty.myshopify.com

Thanks 

KetanKumar
Shopify Partner
33393 3352 11052

@ScenesOfBeauty 

oh, sorry for this issue can you please try this 

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

@media only screen and (min-width: 750px) {
ul.site-footer__linklist.list--inline {
    display: flex;
    flex-direction: column;
}
}

 

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
ScenesOfBeauty
Tourist
4 0 3

Thank you so much! This worked and looks so much better. 

Another question on footers, do you know how I split the menu into 2 lists? Right now it appears on just one. 

Thanks

Chloe

KetanKumar
Shopify Partner
33393 3352 11052

@ScenesOfBeauty 

it's my pleasure to help us.

yes footer it possible to more customization code can you please send personal message 

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
Samboi
Tourist
4 0 1

Hello @KetanKumar,

I tried adding this code for two of my websites.

It works, but the last item is indented and not centre aligned. 

How do I fix this?

See attached images.