Placing footer text side-by-side

Solved
CamillaChu
New Member
5 0 0

Hi

 

I want the Policies on my page to stand side-by-side and not on top of each other.
NOT like this:

Privacy Policy
Refund Policy
Shipping Policy
Terms of Service

 

Like this:
Privacy Policy   |   Refund Policy   |   Shipping Policy   |   Terms of Service

 

How do I do this?

Accepted Solution (1)

Accepted Solutions
diego_ezfy
Shopify Partner
2308 414 543

This is an accepted solution.

@CamillaChu, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

@media (min-width: 750px){
    .site-footer__menu{
    display: flex;
}
    .site-footer__menu li{
    margin-right: 10px;
}

    .site-footer__menu li:not(:last-of-type):after{
    content: "|";
    margin-left: 10px;
    pointer-events: none;
}
}



Kind regards,
Diego

◦ Slideshow images cutting off or looking bad? Try the Slideshow (PRO) section. No apps required.
◦ Replace apps with copy/paste code snippets & save money. Examples here.

View solution in original post

Replies 4 (4)
diego_ezfy
Shopify Partner
2308 414 543

Hello @CamillaChu,

Please share:
- your store URL;
- page URL with the issue you mention;
- storefront password (if your store has one).

If the store is not online yet, please follow this quick tutorial to learn how to safely and temporarily share an offline/unpublished theme URL.

Kind regards,
Diego

◦ Slideshow images cutting off or looking bad? Try the Slideshow (PRO) section. No apps required.
◦ Replace apps with copy/paste code snippets & save money. Examples here.
CamillaChu
New Member
5 0 0

Hi @diego_ezfy 

 

My page URL with the issue is: https://miuqelx3gvzsy5n0-60293677285.shopifypreview.com

The storefront password is chaffa
I hope that this link is fine.

 

The problem is in the footer with the polices.

diego_ezfy
Shopify Partner
2308 414 543

This is an accepted solution.

@CamillaChu, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

@media (min-width: 750px){
    .site-footer__menu{
    display: flex;
}
    .site-footer__menu li{
    margin-right: 10px;
}

    .site-footer__menu li:not(:last-of-type):after{
    content: "|";
    margin-left: 10px;
    pointer-events: none;
}
}



Kind regards,
Diego

◦ Slideshow images cutting off or looking bad? Try the Slideshow (PRO) section. No apps required.
◦ Replace apps with copy/paste code snippets & save money. Examples here.

View solution in original post

CamillaChu
New Member
5 0 0

Thanks @diego_ezfy  I'll try that