Jump to content

transparent footer & same whole site background image

Recommended Posts

Site URL: https://www.ironboardecor.com

Site URL: https://www.ironboardecor.com

Hello,

I am looking for help. How can I:

  • make the footer transparent so the background image shows from top to bottom
  • make the background image I have on my home page into a whole site background image
    • while maintaining the color overlay and overlay transparency at %50 on the background image on whole site

 

Thank you so much to whoever helps!

pw: jengo

-Pete

Link to comment
  • Replies 3
  • Views 1.9k
  • Created
  • Last Reply

Add to Design > Custom CSS

/* Footer transparent */
body.homepage {
    position: relative;
}
body.homepage footer#footer-sections {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 999;
    width: 100%;
}
body.homepage footer.sections section, body.homepage footer.sections .section-background {
    background: transparent;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
5 hours ago, tuanphan said:

Add to Design > Custom CSS


/* Footer transparent */
body.homepage {
    position: relative;
}
body.homepage footer#footer-sections {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 999;
    width: 100%;
}
body.homepage footer.sections section, body.homepage footer.sections .section-background {
    background: transparent;
}

 

Thank you for the reply!

It made the footer transparent on the bottom of home page. How can I apply it to my store page and my faq page? Also how can I get the homepage background image onto store page and faq page?

Link to comment
On 5/22/2021 at 9:46 PM, pandaprojectsusa said:

Thank you for the reply!

It made the footer transparent on the bottom of home page. How can I apply it to my store page and my faq page? Also how can I get the homepage background image onto store page and faq page?

Add this to Store Page & FAQ Page Header

<style>
  /* Footer transparent */
body {
    position: relative;
}
body footer#footer-sections {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 999;
    width: 100%;
}
body footer.sections section, body footer.sections .section-background {
    background: transparent;
}
</style>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.