Can I hide broken images?

Question

Hi guys, I am trying to create a sidebar for which I can specify the image in the back-end of my wordpress cms using custom fields, now I have gotten it to work, with just one little bug, if the user enters a invalid URL, the image link will display as broken and will not display, is there a way that I can hide the broken image icon perhaps?

I have a background image set for the parent DIV element so that if there is no image to display, the parent's background will.

here is the PHP code:

//here I get the 'side_image' custom field, which will contain the URL to the side image    
if (have_posts()) : 
         while (have_posts()) : the_post(); 
             $side = get_post_meta($post->ID, 'side_image', true); 
         endwhile;
 endif;

HTML:

<!--here is the HTML markup-->
<div id="inner_content_right">
    <img src="<?php echo $side; ?>" />
</div>

CSS:

#inner_content_right {
    background: url(images/Layout_3_other_06_backup.jpg) no-repeat;
    width: 259px;
    height: 691px;
    float: right;
    position: relative;
    bottom: 28px;
}

Thanx in advance!

Answer 1

You can test it with cURL. See the answer at this link.

Answer 2

You could try something like

<!--here is the HTML markup-->
<div id="inner_content_right">
    <img src="<?php if (@getimagesize($side)) echo $side; ?>" />
</div>

Answer 3

Thanx guys, I got it to work with this code!

//check if the string is a valid URL
function checkURL($url)
{
    return preg_match('|^http(s)?://[a-z0-9-]+(.[a-z0-9-]+)*(:[0-9]+)?(/.*)?$|i', $url);
}

//returns a image with a valid URL or nothing at all
function validateImage($one){
if(!checkURL($one))
{
    $errMsg .= "Please enter valid URL including http://";
    //return $errMsg;
} else {
    $headers = get_headers($one, 1);
    $return = $headers[0];
    if($return!='HTTP/1.1 404 Not Found'){
        $string = "<img src='$one' />";
        return $string;
    }
    }
}

Thanx for all your help!