Re: Impluse theme - Transparent images don't appear transparent

Impluse theme - Transparent images don't appear transparent

DPDigital
Shopify Partner
7 0 0
I've uploaded transparent PNGs to my site, but whenever I add a background color to a section, the images appear with a white box or background.  

 

This is the code I use directly on the section : 

{
background-color: #fcbf;
}

 

Then I attempted to edit the theme code with the code below before the <body> . It did not work. Please advise. 
TYIA!

<style>
.card--card:after, .card--standard .card__inner:after {
display: none;
}
</style>

Replies 12 (12)

Liquid_xPert_SJ
Shopify Partner
1348 141 203

@DPDigital  can you please share the store url? so that i can look into it.?

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
- Need THEME UPDATES but have custom codes? No worries, for an affordable price.
DPDigital
Shopify Partner
7 0 0

www.oliveu.com

Thank you.

tim
Shopify Partner
3916 397 1443

One possibility is that an image, or image wrapper may have a background setting of its own.

Or, sometimes a theme may convert image from PNG to JPEG to save on image file size. 

Hard to tell without seeing your actual store.

If my post is helpful, consider liking it -- it will help others with similar problem to find a solution.
I can be reached via e-mail tairli@yahoo.com
DPDigital
Shopify Partner
7 0 0

Hi.

The URL is https://www.oliveu.com.

I removed the background color code from the product sections and I absolutely uploaded transparent .pngs.

Thanks so much. 

tim
Shopify Partner
3916 397 1443

You'd only need to add the following to your Custom CSS for this section:

 

.grid-product__image-mask {
  --colorBody: #fcbf;
  --colorSmallImageBg: #fcbf;
}

 

 

This will remove white background from the image wrappers.

 

If my post is helpful, consider liking it -- it will help others with similar problem to find a solution.
I can be reached via e-mail tairli@yahoo.com

Rahul_dhiman
Shopify Partner
740 143 150

Hello @DPDigital ,
Ensure that the PNG images are surely transparent and not saved with a white background. You can confirm this by opening them in an image editor like Photoshop or GIMP.
If you need help, provide me the URL of your store.

Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront

Contact here


BEST CUSTOMER ACCOUNTS APP WITH CUSTOM WISHLIST OPTION 
TRY OUR APP :

PWC: Customer Accounts & Pages

DPDigital
Shopify Partner
7 0 0

@Rahul_dhiman 

I uploaded transparent pngs. the URL is www.oliveu.com

Thank you.

Rahul_dhiman
Shopify Partner
740 143 150

Great @DPDigital ,
Please check the video I have created .

Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront

Contact here


BEST CUSTOMER ACCOUNTS APP WITH CUSTOM WISHLIST OPTION 
TRY OUR APP :

PWC: Customer Accounts & Pages

DPDigital
Shopify Partner
7 0 0

Thank you for the information @Rahul_dhiman .

Please see the link below which describes what I am attempting to accomplish. 

https://jmp.sh/6ezXrIq5

Rahul_dhiman
Shopify Partner
740 143 150

Hi @DPDigital ,
So please check the video . As I think I would be able to resolve it if I am provided access to the shop .

https://www.awesomescreenshot.com/video/28538405?key=e70e3936b925e44503cccb206cd2be96

 

 

Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront

Contact here


BEST CUSTOMER ACCOUNTS APP WITH CUSTOM WISHLIST OPTION 
TRY OUR APP :

PWC: Customer Accounts & Pages

DPDigital
Shopify Partner
7 0 0

Hi @Rahul_dhiman  - thank you for the information however, I was planning to make sections of the page a bacgkround color like i did for Father's Day

DPDigital
Shopify Partner
7 0 0

@Rahul_dhiman 

Thank you for the video, I sent you an email.