Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Images not honoring PNG transparency 7.1


LHC

Recommended Posts

I'm trying to use image stacks with PNGs, but Squarespace is adding a faint color behind them. I tried testing all of the different image blocks and inline was the only one that didn't put a color behind the images (but it squished them). What is the issue here? Just a bug?

Screen Shot 2020-03-13 at 13.37.06.png

Link to comment

I'm having this same issue - I'm wondering if there's an automatic overlay? Because it happens with transparent PNGs as well as JPEGs with white backgrounds, and it looks like maybe that's what's going on. I have been trying to figure out how to turn it off, but no luck yet. If anybody figures it out, I'd love to know!

Link to comment
  • 2 months later...

How is this not getting more attention?  Squarespace doesn't appear to even honor transparent PNGs anymore??

Honestly I have found this platform to be the most frustrating tool for web creation I could ever think of.  It works great if you'd like their cookie-cutter vanilla design but best of luck getting it to do anything interesting and then on top of that, I get problems like this one to try to mitigate because Squarespace can't even get their basic sh* together.  I'm regretting using this platform more and more every time I'm forced to use it.  

Link to comment

Found a fix to this problem in another thread and thought it might be helpful to post it here:

 

To fix this mess that Squarespace has created with their asinine default settings, do the following:

Menu > Design > Section Themes

Select the theme of the section where your images are displaying incorrectly.  You'll have to do this for all offending sections. 

Click on the offending image, which selects it's widget type in the styles options list.  Choose 'image overlay' and move the white circle in the bottom ribbon all the way to the left.  This will then display transparency correctly.  

Edited by PracticalPorpoise
Link to comment
  • 2 weeks later...
  • 3 weeks later...
On 5/20/2020 at 9:01 PM, PracticalPorpoise said:

Found a fix to this problem in another thread and thought it might be helpful to post it here:

 

To fix this mess that Squarespace has created with their asinine default settings, do the following:

Menu > Design > Section Themes

Select the theme of the section where your images are displaying incorrectly.  You'll have to do this for all offending sections. 

Click on the offending image, which selects it's widget type in the styles options list.  Choose 'image overlay' and move the white circle in the bottom ribbon all the way to the left.  This will then display transparency correctly.  

This worked for me, but I did have to go to Menu > Design > Colors > Section Themes. 

Link to comment
  • 2 months later...
  • 4 months later...

@annakatjordan, @PracticalPorpoise said how to fix it in their post above, and it applies to 7.0

--------------------------------------------------------------------------------------------------------

Found a fix to this problem in another thread and thought it might be helpful to post it here:

 

To fix this mess that Squarespace has created with their asinine default settings, do the following:

Menu > Design > Section Themes

Select the theme of the section where your images are displaying incorrectly.  You'll have to do this for all offending sections. 

Click on the offending image, which selects it's widget type in the styles options list.  Choose 'image overlay' and move the white circle in the bottom ribbon all the way to the left.  This will then display transparency correctly.  

Edited by ShalenaWhite
Link to comment
  • 4 weeks later...
  • 4 weeks later...
  • 1 month later...
  • 1 month later...
  • 2 weeks later...
On 5/21/2021 at 4:46 AM, katiedunnit said:

So I did this exact thing and I'm still having issues. I also removed all my CSS to ensure it wasn't because of that and nope - same issue.

https://www.loom.com/share/972f15c25ce346cbac06c7439deb78a9

Thoughts?

Add to Design > Custom CSS

.image-overlay {background: transparent !important;}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 6 months later...

Hi, On 7.1. I have the same or similar issue with all my images when I use the 'List' section 😭 I've searched for all possible overlay and image background options to set them as transparent but still not working.

If anyone, finds a solution please please share away! 🤞

Thx

Link to comment
4 hours ago, SarahSWD said:

I have the same or similar issue with all my images when I use the 'List' section

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password is not a security breach. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...