Software, your way.
How To Get Good Custom Software
(Download)
(PDF)
burger menu icon
WillMaster

WillMaster > LibraryWebsite Development and Maintenance

FREE! Coding tips, tricks, and treasures.

Possibilities weekly ezine

Get the weekly email website developers read:

 

Your email address

name@example.com
YES! Send Possibilities every week!

Image Thumbnail Maker

A recent project required reducing large images to thumbnail size. After that was complete, I used the image creation part to create an image thumbnail maker for you.

Why reduce image dimensions? Why not just use the image tag to tell the browser to publish the image smaller?

A large image generally has a large file size that the browser must download. A smaller image with a smaller file size, therefore, requires less device or computer resources to download and display.

What Image Thumbnail Maker can do for you is generate the smaller image.

You provide the image URL and the maximum dimensions for the thumbnail. Then click the button. The Image Thumbnail Maker control panel reloads with the thumbnail image displayed. Save the image to your computer to use on your web pages.

The dimensions of the thumbnail that Image Thumbnail Maker creates are in proportion to the dimensions of the original image.

Depending on the original image size, the file size reduction can be drastic.

Here's a screenshot of the control panel.

Image Thumbnail Maker control panel

And here's a screenshot of the control panel after it's rendered a thumbnail image.

Image Thumbnail Maker control panel

Follow these steps to install it for yourself:

  1. Copy the source code from the box below.

  2. Save it as ThumbnailMaker.php (or other .php file name that you prefer).

  3. Upload ThumbnailMaker.php to your server.

  4. Type the ThumbnailMaker.php URL into your browser.

<?php
/*
   Image Thumbnail Maker
   Version 1.0
   January 1, 2016

   This software requires that the GD module is installed.

   Will Bontrager Software LLC
   https://www.willmaster.com

   This software is provided "AS IS," without 
   any warranty of any kind, without even any 
   implied warranty such as merchantability 
   or fitness for a particular purpose.
   Will Bontrager Software LLC grants 
   you a royalty free license to use this 
   software provided this notice appears 
   on all copies. 

   Copyright 2016 Will Bontrager Software LLC
*/

