Support » Themes and Templates » transparent pngs

  • after many years of avoiding using pngs because IE’s desire is to place a block of colour behind something that’s transparent, I’ve tried to implement the fix.

    The JS one I haven’t been successful with it seems as I still see the gray block at the back. With the php method, it looks VERY confusing to me – having just tried it’s given me PHP errors all over.

    I’ve viewed this thread and the links and I can’t make sense of the PHP 1. I don’t know why the JS one doesn’t work either.


Viewing 5 replies - 1 through 5 (of 5 total)
  • Was that the one I posted about Jinsan? It give php errors if you aren’t very specific about where you put the leading and trailing calls.

    The leading call (<?php ob_start(); ?>) needs to be in header.php (normally – occasionally depending on theme you will need it in index.php instead) BEFORE the doctype declaration.

    The trailing call

    include_once 'replacePngTags.php';
    echo replacePngTags(ob_get_clean());

    needs to be at the very bottom of EVERY page where the transparent png will be used, just INSIDE the ending body and html tags.

    As well, you need to rename the pngs you are using to include -trans (so your header.png must be renamed to header-trans.png). And of course, you need to load the 8bit spacer.png into the image folder for the theme, and load replacePngTags.php into your wp root folder.

    Let me know if it’s still boggled. I didn’t have much trouble with it….

    Well I managed to get the js working – don’t ask, it was something very stupid on my part.

    With regards to the PHP method by every page, you mean including templates and so on? Rather than php within the page? Also can you confirm whether or not this works with IE6 & SP2? I know that the JS method doesn’t work with that combination (another SP2 “benefit” I believe).

    I’m trying to use it in combination with a category image plugin, so I wonder if that make cause complications. The replacePngTags.php file – I just copied it from the source the page to be honest and then whacked that in the theme directory with the other PHP files? Correct?

    Let me know your thoughts on this.


    Nope. The replacePngTags.php file needs to go in the wp root folder, not in wp-content/themes/theme-name folder.

    As far as I know, yes, it works with IE6+ SP2. I don’t think it would make any difference using it with a plugin – it’s a call to the spacer.png, then a call to the renamed *-trans.png file to remove the alpha channel that IE doesn’t do.

    Every page means every page in the theme .php files in which there is a call to the transparent .png. You have to place the “start” call at the “top” of your theme – in other words, either the header.php file or the index.php file (whichever one of those two starts with <!DOCTYPE ). The finish call gets put in any file in which the graphic is used, before the </body> tag.

    And yes, if you copied and pasted the code at the bottom of the koivisto site page, and named it replacePngTags.php, you’re fine.

    I’m trying to use this PHP fix as well, and am really confused.

    Nowhere in the replacePngTags.php file is any mention of needing to tack on a “-trans” to existing PNG files. Neither is there any mention of this on .

    Nevertheless, I’ve appended that text to one PNG file and updated the blog post. No luck.

    I’m confused how replacePngTags.php knows where my image is located. On line 179 of replacePngTags.php, I’ve tried a couple variations:
    1) $replace_src_with=$quote.$img_path.'..imagesspacer.png'
    2) $replace_src_with=$quote.$img_path.'<?php bloginfo ('url'); ?>imagesspacer.png'

    I’ve written to the dev, Justin, and he was talking about an include file that I’m missing, and a bunch of things I didn’t quite understand.

    I found that bit of info on adding the -trans somewhere else, and used it when I had trouble getting the Taft theme to display properly on IE.

    I’ve not tried this method with images in posts, only with images for a particular theme. Should work the same I’d think but can’t verify from personal experience, sorry.

    I didn’t change anything in the replacePngTags.php file. Justin Koivisto can no doubt explain better than I can how it works….

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘transparent pngs’ is closed to new replies.