How to move footer menu below subscribe

Solved

How to move footer menu below subscribe

nmn22601
Tourist
12 0 3

I would like to move the footer menu below the subscribe email and social links in the footer

 

https://q478a5ljt5g7ge1x-85805793561.shopifypreview.com/

nmn22601_0-1716125923589.png

 

Accepted Solution (1)

ThePrimeWeb
Shopify Partner
2139 616 523

This is an accepted solution.

Hey @nmn22601,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.footer__content-top {
    display: flex !important;
    flex-direction: column-reverse !important;
}

.footer-block--newsletter {
    margin-top: 0 !important;
}

.footer__blocks-wrapper {
    margin-top: 25px !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1716126567829.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

View solution in original post

Replies 3 (3)

ThePrimeWeb
Shopify Partner
2139 616 523

This is an accepted solution.

Hey @nmn22601,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.footer__content-top {
    display: flex !important;
    flex-direction: column-reverse !important;
}

.footer-block--newsletter {
    margin-top: 0 !important;
}

.footer__blocks-wrapper {
    margin-top: 25px !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1716126567829.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

BSSCommerce-HDL
Shopify Partner
2305 835 908

Hi @nmn22601

You can try this code by following these steps:

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

BSSTechVenture_0-1716127001110.png

 

Step 2: Search file base.css, theme.css or styles.css

BSSTechVenture_1-1716127005946.png

 

Step 3: Insert the below code at the bottom of the file -> Save

.footer__content-top.page-width {
    display: flex !important;
    flex-direction: column !important;
}

.footer__blocks-wrapper:has(.footer-block--menu) {
    order: 2 !important;
    margin-top: 15px !important;
}

Here is result: 

BSSTechVenture_2-1716127036706.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

PageFly-Amelia
Shopify Partner
626 165 238

Hello @nmn22601 

This is Amelia at PageFly - Shopify Advanced Page Builder app.

 

You can try the following steps I have provided to help you solve the problem you are facing:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file base.css

Step 3: Add code

<style>
footer .footer__content-top {
    display: flex !important;
    flex-direction: column-reverse !important;
}

footer  .footer__blocks-wrapper {
    margin-top: 20px !important;
}
</style>

 

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.