#$Image = ( isset($_POST['submit']) and strlen($_POST['url']) ) ? true : false;
$Error = '';
$Image = false;
if( isset($_POST['submit']) and strlen($_POST['url']) )
{
   $URLofImage = $_POST['url'];
   $imageDetails = getimagesize($URLofImage);
   if( empty($imageDetails) ) { $Error = "<p style='margin:0;'><b>No image found at<br>$URLofImage</b></p>"; }
   else { $Image = true; }
}
if( $Image )
{
   $Width = $imageDetails[0];
   $Height = $imageDetails[1];
   $Mime = $imageDetails['mime'];
   $MaxWidth = intval($_POST['width']) > 0 ? intval($_POST['width']) : $Width;
   $MaxHeight = intval($_POST['height']) > 0 ? intval($_POST['height']) : $Height;
   if( $MaxWidth > $Width ) { $MaxWidth = $Width; }
   if( $MaxHeight > $Height ) { $MaxHeight = $Height; }
   $ta = explode('.',$URLofImage);
   $sourceExtension = array_pop($ta);
   if( $sourceExtension == 'jpg' and $imageType == 'jpeg' ) { $imageType = 'jpg'; }
   $proportion = 1.0;
   if( $MaxWidth < $Width or $MaxHeight < $Height )
   {
      $i = $MaxWidth/$Width;
      $ii = $MaxHeight/$Height;
      $proportion = ( $i < $ii ) ? $i : $ii;
   }
   $newwidth = intval( ( $Width * $proportion ) + .5 );
   $newheight = intval( ( $Height * $proportion ) + .5 );
}
if( isset($_GET['render']) )
{
   $URLofImage = $_GET['url'];
   $Width = $_GET['oW'];
   $Height = $_GET['oH'];
   $Mime = $_GET['oMime'];
   $newwidth = $_GET['newwidth'];
   $newheight = $_GET['newheight'];
   $imageType = preg_replace('!^.*/!','',$Mime);
   $ta = explode('.',$URLofImage);
   $sourceExtension = array_pop($ta);
   if( $sourceExtension == 'jpg' and $imageType == 'jpeg' ) { $imageType = 'jpg'; }
   header("Content-type: $Mime");
   $thumb = imagecreatetruecolor($newwidth, $newheight);
   $source;
   switch($imageType)
   {
      case 'png' : $source = imagecreatefrompng($URLofImage); break;
      case 'gif' : $source = imagecreatefromgif($URLofImage); break;
      case 'jpeg': case 'jpg': $source = imagecreatefromjpeg($URLofImage);
   }
   #$thumb = imagescale($source,$newwidth,$newheight);
   imagecopyresized($thumb, $source, 0, 0, 0, 0, $newwidth, $newheight, $Width, $Height);
   switch($imageType)
   {
      case 'png' : imagepng($thumb); break;
      case 'gif' : imagegif($thumb); break;
      case 'jpeg': case 'jpg': imagejpeg($thumb);
   }
   imagedestroy($thumb);
   exit;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Image Thumbnail Maker</title>
<style type="text/css">
html, body { font-size:100%; font-family:arial, sans-serif; }
body { margin:50px 25px 100px 25px; }
input, textarea { width:100%; box-sizing:border-box; font-family:arial, sans-serif; }
input[type=text], textarea { border:1px solid #999; border-radius:5px; padding:5px; font-size:1em; }
#content { max-width:500px; 
   margin:0 auto; 
   background-color:transparent; 
   padding:25px; 
   border:1px solid #ccc;
   border-radius:7px;
   box-shadow:0px 0px 3px 0px #999; 
   position:relative; 
   box-sizing:border-box; 
   }
.bold { font-weight:bold; }
.nowrap { white-space:nowrap; }
</style>
</head>
<body>
<div id="content">
<form method="post" enctype="multipart/form-data" accept-charset="utf-8" action="<?php echo(htmlspecialchars($_SERVER['PHP_SELF'])); ?>">
<h1 style="margin-top:0; text-align:center; z-index:22;">Image Thumbnail Maker</h1>
<div style="position:absolute; left:-25px; top:-25px; margin-right:15px; z-index:1;">
<a href="//www.willmaster.com/">
<img src="data:image/gif;base64,R0lGODlhMgAyAOYAAEub4KzQ8fn7/FWh4pnG7WKbzdvb21OGsom965ubm7za89fX16LM77PV8uPj41yk45HC7GSp5YWFhVZ4lSKE2Xy152pqa4S66nKw5kOX3+3t7fHx8Xi051OVzaqqqi2K2zqR3aGhoev0/EaJw3p6eqfO8Gus5Wqh0lua0Y2jtr6+vjaQ3TOO3M3NzX646dHl90t8p8TExJbE7MLd9bHF13ykxoOpyvT5/ZvH7urq6uXx+6m6yBd+18bY6FRmdZezzM/k9rGxsY7A69vr+VGe4Xay53OYuTyIynSp2LzT5vX19W2u5pmuv8nh9pu714eYp9bo+IWy2l2g28zj9jCM26rQ8E2RzDyS3T6U3nWz6DaP3dTn92SQtjp/uxqA2GGGp0WY4C+M22er5fD3/eHu+ieH2kWX31xcXC+L21KPw5K/5oO35Ia55ECCu52/3ZKUll6Anqius3eIl5bE6snU3s7f7l5hY3ex47a3uOvy9zKJ1DmQ2p+xwWCm4kCV3v///yH5BAAAAAAALAAAAAAyADIAAAf/gH+Cg4SFg2MNGAMZPI08GQMYDWOGlZaXgzo4AzwDCAwBL1tbLwEMCJwDODqYrZVQYmUROFNAtre4tlM4EWViUK6uIktaLk3HyMnKyi5aJiLBlg0UJjPW19jZ2tcmFA3RhAIcABAK5ufo6erpEAAcAuA3Aw8N9fb3+Pn69Q8DN8E3ADwIQLCgwYMIExp8AOAfJgFEBjCYSLGixYsYLw4gAu8SBiI4QoocSbKkyZNEMFxq4AeCy5cwY8qcSdOln2+GxpRZgqCnz59Agwod2nNJGWiFxIBxwdRFgxlCmjKYwaCpkBkNmjZFUGKGLaxRtTIFIKYQlDJF0qYd8keNWgV//xqoJfBniNq0CjoW2oLgbtoyWwhFALCkcOEhG6IY/ubEMIQ/NAxnYSUohwEDOQbdQGC4MIAIg8jwiEC69BADSEo3UGKjtJA/O0rD/dPijYXbEjwYEJRnSWnSPMgIErLigfHjUBacOB5gg43jF/7wMR79jwoLE1AYl2IEjwMBGmgcN77i9R8sAAaoX5/8xPoqzte7kK4emgMSB9avR+JAiQMVfegHABZ/6OAFAAgmCMAWCxSQYAkb1JAgB38w4Y4gQUygoIJN/GGABw4q6IUOVZQBxokogvHCAiigyIASNaCYRYVgyPCHAAkckGKKNjoQQgE7llEFB2j4YeSRfrxgAP8KRzLwhw1HqsSEH05qkEAaSCLZ4xtYIokGBwOgAcKYZIIAxAZSkFnFH1GQSWEKIODwhwYhWFFmmUDQRsIId6IxgBZUrCDooCt8M8egrNQxaAMOcLGCnBoEgQKhg8r5RwJ2ULoCFVpQQAULoIbKQgUb5EGAJB4u0EAEJdwQwggs0LVBDMb9RgBbfyxAwhGigkoFBTyEIeyww/6gQgsGxPDGAW+oYEALCUwgrKwt9DGFJS2kQSyxjaDh7bfgpvEFHDDogcYRB8AxQRvf2jirFNf+scEGGsy7gQM07AHut15Q8MG+317RwD9TuICGC9fe0MAV3toYqRUpJCABCRTn1oL/BkrUAcK+H5TBwr8AX8GKA7v9AZcGC2jwBxQN/5HDq0e00cXMXcDwRRAGCLCBGxyzQEQZVAQtNBWv8XEEFScooUEcI1BhBR0OIEEFXTkk0PTQQndgwAY5tODH0GUQkYXHvbIwQw5phJqECl+EyoYDNsTq8qtlhypnDngUIGoZWVRBgaYrTGGAFZW24KigYijBxKNzEw74CmVFerigFJRg4J1jArFAB2Ti4IARZJpQYZyNYx76jR5wUeaIf1wBQpZJstikBjVEWSGVc3cA+5EV/KFEAl8cOeZwH5hh/PEronA8AxEeX0SFZlTpgfLHV2/GDB5KcMDxH5gn2oYLNvhg/4QTVghACXPicQL46c0Wgh0KBjdIBCsQYb/9DJ5wP4Q13N87H0RA36zuAIESGNCAW3AIHiwAg/uBADSDgAIF9DMAKLTAPeoJQA5qIB8BMGEAAfiDA2JQAWAYIgcesIAP9EOBwBBCDMU5Th2CsBzjBCAGRjgOAhbwhIE4wANvQEIP7mWABbRABSEgwRkmMB4QlKUQOiFCaXYggROUxg0JMEJp1uABOUQAixY4QwGeIIHbWMAOZ/DBBArwm58hpRANYIEJ5kjHOtrxjnjM4xxZgJNKYAALGAikIAdJyEIa8pCAfAgRMsCBRjrykZCMpCQjmQGOtCIgSxGLJjfJSbGAoYchABkAGC5AylKa8pSoTCUpwUAEhwRDAH/kCVFmGZQlAFIv4AgABYgghF768pfADKYviUCBEIKjECIwARoiUJNmQiACaHjGMS3xgj5QAAAYgIAMtsnNbm4TAhgAAAX68IJptkITnPBDBIrgAgK4kwAuKEIE/NCJVZgTHIhQBCMcAQlJUGKagQAAOw==" 
style="width:50px; Height:50px; border:none; outline:none;" 
alt="Willmaster logo" 
name="Willmaster.com logo">
</a>
</div>
<?php if($Error): ?>
<div style="border:3px double red; padding:15px; color:red;">
<?php echo($Error); ?>
</div>
<?php endif; ?>
<?php if($Image): ?>
The thumbnail image is below and may be saved to your computer or device. (If the thumbnail width is larger than the width of the control panel, the browser might display the image to fit; but the image will save with the dimensions it was generated as.)
</p>
<iframe 
   id="iframe-for-image" 
   style="padding:0; width:100%; height:<?php echo(intval($newheight+20)); ?>px; border:none;"
   src="<?php echo($_SERVER['PHP_SELF']); ?>?render=1&newwidth=<?php echo($newwidth); ?>&newheight=<?php echo($newheight);?>&url=<?php echo($_POST['url']); ?>&oW=<?php echo($Width); ?>&oH=<?php echo($Height); ?>&oMime=<?php echo($Mime); ?>">
</iframe>
<p class="bold" style="margin-top:.25in;">
The Form:
</p>
<?php endif; ?>
<p>
URL of image.<br>
<input type="text" name="url" value="<?php echo(htmlspecialchars(@$_POST['url'])); ?>">
</p>
<p style="margin-bottom:5px;">
At least one of the maximum... fields needs to be filled in. Specify number of pixels.
</p>
<table style="margin-left:1em; border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="padding-right:.25em; white-space:nowrap;">Maximum width.</td>
<td><input type="text" name="width" style="width:60px;" value="<?php echo( (isset($_POST['width']) and intval($_POST['width'])>0) ? intval($_POST['width']):''); ?>"></td>
</tr>
<tr>
<td style="padding-right:.25em; white-space:nowrap; padding-top:5px;">Maximum Height.</td>
<td style="padding-top:5px;"><input type="text" name="height" style="width:60px;" value="<?php echo( (isset($_POST['height']) and intval($_POST['height'])>0) ? intval($_POST['height']):''); ?>"></td>
</tr>
</table>
<p style="margin-bottom:1em;">
<input type="submit" name="submit" value="Make Thumbnail">
</p>
</form>
<div style="position:relative; top:1em; left:-1em; margin-left:7em; text-indent:-7em;"><p style="margin:0;">
Copyright 2016 <a href="//www.willmaster.com/">Will Bontrager <span class="nowrap">Software LLC</span></a>
</p></div>
</div>
</body>
</html>

The above 4 steps are all you need to do to have Image Thumbnail Maker handy for whenever you need it.

The Image Thumbnail Maker software has this requirement: The GD module must be installed on your server so PHP scripts can use it. I've found that most PHP installations do have the module installed. If you're unsure, create a page named test.php with this one line of content:

<?php phpinfo(); ?>

The Image Thumbnail Maker control panel is responsive to browser and device width. So you'll be able to use it on any desktop and device with the latest versions of popular browsers.

Keep it handy for spur-of-the-moment image downsizing.

(This article first appeared in Possibilities ezine.)

Will Bontrager

Was this article helpful to you?
(anonymous form)

Support This Website

Some of our support is from people like you who see the value of all that's offered for FREE at this website.

"Yes, let me contribute."

Amount (USD):

Tap to Choose
Contribution
Method

All information in WillMaster Library articles is presented AS-IS.

We only suggest and recommend what we believe is of value. As remuneration for the time and research involved to provide quality links, we generally use affiliate links when we can. Whenever we link to something not our own, you should assume they are affiliate links or that we benefit in some way.

How Can We Help You? balloons
How Can We Help You?
bullet Custom Programming
bullet Ready-Made Software
bullet Technical Support
bullet Possibilities Newsletter
bullet Website "How-To" Info
bullet Useful Information List

© 1998-2001 William and Mari Bontrager
© 2001-2011 Bontrager Connection, LLC
© 2011-2024 Will Bontrager Software LLC