Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: Product image background color

Solved

How can I display products with a transparent background on my webpage?

surrender4lyfe
Tourist
3 1 0

Hello I'm trying to get help with a issue probably already answered but i cant seem to find the solution for my page. I'm trying to make my products display with a transparent background so a video can play as my entire page background. I'm making my products transparent while also using png transparent files, but every time im viewing my page the products are showing with a black box. A solution for this will be very helpful. I added a screenshot for better understanding.Screen Shot 2023-07-06 at 7.12.35 PM.png

Accepted Solution (1)
surrender4lyfe
Tourist
3 1 0

This is an accepted solution.

Figured it edit code and remove line 59 in the theme.liquid folder

View solution in original post

Replies 3 (3)

Rick-InventoryH
Shopify Partner
118 6 10

Hi @surrender4lyfe , 

In order to make your products display with a transparet background, you need to save your product images as PNG format files with transparent backgroudns. 

Then remove any backgroudn color settings in the CSS folder of your theme. 

Also clear your browser cache and refresh the page to be able to see the changes. 

 

Ricardo | InventoryHero app Specialist
InventoryHero - Automatically Discount Weak Inventory
https://apps.shopify.com/inventory-hero

https://inventoryhero.app

Ottawa, ON, Canada
surrender4lyfe
Tourist
3 1 0

Product images are already png with transparent backgrounds.

How do i remove any background color settings in the css folder

surrender4lyfe
Tourist
3 1 0

This is an accepted solution.

Figured it edit code and remove line 59 in the theme.liquid folder