png thumbnail has black background
I have added an extra thumbnail so I now have two thumbnails/images. One is a picture (jpg) of a property for sale and the other picture (png) is supposed to be a sash with a transparent background that (using z-index) gets placed over the top left corner of the jpg. The sash reads "For Sale".
The problem I am having is when I upload an image to C5 in converts my transparent png to a jpg. The result being a black non-transparent background. The transparency gets lost in conversion. Does anyone know of a way to stop this conversion?
As usual, any help would be greatly appreciated:)
When you check the image helper (concrete/helpers/image.php) you'll see in line 73 what's going on.
You could try to change the code there but I'm not sure about the sideffects of that....
Just google around a bit and you are bound to find lots of people complaining about it. I haven't found a solution to it, but maybe a developer can come to the rescue.The above links are not as related to the specific issue listed here. But I am almost positive I ran across issues like this with layered items and png. The problem was there in 5.3.2 as well, but I don't think it is isolated to C5.
The thumbnail is a jpg file and not a png... It's therefore not related to this IE problem.
It's not that easy to fix!
But with that said when you actually use the png on your site its alpha transparency won't work right in ie8. so while you will fix the thumbnail your actual image is still going to have issues in the page layout if it uses alpha channels for layered effects. The issue appears to extend to items using z-index to.
Sometimes when you convert a png into a jpg the transparency is seen as black. So my solution is to find a way of stopping this png>>>jpg conversion.
Check the code line I've mentioned and try to modify it and see what happens.
I will let everyone know first thing:)
<?php var_dump(gd_info()); ?>
Feel free to carry on with this thread, if not I will pick it up when I can!
$res2 = @imageJPEG($image, $newPath, 80);
changed the "JPEG" to "PNG" and that seemed to work. But the only thing that messes up now is that you cannot see the thumbnail image preview in the file manager.
Any how. I have tried the suggestions from Remo and JG1000, and yes that kinda solves the problem of PNG conversion, in terms of having a PNG with a transparent BG.
But, not only is the image NOT visible in the image preview manager there is also another problem that has now arisen; The second image ("For Sale/Let" sash) I import is not showing at all in the main site, the only reference to the image is some text that reads "Property One" (which is also the title of the page).
I have attached two images, one is the current problem and the other is the desired end result.
Maybe I should rephrase the original question:
How would you create a property listing page that listed multiple properties?
Each listing would contain a thumbnail with an editable "for sale/sold" sash over the top corner (the sash could be updated from "for sale" to "sold"). Each listing would also have a title, description and a more info link.
The link would then take the end users through to the "property detail" page, this page would contain the galleria module and a detailed description of the property.
I have got so close to getting this done, but the fact that the sash does not work, leaves the entire job redundant.
Has anyone created anything similar to this? Your help would be really appreciated.
Please see attached image for an example of what I mean.