Jump to content
  • Checkout
  • Login
  • Get in touch


The e-commerce.

'On the Fly' Auto Thumbnailer using GD Library


Recommended Posts

I added a watermark. :) I used the watermark feature in the "On The Fly Images 1.0 - Watermark and Thumbnail Generation" contribution. Works great... it uses .htaccess to redirect all .jpg access through a .php page which automatically merges in my watermark. This is the best way because no matter what process tries to access the images, the watermark will always be added.


And it works great with your thumbnailer contrib... the watermarks aren't added to the thumbnails at all. :)


Thanks again, it works GREAT!

Link to comment
Share on other sites

  • Replies 313
  • Created
  • Last Reply

Top Posters In This Topic

Hi everyone, I'm a new poster here as well although I've been reading for some time. I too am having problems getting this contrib to work and decided to see if anyone could offer assistance. Thanks for the many replies to others issues as it has helped to narrow the problem.


I have a test image in the following catalog: http://www.rusticcountryfurniture.net/catalog. The thumbnail is still the same file size as the orig. at 54K. Right click on the image and it still displays the orig file name also. (test.jpeg)


If I type the URL in manually the thumbnailer works properly. http://www.rusticcountryfurniture.net/cata...peg&w=120&h=100. File size is 3K and the name has been appended correctly. product_thumb.php appears to be functioning correctly.


Scratching my head I decided to check the html_output file to see if the function was being called. One at a time in a few places I added a letter to the code to produce a syntax error to see it the tep_image function was being called. Every time the function broke with an error. This line is one of the ones I changed as an example:

$image = '<img src="product_thumb.php?img='.$src.'&w='.intval($width).'&h='.intval($height).'" border="0" alt=" ' . htmlspecialchars(StripSlashes($alt)) . ' " title=" ' . htmlspecialchars(StripSlashes($alt)) . ' "';


A couple of things I noticed:


If I change the thumb width or height to be "0" in admin the thumb image is displayed at the same physical size as the orig. (640x480). I must have both values added to produce a thumb.


In the product_thumb file setting the bg colors makes no difference.


In the tep_image function setting "border=1" in the first $image assignment line causes all images including logos and corners to have a border.


In contrast in the second assignment line the "border=1" setting has no effect. The strange part is, as stated above, this line breaks the function if modified. So this line is being parsed but the function is not producing any result.


Server config:


RedHat 7.3

PHP 4.3.8

gd is installed Version = bundled (2.0.23 compatible)

OSC is ms2

PHP display errors = on

Calculate image size = true

Require image = true


Flushed my cache here several times also just to be certain it wasn't pulling files locally.


Sorry for the long post but it's easier to throw it all at 'ya at once! Any other suggestions would be greatly appreciated. This is a nice contrib Nate and I would like to have it functional if possible. Anything else to try?


Thanks! - Drew

Link to comment
Share on other sites

I'm at a bit of a loss, only to say check the troubleshooting info in prior post - your product page is not referencing the image through the product_thumb.php script, but rather directly. For some reason the scaling is not being called... Try the about troublehsooting techniques (esp. the "dont calculate variable:), etc...


The other items you mentioned are all normal for various reasons...

** Please do not PM with personal support requests (even if offering "payment"). Thank you.

Link to comment
Share on other sites

Thanks for replying so quickly Nate!


I had changed the file to a jpeg as part of the orig troubleshooting, I was trying everything. Changed it back to jpg again.


I explicitly set $dont_calculate to "0" - Didn't make a difference


I then explicitly set the "Generate the thumbail on the fly" code to:


$image = '<img src="product_thumb.php?img=test.jpg&w=100&h=100" border="0"';


No change.....hmmmmm So I started stepping through the if...then's to see what was working and what wasn't, by echoing the $don't calculate var which is returning a "0"


The first nested if statement (shown below) in which the code above is located in, is not true


