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...

@Ransomedia I just figured it out!

 

press the brush icon in the top right > click color > click color theme > (this part was what tripped me up original) THEN pick the particular color theme you want > Find image Overlay > Slide the image overlay slider all the way to transparent (shown in the image below)

Screen Shot 2021-05-05 at 5.08.46 PM.png

Link to comment
  • 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;}

 

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...