Reliable PNG Transparency

[cfe]

This was mentioned in an older post but the link was broken, and I couldn't reply, so here ya go.

A good a quick solution to allow IE 5-6 to render transparent PNG's in your store can be found here.

If you throw the main PHP file in your main catalog directory, the first tag at the top of your tpl_header.php file, and the second tag at the bottom of your tpl_footer.php file, then you should be set!

(also make sure that you specifiy height and width values for any png's that you use)

[irischant]

It's neat that you've posted that. I was actually checking around for png support & found the exact same solution that you've found through google. I was implementing it & lo & behold, found that you've already posted it here.

Anyhow, just thought that I'd mention that I too have it working correctly on my test shop & actually only put the tags at the top & bottom of my tpl_main_page.php, so either way works.

Good stuff!

[Webdraon777]

Hi Zenners,

So I went to the link in question and read...
Just don't get exactly where I should implement the codes.
I experimented with the tpl_main didn't work , then tried the tpl_header and tpl_footer

Could you clarify please for a novice.

Thanks in advance...

[Webdraon777]

Ok so after a lot of trial and error I almost have it.
Only one little problem.

If someone could have look and let me ow how to fix this would be great.
http://www.gefo.ca/GeFo_Store/

Probably just not code in the right place
I put it in the tpl_main and the function in the main directory.

Thanks

[cfe]

Are you referring to the fact that is looks like there's a broken image over the top of it?

That's because you need to get the spacer.png file provided to you on the instructions page, and put it in your images folder of your catalog. You can also create your own, just an empty 1x1 pixel PNG-8 image.

Hope that helps...

[Webdraon777]

Thanks CFE,

sometime the obvious just isn't.
works fine now.

[IntelCos]

I get the impression this is good for images pulled from within the files mentioned to have this mod. But in the case where CSS is being used to pull up images, would this work as well?

[purple-circle]

In case anyone is getting the red cross error in IE, an easy fix is to upload the spacer.png file to every folder that contains PNG images. If you are using Image Handler, you'll also need to upload it into each one of the directories in the bmz_cache folder as well as all of your product image sub-directories. i.e. the large, medium, manufacturers, banners, etc. folders.

It means having around 30 or so copies of spacer.png on the server but it saves having to track down all the different places where relative and absolute links are being used to correct it.

[rvagrrl]

I'm having trouble with this. I've applied the hack, but the images are just gone and are replaced by the transparent spager.png without the original image showing beneath:

http://backwards.lbdclients.com

The images are the shop and EZ-Pages sidebox headers and also three PNGs in a banner box below them. The source code looks like it should be right:

<h3 class="rightBoxHeading" id="ezpagesHeading"><img src="/includes/templates/custom/images/spacer.png" style="width: 178px; height: 28px; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/includes/templates/custom/images/backwards_info.png', sizingMethod=scale);" alt="info" /></h3>

I put the spacer.png file in includes/templates/custom/images and the replacePngTags.php in the root directory where the cart is installed. I added the code to the top of tpl_header.php and the bottom of tpl_footer.php. I must be doing something wrong, but I can't figure it out.

The images are PNG-24, but I don't think that should be a deal breaker for the hack.

Any help would be appreciated. Thanks!