if ($image_size = @getimagesize($src)) {


in this case $image_size is null. Tested it by changing the above to:


if (!$image_size) {

echo ("this works")


I echoed $src and it is the right file:




I echoed the folowing: echo (@getimagesize($src)) it returns as null


if both are null why isn't the if statement true? Should both be null to begin with? That's all I have for now, I'll look at it again tonight. Thanks for the help and suggestions!


- Drew

Link to comment
Share on other sites

if ($image_size = @getimagesize($src)) {


I thought IF statements are supposed to use use "==" to see if something is equal to something else? Although my code also uses just "=" and my installation works fine.


Not sure if this will help you but in my Admin > Images settings I have:


small width: 150

small height: 120

heading width: 90

heading height: 60

subcat width: 60

subcat height: 40

calc image size: true

image req: true


Then the images I upload for my products are all 500 x 400 px. .jpg files. In my store, the "thumbnails" are correctly sized at 150 x 120 (tested this by downloading them and checking the size) and when I click "Enlarge Image" they are 500 x 400.


The product_thumb.php file is in my /catalog/ folder, and I replaced the tep_image() function in html_output.php like the instructions say. Here's what function looks like:


function tep_image($src, $alt = '', $width = '', $height = '', $params = '') { 
? ?if (($src == '' || $src == 'images/') && IMAGE_REQUIRED == 'false') { 
? ? ? ?return; 
? ?} 

? ?$image = '<img src="' . $src . '" border="0" alt=" ' . htmlspecialchars(StripSlashes($alt)) . ' ?" title=" ' . htmlspecialchars(StripSlashes($alt)) . ' "';

? ?if ((strstr($width,'%')!='') || (strstr($height,'%')!='')) { 
? ? ? $dont_calculate = 1; 
? ?} 

? ?if (CONFIG_CALCULATE_IMAGE_SIZE && (!$width || !$height) && !$dont_calculate) { 

? ? ? ?if ($image_size = @getimagesize($src)) { 

? ? ? ? ?if (!$width && $height) { 
? ? ? ? ? ? ? ?$ratio = $height / $image_size[1]; 
? ? ? ? ? ? ? ?$width = $image_size[0] * $ratio; 
? ? ? ? ? ?} elseif ($width && !$height) { 
? ? ? ? ? ? ? ?$ratio = $width / $image_size[0]; 
? ? ? ? ? ? ? ?$height = $image_size[1] * $ratio; 
? ? ? ? ? ?} elseif (!$width && !$height) { 
? ? ? ? ? ? ? ?$width = $image_size[0]; 
? ? ? ? ? ? ? ?$height = $image_size[1]; 
? ? ? ? ? ?} 
? ? ? ?} elseif (IMAGE_REQUIRED == 'false') { 

? ? ? ?return ''; 
? ? ? ?} 
? ?} 

? ?if (CONFIG_CALCULATE_IMAGE_SIZE && !$dont_calculate) { 

? ? ? ?if ($image_size = @getimagesize($src)) { 
? ? ? ? ? ?$ratio = $image_size[1] / $image_size[0]; // real ratio 
? ? ? ? ? ?$orig_width = $image_size[1];
? ? ? ? ? ?$orig_height = $image_size[0];

? ? ? ? ? ?// do we need scaling 
? ? ? ? ? ?if ($image_size[0] > $width || $image_size[1] > $height) { 
? ? ? ? ? ? ? ?$rx = $image_size[0] / $width; 
? ? ? ? ? ? ? ?$ry = $image_size[1] / $height; 

? ? ? ? ? ? ? ?if ($rx < $ry) { 
? ? ? ? ? ? ? ? ? ?$width = $height / $ratio; 
? ? ? ? ? ? ? ?} else { 
? ? ? ? ? ? ? ? ? ?$height = $width * $ratio; 
? ? ? ? ? ? ? ?} 
? ? ? ? ? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ?// Generate thumbnail on the fly
? ? ? ? ? ? ? ?$image = '<img src="product_thumb.php?img='.$src.'&w='.intval($width).'&h='.intval($height).'" border="0" alt=" ' . htmlspecialchars(StripSlashes($alt)) . ' " title=" ' . htmlspecialchars(StripSlashes($alt)) . ' "';
? ? ? ? ? ?}
? ? ? ?} 
? ?} 
?if (!$dont_calculate) {
? ? $width = intval($width);
? ? $height = intval($height); ? ?

? ?if ($width && $height) { 
? ? ? ?$image .= ' width="' . $width . '" height="' . $height . '"'; 
? ?} 

? ?if ($params != '') { 
? ? ? ?$image .= ' ' . $params; 
? ?} 

? ?$image .= '>'; 

? ?return $image; 

Edited by ChrisW123
Link to comment
Share on other sites

I thought IF statements are supposed to use use "==" to see if something is equal to something else? Although my code also uses just "=" and my installation works fine.

You are absolutely correct Chris... That may be what's tripping some folks up on this contrib (though I'm not clear as to why "some" and not "all")....



if ($image_size = @getimagesize($src))

Was actually carried over from the *original* tep_image function which reads the same way... :blink: It seems to checking for "true" or "false", though, based on if PHP is able to assign $image_size that value, thus the double equal wouldn't necessarilly be appropriate here.


Perhaps those of you having difficulty could try changing

if ($image_size = @getimagesize($src)) {

to this:

if (@getimagesize($src)) {
   $image_size = @getimagesize($src);

That *might* do it... Remember it appears in *two* places in the function. If that does it, lemme know and I can mod the original contrib...

** Please do not PM with personal support requests (even if offering "payment"). Thank you.

Link to comment
Share on other sites

if ($image_size = @getimagesize($src)) {


I can't tell from looking at the code whether the IF statement should do a comparison (you would use "==") or should do a boolean check (using "="). Maybe one of the creators of osCommerce who wrote this part of the code would know if it should be "==" or "=".


Or someone who is familiar with this section of the code would also be able to tell which is right. I'm not very familiar with it, nor do I know PHP well at all. :) I know C# so that's how I spotted the "=" / "==" thing.



Link to comment
Share on other sites

Hey guys thanks for your time and suggestions!


I copied and pasted the function code Chris posted just to make sure I didn't change something by accident. That didn't work. I changed the "if" line to the two seperate lines Nate posted. That didn't work.


That's funny that you had mentioned the "==" issue Chris. I had thought the same thing where "==" Should be used for comparison. Of course I changed it and it crashed too. :rolleyes: I use several languages and I keep getting the syntax mixed up, so I thought I screwed up again.


I don't know about getting this thing to work, I'm running out of options! I'm on a mission though and am not ready to throw in the towel yet! This is a nice contrib and I would like to solve this problem.


Thanks again!


- Drew

Link to comment
Share on other sites

Drew here's something else to do:


1) Concentrate your attention on this line in the tep_image() function:


// Generate thumbnail on the fly

$image = '<img src="product_thumb.php?img='.$src.'&w='.intval($width).'&h='.intval($height).'" border="0" alt=" ' . htmlspecialchars(StripSlashes($alt)) . ' " title=" ' . htmlspecialchars(StripSlashes($alt)) . ' "';


It's the piece of code that is supposed to redirect your image through the thumbnail processing. Add some debug stuff, etc., to see why it isn't handling the image.


2) This has tripped up a lot of people (me included).... Check all functions and contribution code that you paste into your .php for TAB characters. They will cause problems and the code won't work sometimes. So for every line in the tep_image() function, use your Del key to remove all leading chars from each line and then use spaces to get the lines back into alignment. In particular I noticed in the readme.txt file that the line above was indented a LOT with tab characters probably.


Give it a try!

Link to comment
Share on other sites

One other thing if the 2 steps above don't work.... I noticed your image settings in admin for "small image width/height" are 100 x 80 (or something) and I've read somewhere that "100x100 or smaller may cause...". So since my install works and my settings are 150x120, try setting yours the same for a test to see if it makes a diff.


Good luck.

Link to comment
Share on other sites

I'm also having some problems getting the OnTheFly contribution to work. I'm sure it's something I'm doing, since I'm a hack when it comes to programming :P


If anyone can help, I would GREATLY appreciate it. Here's an example of a product which needs rescaling:



running product thumb directly seems to work...



But the image in the product_info.php is still distorted. I deleted product_thumb.php, and I do not get an error. So, somehow product_thumb.php isn't being called?


Here's the relevent part of product_info.php:

   if (tep_not_null($product_info['products_image'])) {
         <table border="0" cellspacing="0" cellpadding="2" align="left">
             <td align="center" class="smallText">
<script language="javascript"><!--
document.write('<?php echo '<a href="javascript:popupWindow(\\\'' . tep_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $product_info['products_id']) . '\\\')">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>



The changes to html_output.php are exactly as outlined in release 1_2




Link to comment
Share on other sites

You can right-click and check your image properties to see if the thumbnailer is being called, which it isn't... See Chris W. suggestions above and others in this post for things you can try...


Given the relatively straightforward comparison in the updated tep_image functon, how it is possible it is *not* called for some people is quite beyond me :huh:

** Please do not PM with personal support requests (even if offering "payment"). Thank you.

Link to comment
Share on other sites



I hate to do this, but I am having trouble getting GIF images to thumbnail.


On my development box (XP, PHP 4.3.7, GD "bundled (2.0.23 compatible) "), it all works fine.


On my host (Linux of some description (!), PHP 4.1.2, GD "2.0 or higher"), GIFs don't thumbnail at all, full size images are fine.


Image properties indicate that product_thumb is being called correctly.


GIF files exist, with correct case (yes, I got caught by that old chestnut!).


My guess is that GD isn't quite 2.0+ enough - is there any way of getting a bit more info from it?


Thanks for a great contrib.



Link to comment
Share on other sites

Well, I found the problem, but I'm not sure how to fix it.


This is what comes out of the tep_image function when trying to resize:



This is what actually works:



It looks like the directory being appended to the $src file is not correct

(/shop/images/... vs. images/....)


Anybody know how I can fix this?


in product_info.php:

tep_image(DIR_WS_IMAGES . $product_info['products_image'], .......


So, DIR_WS_IMAGES seems to be the culprit. I don't know where to go from here.



Link to comment
Share on other sites

Well I tried everything I could think of. I did narrow down the problem to this evaluation returning false. (Note: This is the two line modified version Nate posted earlier. )


if (@getimagesize($src)) {

$image_size = @getimagesize($src);


If you do a search on PHP getimagesize you'll find quite a bit of reading on how for some reason on certain versions of PHP getimagesize isn't returning the image size correctly or at all. I believe this is my problem also, the values are simply not there.


I found a post in another forum that someone found a work around for this. I copied the code but haven't hade the time to implement it. I'll paste is here if someone can find it useful.


function get_file_ext( $filename ) {
     ereg( ".*\.([a-zA-z0-9]{0,5})$", $filename, $regs);
    return( strtolower($regs[1]) );

function sgetimagesize($filename) {
$ftype_array = array(".gif"=>"1", ".jpg"=>"2", ".jpeg"=>"2", ".png"=>"3", ".swf"=>"4", ".psd"=>"5", ".bmp"=>"6");
$filename = substr($filename, 1);
echo (is_file($filename));
  if (is_file($filename)) {
echo ($filename);
      $fd = @fopen($filename,"r");
      $image_string = fread($fd,filesize($filename));
      $im = ImageCreateFromString($image_string);
      $ftype = $ftype_array[get_file_ext($filename)];
      $gis[0] = ImageSX($im);
      $gis[1] = ImageSY($im);
      $gis[2] = ($ftype?$ftype:"0");
      $gis[3] = "width={$gis[0]} height={$gis[1]}";
      return $gis_array;
  else { return false; }


Thanks again for the suggestions!


- Drew

Link to comment
Share on other sites

Found the problem and fixed it. It's so simple I feel like banging my head off of the desk. I just didn't notice it till now. Okay here we go .....


The image path is wrong! <_<


When doing some testing by echoing the $src var everywhere I noticed the path of the language flag icons did not match the path of the images we're trying to thumbnail.


Path to flag: includes/languages/english/images/icon.gif

Path to image: /catalog/images/test.jpg


Solution: Strip the "/catalog/" from the path


Insert this line after the two main evaluation lines:


$src = substr($src, 9);


Should look like this:


if (CONFIG_CALCULATE_IMAGE_SIZE && (!$width || !$height) && !$dont_calculate) {

$src = substr($src, 9);




if (CONFIG_CALCULATE_IMAGE_SIZE && !$dont_calculate) {

$src = substr($src, 9);



To see if this is your problem just place this echo statement as the first line in the function. This will display all of your image paths above the image.


echo ($src);



Works fine now! Thanks again guys!


- Drew

Link to comment
Share on other sites

Just added this If statement at the top of the function to replace the two individual lines as listed in the previous post:


if (substr($src, 0, 9) == '/catalog/') {     // replace "catalog" with your root osc directory name
  $src = substr($src, 9);


Nate, I don't know if you would want to add this to the source or not?


- Drew

Link to comment
Share on other sites

Nate, I don't know if you would want to add this to the source or not?

I'm not sure... the apparent problem some folks are having is that the portion that calls the image via the thumbnailer (product_thumb.php) is not being executed...


The only conditions where the scaling/thumbnailing should not be executed is if the width & height of the current image is smaller than the "small image" values set in admin (thus, no scaling necessary), if the image width or height is specified (as in store logo, box images, etc...) or if the image is specified as a % width or height (as is transparent & black line images).


If the image path *were* wrong, that would certainly cause the scaling/thumbnailing not to be executed at this line:

if ($image_size = @getimagesize($src)) {

But I think thats an issue of misconfiguration in your store, with respect to either the catalog path or the image path specified in includes/configure.php.


If either of you (or others having a problem) want to indulge me and check your config values to see if they're set right

define('DIR_WS_HTTP_CATALOG', '/catalog/');
define('DIR_WS_HTTPS_CATALOG', '/catalog/');
define('DIR_WS_IMAGES', 'images/');

These aren't the settings they should be - just the relevant lines (bobaliu, yours should say '/shop/'), and if not, set them and see if the original tep_image function works out...


Thanks for checkin' that out, drewski.. I was really at a loss as to how it could *not* work for some people (provided they had the right version of GD installed)... At the very least, it'll go in as a troubleshooting tidbit in the readme...

** Please do not PM with personal support requests (even if offering "payment"). Thank you.

Link to comment
Share on other sites

Nate, here are the lines from the configure.php file.


define('DIR_WS_HTTP_CATALOG', '/catalog/');

define('DIR_WS_HTTPS_CATALOG', '/catalog/');

define('DIR_WS_IMAGES', '/catalog/images/');

define('DIR_WS_ICONS', '/catalog/icons/');


FYI I never made any mods to these lines this is the way the store configured itself.


- Drew

Link to comment
Share on other sites

That's very strange, because the default entries I have from a fresh unzip of osC 2.2 MS2 is:

  define('DIR_WS_HTTP_CATALOG', '');
 define('DIR_WS_HTTPS_CATALOG', '');
 define('DIR_WS_IMAGES', 'images/');

(I assume you're using the most recent version of osCommerce, since it's a new store?) The above entries would be appropriate if you were running the catalog from your website's root directory, which you are not.


At any rate, your entries appear to be incorrect, since all images referenced in the catalog are referenced *relative* from the catalog root path (which would be just "images/" and not "/catalog/images")


Could you do me a favor, drewski, and replace your values with the following, and then see if the mod works (right-click t/n image to confirm)

  define('DIR_WS_HTTP_CATALOG', 'catalog/');
 define('DIR_WS_HTTPS_CATALOG', 'catalog/');
 define('DIR_WS_IMAGES', 'images/');

The above values assume you have a trailing slash after your server address. Optionally, replace your modded version of the modded tep_image with the original - (though I think it would render your mod moot!)...


The trouble some folks have been having may be as simple as a store misconfig ;)

** Please do not PM with personal support requests (even if offering "payment"). Thank you.

Link to comment
Share on other sites

Hi I?m setting up a store and i?m looking for a contribution that associates product images to attributes.

i.e.: a product has very colors, and i want an image for each one, so when a customer select a color the image of the product changes on the fly to the image whith the color selected.


I also want that the color attribute is shown as a bar whith images for each color.


I found two useful contributions, but not exactly what i need:

Options as images (a contribution that allows to assign an image to each of the products options values)

"On the fly" Auto Thumbnailer using DG that creates thumbails but It not associattes the images to the attributes.



can anyone help me?

Link to comment
Share on other sites

Join the conversation

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

Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  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...