Solved

Adding background images to templates, collages etc

Scotty24
Tourist
13 0 0

I've literally spent two days on this 🙄

I've tried about a dozen bits of code in every file imaginable.

Using spotlight theme. I'm trying to add a background image to a collage for example. The collage has the central image and then the big white wrapper. I want my collage picture in the middle and then a background image to take up the empty space around it.

 

Also looking to be able to do this for the favourite collection product template. Again, I can see the image is behind the template. Tried messing with opacity, tried no background etc. Nothing has worked and even Gemini/chatgpt have given up on me.

 

Any ideas before I give up on it?

Accepted Solution (1)
deepaksharma
Shopify Partner
448 62 92

This is an accepted solution.

DM me I need answer for the section then I will provide the code file and instruction directly there, if that seems fine.

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com

View solution in original post

Replies 8 (8)

deepaksharma
Shopify Partner
448 62 92

Hey there Scotty24,

Deepak here

 

Can you share screenshot and the store url so i can provide any help on your issue.

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
Scotty24
Tourist
13 0 0

Hi. thanks for replying. As you can see there's a background image behind the collage, but the wrapper around the collage obscures it. I just want to collage image and everything around it to be background image.

 

https://imgur.com/j0qiqe8

 

 

deepaksharma
Shopify Partner
448 62 92

Hey sorry for late reply I wrote a sample code could you please check this website is this something similar you need? The code is not optimize for certain device because of short time, review and waiting for your response.

https://demo-eazy-store.myshopify.com/
password=neefri

Note: This is just a first draft sample I will adjust the future design much more attractive and dynamic and responsive.

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
Scotty24
Tourist
13 0 0

Hi, this looks promising. 

Am I able to use the code to try it on my site?

deepaksharma
Shopify Partner
448 62 92

can you tell me your mail I will mail you the code.

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
Scotty24
Tourist
13 0 0

Appreciate your help, but not into handing out email.

 

Thanks anyway.

deepaksharma
Shopify Partner
448 62 92

This is an accepted solution.

DM me I need answer for the section then I will provide the code file and instruction directly there, if that seems fine.

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
Scotty24
Tourist
13 0 0

Fantastic! thank you so much.