I would try to change the backgrounds on my product images - Dawn Theme

[Dekanten]

Hello

As we read in the top i would like to play with other colors, can that be arranged without any mess? I would like to have the originalgrey as a background on the images. Not the whole plage and really hope someone can help me out here.

[Dan-From-Ryviu]

Hi @Dekanten

Please drop your store URL here so I can check and provide the code.

[BSS-Commerce]

Hi @Dekanten ,

As your requirement “try to change the backgrounds”, you can try this following my guide:

Step 1: Go to Online Store => Themes => Customize.

Step 2: You can change the color theme default:

Step 3: Save and reload the page.

If you want to change the color of different photo images, plz drop your store URL here so I can check and provide the code to solve this.

Have a nice day @Dekanten !

[Dekanten]

Hi, Dan

My site is www.dekanten.no

Let see what we can figure out.

[Dekanten]

Hi BSS, this will fill the whole area, but i want to change on each picture with a gap.

My url: www.dekanten.no

[Dan-From-Ryviu]

Hi @Dekanten

Please try to add this code in theme.liquid file, after tag in Online store > Themes > Edit code

[Dekanten]

Hi again, i tried as you said but i got a errormessage with the code on the header. I have attached a screenshot, maybe you can point me so i get this right.

[Dan-From-Ryviu]

Please remove this element and add my code after tag

[Dekanten]

Hi again, i tried it and nothing happens. I feel my self pretty dumb now im afraid. Could it be something to my theme.liquid who dont want to do it?

[Dan-From-Ryviu]

Could you show me where did you add the code?

[Dekanten]

Hi again, the code is in the bottom here, but can we place it somewhere else?

[Dan-From-Ryviu]

Hi, please remove the code in line 20, it does not have open element. And add my code below after tag

[BSS-Commerce]

As your requiment " change background each picture with a gap", you can try this follow my guide:

Step 1: Go to Online Store => Themes => Edit code

Step 2: Search: base.css or component-card.css (option) and add the scripts CSS at the end of the file:

You can change rgba from 0.5 to higher for a darker gray color.

.card__media{
    background: rgba(204, 204, 204, 0.5)
}
.media.media--transparent.media--hover-effect{
    mix-blend-mode: multiply;
}

Step 3: Save and reload pages.

The result I tried in my store:

The result on your store:

If my solution helps, plz tick marked as solutions. Tks and have a nice day! @Dekanten

[Dekanten]

Thank u so much for this code, i love it that way now.

Many many thanks for this help, im happy and grateful for all.

[existdoo]

Hi i had a same problem in my site.

So, is there way to apply this in prestige theme?! Please help me

mysite : https://unusual525.com

[existdoo]

Awesome solution!!!

how can i apply to my site ? my theme is prestige.

please help me. Thanks