Banners and banner color disappeared after adding background

I’ve added a background to my shop, but two of my banners disappeared and the text is not visible anymore. How can I add the background without changing the banners?

URL: cutegemz.com pasw: neatyou

Hi @poe1

Do you mean the header? you used the wrong selector. If you only want the body not the whole page.

Try to code to this.

main#MainContent {
    background: var(--gradient-background);
    background-attachment: fixed;
    background-image: url(https://cdn.shopify.com/s/files/1/0814/4705/9799/files/CuteGemz_Background-1.png?v=1715190770) !important;
    background-position: top left !important;
    background-size: auto !important;
}

And save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

Unfortunately it didn’t work. I’d like to add the following background to my page and want to keep the header with the two pink stripes at the same time. I’ve added the background to this reply.

Can you replace on this one. Let see if it work.

.gradient:not(.utility-bar) {
    background: var(--gradient-background);
    background-attachment: fixed;
    background-image: url(/cdn/shop/files/CuteGemz_Background-1.png?v=1715190770);
    background-color: transparent;
    background-position: top left !important;
    background-size: auto !important;
}

And Save.

Result:

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

Thanks!

Hey, somehow it doesn’t work anymore. :confused: