How can I extend a body background image to cover the footer?

Store Design
1

I have added an image background to the body of my page, but i would like it to also cover the footer

1 Like
2

@GeorgeRizos ,

Share the store URL…

3

hi @oscprofessional

My url is: https://thesnoozy.com/

password: 123

4

@GeorgeRizos

Please add the following CSS code to your assets/base.css bottom of the file.

body {
    background-image: url("https://media.istockphoto.com/id/1278304109/vector/christmas-snowflake-background-seamless-pattern.jpg?s=1024x1024&w=is&k=20&c=odCioCyk_pl6lQ_MopZkH8GdL1faxBu-KrBHPeF1j2k=")!important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

Thanks!

5

Hello @GeorgeRizos
Please share background image URL.

6

Hi @GeorgeRizos ,

Thank you for reaching out to the Shopify forums!

Let me quickly fix that issue for you.

Please add the below CSS in your base.css file.

.footer {
    background: #8e282a;
}
.copyright__content a, .footer-block__details-content .list-menu__item--link, .footer-block__heading {
    color: #fff;
}

If its working then, please do not forget to accept this solution :slightly_smiling_face:

Thanks & Regards,
Prezen Tech

7

Hi @GeorgeRizos ,

This is Victor from PageFly - Advanced Page Builder. I would love to give you some recommendations:

  • Go to Online Store->Theme->Edit code
  • Asset-> base.css paste the below code at the bottom of the file
footer{background: inherit !important}

  footer *{color:white !important}

PageFlyVictor_0-1668659189181.png
PageFlyVictor_0-1668659189181.png1366×768 102 KB

Hope my solution works perfectly for you!

Best regards,

Victor | PageFly team