Best Sellers / new product thumbs jagged!

[EdHarrison]

Just gone over to SPP and its great but theres an unexpected change to the best sellers and new products images...

The images for the best sellers / new products are now mini versions of the full images but they are resizing out of sync in other words very jagged.

With the sections how they are now the best sellers / new products are no longer using the square thumbnails from the subsections but mini versions of the full image product. The code shows they are 80 pixels but there is no hint of the height, maybe because they are not square it is stretching them, any help appreciated.

Thanks Ed

[NormanRouxel]

Actinic either shows images full size which is no problem. Or (for the mini images) with a fixed width which causes them to be resized by the browser. Hence the jaggies (browsers are lousy at resizing images). It's always been this way.

You would need to use PHP (and it's GD image library routines) to take the full size images and create thumbnails. There's an article in the Advanced guide that you may be able to adapt for this.

[EdHarrison]

ouch, thanks..things were fine when the thumbs were taken from the products square thumbs but now they come from the subsection they are awful. I will take a look but will probably have to sacrifice SPP or look at making the full size images square and hope they dont suffer too much in the scale down.

thanks Ed

[RuralWeb]

Your double posting - Ive just answered the same question on your other thread. Can you remove one or people will stop answering your questions

[EdHarrison]

Sorry I moved it to general as it was drifting off topic from the SEO thread.

Ive removed the thread from SEO, forgive my enthusiasm as I'm still learning the peculiarities of forum behaviour.

[NormanRouxel]

See the V9 Advanced Guide, approx page 74 - "Automatically Rescale Your Product Images to a Certain Size".

[EdHarrison]

Norman, thank you I have found it and working on it, one point confuses me where the last part explains that the extra line can be included to best sellers and new products but does not say where to put the line in the code?

[NormanRouxel]

Here's how to amend that Advanced Guide article to do what you want.

Create a folder within your Site folder called "Thumbnails".

In your Mini Best Sellers Layout and Mini New Products Item, replace the line

<img style="border: 0;" src="<actinic:variable name="ProductImageFileName" />" width="75" alt="<actinic:variable name="ProductName" encoding="strip"/>" />

with

	<actinic:block php="true" >
	// START Create a thumbnail image t_nn_ProductImageFileName - V 1.04
		$nScaledWidth = 75; 		// scaled image width
		$sOriginalImageName = str_replace('\\','/', '<actinic:variable name="ProductImageFileName" encoding="perl" selectable="false" />');
		$sThumbImageName = 'Thumbnails/t_' . $nScaledWidth . '_' . basename($sOriginalImageName);
		list($width, $height, $imagetype, $imageattr) = getimagesize($sOriginalImageName);
		switch ($imagetype) 
			{
			case 1:
				$image = @imagecreatefromgif($sOriginalImageName); // Attempt to open GIF
				break;
			case 2:
				$image = @imagecreatefromjpeg($sOriginalImageName); // Attempt to open JPG
				break;
			case 3:
				$image = @imagecreatefrompng($sOriginalImageName); // Attempt to open PNG
				break;
			default:
				$image = NULL;
			}
		if (!$image) 
			{ // tell what failed
			echo "<br><font color=red>Thumbnail creation error opening: $sOriginalImageName </font>";
			}
		else
			{
			// Get new dimensions
			$t_width = $nScaledWidth;
			$t_height = round($height * ($t_width / $width));
			// Resample
			$thumbimage = imagecreatetruecolor($t_width, $t_height);
			imagecopyresampled($thumbimage, $image, 0, 0, 0, 0, $t_width, $t_height, $width, $height);
			if ( ! imagejpeg($thumbimage, $sThumbImageName) ) 
				{
				echo "<font color=red>Thumbnail creation error saving: $sThumbImageName </font><br>";
				}
			else
				{
				echo "<img src=\"$sThumbImageName\" width=\"$t_width\" height=\"$t_height\" border=\"0\"";
				echo ' alt="' . htmlspecialchars('<actinic:variable name="ProductName" encoding="perl" selectable="false" />') . '" />';
				}	
			}
 	// END Create a thumbnail image t_nn_ProductImageFileName
 	</actinic:block>

Change the line

$nScaledWidth = 75; // scaled image width

to suit the width you want.

[EdHarrison]

Norman, thanks it sadly comes up with a coding error - doubtless me somewhere (line 28 parse)

I will carefully re do the entire process and check again, many thanks.

[NormanRouxel]

Ed,

Please start again using the code above afresh, as I've just amended it to allow it to be used on Best Sellers / New Products, etc with different sizes for each.

I've tested it here and it works fine in my sidebar Best Sellers list.

[NormanRouxel]

Another update (V1.03). Fixed quotes in the product name (e.g. Lid 5" dia) would cause error.

[EdHarrison]

Great thanks, I need to sort out the images as some are gifs so Im changing them over, the ones that have worked look excellent!

Im concerned that I already have a folder called thumbnails in my images folder?

thanks again

[EdHarrison]

Norman - you are a genius and have saved my Sunday! I need to sit and change lots of stuff to tidy it up but it looks superb!

Ed

[NormanRouxel]

Updated yet again (V1.04). Now works with GIF, JPG and PNG images.

[EdHarrison]

Norman, now I can be lazy and not convert to jpegs but will do so as I think I heard somewhere they are preferred for some reason.

All is looking very nice with only two clicks to the product with SPP in place and no need for pop up pages, excellent.


Next task is worrying about SEO on the homepage where actinics links are mainly CGI and Google prefers text and links.....