X3Photo Gallery Forums

cmodesign wrote:The Gallery view shows a black background behind the transparent image.

This happens when PHP resizes images with transparency (PNG or GIF) to a non-transparent format (JPG). The original transparent area just becomes a default non-color / black. If you really really need, it could be possible to adjust the transparency-background-fill color in X3 /app/parsers/slir/index.php, similar to the example code in this post.

cmodesign wrote:However, when you click on an image to view the fullscreen popup, it shows a white background. Why is the background not consistently white?

I'm not sure what white background this is, unless you set the popup background to white. When clicking to view a semi-transparent image in the popup, the transparent area will simply show the background color behind the image. I don't know what color this is on your X3 website, but by default it would be dark.

As you may understand, the resized image and the full image are therefore two separate things. We don't "assign" any background color to your original. It's transparent, and will therefore show whatever is behind it. Resized images on the other hand, resized by PHP on your server, will need to fill in the transparent background color into the rendered image. Normally, this is just black, and even if you change it, you can't just set it to "the same color as the original", because the original doesn't have any color, and will simply show whatever is behind the transparent area.

cmodesign wrote:Ideally, the background for transparent images would be light grey so that transparent logos with white graphics would appear. Is there a setting to change this or can I do this through customized CSS?

So, it could be possible to assign light grey for the small resized image, by ways of editing the PHP code. But no you can't assign this color to the full size image, as they will retain your original transparency. The only way for this, would be to perhaps assign the popup background color to be light grey.

As you can see, it's a bit complicated, but if you want to follow up, we can try to make it work.

cmodesign wrote: Ideally, the background for transparent images would be light grey so that transparent logos with white graphics would appear.

If you want to show the actual content of the image in front of light grey, why don't you export and upload them with light grey background in the first place?

Maybe I misunderstood your intention, but for me this seems to be the easiest way.

As noted in my previous post, you then need to deal with TWO images:

1. The original image, which already has transparency, in which case you will need to assign the popup background-color, which displays behind the semi-transparent image.
2. The resized image, which does not contain transparency, but where the PHP server resize has the option to assign a default background color on the image itself. You would need to modify /app/parsers/slir/index.php, similarly to this post.

cmodesign wrote: I tried inserting the code although it seemed to already be there in the index.php in the "files" folder. I cleared the cache in the dashboard and also in Google Chrome. I re-uploaded the images and reduced the size to horizontal (1000 x 709px) and vertical (560 x 1000px). In the popup the custom colour I selected shows as expected. Surprisingly the vertical images show a white background in the FOLDER view but the horizontal images still show a black background.

You made this edit in Files gallery index.php? And where are you checking the results?

Just to be clear, if you want this fix in X3, you will need to edit /app/parsers/slir/index.php (yes I will try to help you). The link was a reference to how this was done in Files Gallery, and it needs to be implemented similarly in X3. If you have made changes to /files/index.php, this will not affect the X3 gallery in any way.