I added a background to my Shopify page using code, but the image I used for the background also app

tanibuy
Tourist
7 0 1

resim_2024-06-07_142616155.png

Replies 10 (10)

Made4uo-Ribe
Shopify Partner
6432 1543 1912

Hi @tanibuy 

Can you please explain more what your problem is? Do you mean you like to remove the background image on ther collection product? 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
tanibuy
Tourist
7 0 1

I added a background image to the site, but the background image also appeared on the category buttons and the product background.

Made4uo-Ribe
Shopify Partner
6432 1543 1912

Would you mind to share your store URL? Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
tanibuy
Tourist
7 0 1
tanibuy
Tourist
7 0 1

resim_2024-06-07_151403438.png

Like this.

 

Made4uo-Ribe
Shopify Partner
6432 1543 1912

Thanks for the info, please check the code I have here and compare to your code in the base.css. 

.gradient:not(.card--media.color-scheme-5.gradient) {
    background: var(--gradient-background);
    background-attachment: fixed;
    background-image: url(/cdn/shop/files/EUROPEAN_CHAMPIONSHIP_2024_2.png?v=1717302554) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
}
.card--media.color-scheme-5.gradient {
    background: transparent;
}

And Save. 

I add some codes so it wont affect the product background. 

result:

Made4uoRibe_0-1717769021611.png

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
tanibuy
Tourist
7 0 1

Can we make it white instead of transparent?

 

Made4uo-Ribe
Shopify Partner
6432 1543 1912

Yeah, but you have white text. you like to change into black?

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Made4uo-Ribe
Shopify Partner
6432 1543 1912

Remove the last code,. change into this one. The default color of the product grid background is white. 

.gradient:not(.card--media.color-scheme-5.gradient) {
    background: var(--gradient-background);
    background-attachment: fixed;
    background-image: url(/cdn/shop/files/EUROPEAN_CHAMPIONSHIP_2024_2.png?v=1717302554) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
}
.card__information * {
    color: black;
}

And Save. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
tanibuy
Tourist
7 0 1

Category tab still has the same background image, plus the transparency of the middle button is goneEkran görüntüsü 2024-06-07 161643.png