Jump to content

Replace image where none displayed


wright67uk

Recommended Posts

I'm using the below code to display plant names with their accompanying images.

 

The images are hot-linked (with the permission of the owner).

The issue is sometimes an image doesn't exist, has been moved or the file name has been changed.

When this happens, I want to display an image named sorry_lg.jpg instead.

 

How do I go about doing this?

 

I was thinking about giving the containing div a pre-defined background image, and then covering the background with the hot linked image.  But surely there is a cleaner way of doing this?

$result = db_query("SELECT * FROM `shrubs` WHERE `type` = '$cat' order by `name` ");

if($result === false) {
    echo "something went wrong with this query";
} else {
    // Fetch all the rows in an array
    $rows = array();
    while ($row = mysqli_fetch_assoc($result)) {
      //  $rows[] = $row;
	  
	  $name = $row["name"];
	  $salesprice = $row["salesprice"];
	  // $image = str_replace(' ', '-', $name);
	  $image = preg_replace('/[\s-]+/', '-', $name);
      $imagelow = strtolower($image);
	  
	  
	  echo '
	  <div class="product">
	  <div style="float:left; width:170px"><img src="http://www.old-hall.com/uploads/images/osb/'.$imagelow.'_lg.jpg" width="150px" height="150px" /></div>
	  <div style="float:right"><div style="margin-left:auto; margin-right:auto"><a href="http://www.1pw.co.uk/product_info.php?name='.$name.'"></div>'.$name.' - £'.$salesprice.'</a></div>
	  </div>
	  ';
	  
    }
}
Link to comment
Share on other sites

If was your own images would be able to do this

$imagelow = strtolower($image);
if (!file_exists($_SERVER['DOCUMENT_ROOT']."/uploads/images/osb/".$imagelow."_lg.jpg")) {
    $imagelow = 'sorry';
}

Since is another website the only way is to download it or at least partially download the image first to tell if it exists.

Edited by QuickOldCar
Link to comment
Share on other sites

You can do something like this with css

<!DOCTYPE html>
<html>
<head>
<style>
.sorry  {
width:150px;
height:150px;
background-image:url("http://thumbs.dreamstime.com/x/sorry-sign-18772092.jpg");
background-color: #ffffff;
background-size: 150px 150px;
}
</style>
</head>
<body>
<img class="sorry" src="http://www.old-hall.com/uploads/images/osb/berberis-harlequin.jpg" />
</body>
</html>
Link to comment
Share on other sites

If you really want to connect to each image first to see if it exists can do this.

getimagesize();

$imagelow = strtolower($image);
$image_location = "http://www.old-hall.com/uploads/images/osb/".$imagelow."_lg.jpg";
$image_size=getimagesize($image_location);
if(!is_array($image_size)){
     $image_location = "http://www.old-hall.com/uploads/images/osb/sorry_lg.jpg";
}

echo '
<div class="product">
<div style="float:left; width:170px"><img src="$image_location" width="150px" height="150px" /></div>
<div style="float:right"><div style="margin-left:auto; margin-right:auto"><a href="http://www.1pw.co.uk/product_info.php?name='.$name.'"></div>'.$name.' - £'.$salesprice.'</a></div>
</div>
';
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.