PDA

View Full Version : Generate thumbnails automatically


Codicus
11-6-01, 01:02 PM
Here's a neat bit of PHP code that I wrote for my web site to automatically generate thumbnails for uploaded images. The thumbnail filename will have a t_ prepended. The $path variable should be set to the path where your files are to be stored.


//only accept jpg files
if(strtolower(substr($imagefile_name, -4)) == ".jpg")
{
$filename = $path . $imagefile_name;
$thumbfile = $path . "t_" . $imagefile_name;

//Copy the uploaded file
if(move_uploaded_file($imagefile, $filename))
{
//Create an image for the thumbnail of the size I want
$dest = ImageCreate(150, 113);
//Load the full size image
$src = ImageCreateFromJPEG($filename);

//Copy the full size image to the thumbnail and resize it
ImageCopyResized($dest, $src, 0, 0, 0, 0, 150, 113, ImageSX($src), ImageSY($src));

//Write out the thumbnail
ImageJPEG($dest, $thumbfile);

//Set the file permissions
chmod($filename, 0644);
chmod($thumbfile, 0644);
}
}


If you're not familiar with file upload forms the html code to do so is below. The code above would be in the uploadimage.php action below.


<form enctype=multipart/form-data action=uploadimage.php method=post>
<input type=hidden name=MAX_FILE_SIZE value=150000>
Image Filename: <INPUT NAME=imagefile TYPE=file>
<input type=submit value="Upload Image">
</form>
9

count
12-14-04, 12:58 AM
I would like to see what they look like on you site


thanks

:)

B&T
12-14-04, 03:56 PM
Here is one with a little more flexibility in file types and will resize based on a max size for either dimension keeping the right aspect ratio (no hard coding of sizes):

http://prettyworthless.com/tips.php?tip=resize#tip

B&T
12-14-04, 04:00 PM
This watermark script is another variation on the theme, in case you would like to see more php image examples:

http://prettyworthless.com/tips.php?tip=watermark#tip

bddotnet
4-18-05, 11:52 PM
What if you already have thumbnails and you put them on a page and you want the full size image to display when the user clicks on the thumbnail? Is it just easier to link the thumbnail image to the larger one?

B&T
4-19-05, 10:37 AM
What if you already have thumbnails and you put them on a page and you want the full size image to display when the user clicks on the thumbnail? Is it just easier to link the thumbnail image to the larger one?
That would be the way, but you can still use the generated thumbnail script rather than have two images, or downloading and scaling down the larger one in the browser.

bddotnet
4-19-05, 06:20 PM
I already have thumbnails of each image created. I would like to have it where when the user clicks on an image, it generates a page with the full size image and a description of the image. Could I possibly do this with a MySQL database or just create the individual pages?

www.crusaderleather.com/archery.php
www.crusaderleather.com/artwork.php
www.crusaderleather.com/medieval.php

Skunkboy
4-19-05, 06:29 PM
heh - funny - it's a subject I've been tryin' to figure out for quite some time. Here's PicPick... somewhat in action but with "issues." http://skunkboy.net/test_dylan/

RTH10260
4-19-05, 11:14 PM
I already have thumbnails of each image created. I would like to have it where when the user clicks on an image, it generates a page with the full size image and a description of the image. Could I possibly do this with a MySQL database or just create the individual pages?
This is a small demopage that shows how you need to code a popup window using a thumbnail of an image. Build your webpage by multiplying the HTML code. If you don't like all those window.open functions, move that common part into a nice Javascript function, just add the URL (or only the filename if the path is common) as parameter.<html><head>
<title>Show a Thumbnail with click for full size</title>
</head><body>
<center>
<a href="javascript:window.open('http://img.photobucket.com/albums/v161/RTH10260/DSC00043.jpg','FullView','top=100,left=100,width=7 00,height=500,resizable=yes,scrollbars=no,location =no,menubar=no,status=no,toolbar=no'); void('');">
<img src="http://img.photobucket.com/albums/v161/RTH10260/th_DSC00043.jpg">
</a>
</center>
</body></html>

Ref: window.open function for IE http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/open_0.asp