Solved

Capital theme: Grey Background on transparent photo only in product page

Lekky
New Member
6 0 0

Hello everyone,

 

I recently bought a shopify subscription and a theme (Capital) and I am having trouble figuring out something that should be quite easy to solve in my opinion.

 

I have looked and looked but maybe you can help me out.

 

I am uploading png photos of my products with transparent backgrounds and everything works fine until I go to the product page where a dreadful grey film appears around my image instead of the transparency.

 

The theme's colour options do not seem to address that but I might be wrong. 

 

Please please please help me out it just looks so bad (eeeeek)

 

Thank you in advance for helping out a newbie!

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
7729 1507 1517

This is an accepted solution.

Please add this code to theme.liquid file, after <head> in Online Store > Themes > Edit code to remove that grey back ground 

<style>
#product-media .has-img-placeholder {
    background-color: transparent;
}
</style>

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 9 (9)

Dan-From-Ryviu
Shopify Partner
7729 1507 1517

Hi @Lekky 

Could you share your store URL to check?

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Lekky
New Member
6 0 0

I am currently building it so it is password protected 

Lekky
New Member
6 0 0

Screenshot 2024-05-02 at 12.10.58 PM.png

 

I can share this print screen though - You can see that even the thumbnails look fine - but the grey on the large photo is there

Dan-From-Ryviu
Shopify Partner
7729 1507 1517

Please share preview URL so I can check and give me solution. 

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Lekky
New Member
6 0 0
Dan-From-Ryviu
Shopify Partner
7729 1507 1517

This URL needs a password to view. Screenshot 2024-05-02 at 16.18.54.png

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Lekky
New Member
6 0 0

I removed the password for now

Dan-From-Ryviu
Shopify Partner
7729 1507 1517

This is an accepted solution.

Please add this code to theme.liquid file, after <head> in Online Store > Themes > Edit code to remove that grey back ground 

<style>
#product-media .has-img-placeholder {
    background-color: transparent;
}
</style>

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Lekky
New Member
6 0 0

THANK YOU SO MUCH!!

 

It worked ❤️