Overlay Multicolumn over Footer

Solved

Overlay Multicolumn over Footer

BellesandBells
Shopify Partner
27 0 10

Hello, 

I am currently trying to overlay an image in a Multicolumn section over my footer. I have tried playing around with the z-index but no luck. 

 

Website is:

https://g7km28gklmt4f0d0-57991692463.shopifypreview.com

 

I am trying to overlay this purple image over the top of the peach coloured wave.

Screen Shot 2025-01-25 at 10.11.38 pm.png

 

Any assistance would be greatly appreciated 🥰

Accepted Solution (1)

Moeed
Shopify Partner
6736 1820 2202

This is an accepted solution.

Hey @BellesandBells 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
section#shopify-section-template--17922527199407__multicolumn_B84YWb .page-width.section-template--17922527199407__multicolumn_B84YWb-padding.isolate.scroll-trigger.animate--slide-in {
    z-index: 999 !important;
}
</style>

RESULT:

Moeed_0-1737807867723.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications


View solution in original post

Replies 3 (3)

Moeed
Shopify Partner
6736 1820 2202

This is an accepted solution.

Hey @BellesandBells 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
section#shopify-section-template--17922527199407__multicolumn_B84YWb .page-width.section-template--17922527199407__multicolumn_B84YWb-padding.isolate.scroll-trigger.animate--slide-in {
    z-index: 999 !important;
}
</style>

RESULT:

Moeed_0-1737807867723.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications


BellesandBells
Shopify Partner
27 0 10

That worked perfectly, thank you. 

I now just need to adjust the z-index so that it doesn't show on top of the header when scrolled down. Are you able to advise what number I can set to?

 

Thanks so much!

Moeed
Shopify Partner
6736 1820 2202

Try setting the value to 9 or 10, this would work too. 

 

Best Regards,

Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications