Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

LastLine

macrumors 65816
Original poster
Aug 24, 2005
1,313
21
Hey all,

So I'm working on a way to produce a image hoesting website (For personal use only here) and I'm having trouble creating a straight forward gallery now.

Needs:
To Thumbnail images
To link said thumbnails to another page of some sort showing a large image.
To be easily updated on a daily basis - shouldn't involve re-writing a whole page each time I want to add a single photo.
To be cheap/free

Ideals:
To be able to tag photos - like in a blog, so someone could say click a link that says "Flowers" and the site displays all the flower images.
To allow commenting and/or rating of the photos


Can anyone help me out here?
 
Erm if you have PHP theres a really easy way of doing this, i hope you have some skills in coding?

Ive attached a PHP file which opens a specified thumbs folder, in your case this would be a "/thumbs" folder I guess.

It then searches that folder for any images (.jpg), displays them, and when clicked it will then display the image (must have same filename as thumb) but from a pictures folder , "/pictures".

you should see the print loop in the file, this is pretty easy to modify to exactly what you need if you do want to make it custom.

PHP:
<?php
$thumb_dir="thumbs";
$image_dir="images";

print
	$dir=opendir($thumb_dir);
	$img_string= array();
	while ($file=readdir($dir))
	{
		if(substr($file, -3) == "jpg" || substr($file, -3) == "jpeg" )
		[
			$tmp_str =
					'<p>
					<a href="'.$image_dir.'/'.$file.'">
					<img src="'.$thumb_dir.'/'.$file.'"/>
					</a>
					</p>';					
			array_push($img_string, $tmp_str);
		}
	}
	sort($img_string);
	for($i=0; $i<count($img_string); $i++)
	{
		print $img_string[$i];
	}
closedir($dir);
?>

Other than that check sites like www.HotScripts.com , they are usually great for things like this.

hope i was of some help :)
 

Attachments

  • portfolio.php.zip
    431 bytes · Views: 79
I have some basic (but developing) PHP skills so I'll give this a go - I've never installed php onto my Mac though (or do I even have to? lol I've always used the university machines for test runs so far)

I'll give it a go!

Edit: Ok yeah, that looks logical and makes sense, now I've just got to figure out hwo to install php on OS X - my web hosting has yet to be confirmed payment wise.
 
I have some basic (but developing) PHP skills so I'll give this a go - I've never installed php onto my Mac though (or do I even have to? lol I've always used the university machines for test runs so far)

I'll give it a go!

Edit: Ok yeah, that looks logical and makes sense, now I've just got to figure out hwo to install php on OS X - my web hosting has yet to be confirmed payment wise.

yeh i think an Apache server comes built into osx so installing php shouldnt be too much hassle.
 
Ok yeah, definitely having trouble installing php on OS X, anyone give me a complete step by step here? Have found some on sites but nothing that's in complete basic.

Arrgh, this is something I actually find easier on Windows :confused:
 
I've installed a PHP app called "Gallery 2" for a production site, that allows customers to upload photos through the web, and be able to view it on their DSL/IP based TV service. Works really well. of course, we modified things on our own to make the publish to the TV, but 'out of the box' it does everything you need, and has a good support community.

Gallery Website

As I'm sure you know by now, there are tons of options out there for you. I'd say find the one with the community support.
 
Ok, so it's getting somewhere now - I've used what you suggested yargan, and it seems to work - just two questions for you.

With what's in the $tmp_str, I assume I can basically stick a whole html page, complete with CSS in there if I like?

Secondly, why do I get this rescource ID message at the top of the page?

http://www.nofearspunk.com/index.php

and finally, I found a JS lightbox script I used, but I've never managed to get javascript to work in pages generated via PHP - is this even doable?

Thanks for all your help so far people :)
 
An update:

I've found a gallery that does the job for me very nicely - www.clarkephotography.co.uk

Just a few trimings to add to the proverbial turkey.

The code used to display the thumbnails is as follows

Code:
<?php
/*************************************************
 * Micro Photo Gallery
 *
 * Version: 1.0
 * Date: 2007-04-05
 *
 * Usage:
 * Just copy these files into your image folder
 *
 ****************************************************/

 $columns     = 5;
 $thmb_width  = 120;
 $thmb_height = 80;

function resizeImage($originalImage,$toWidth,$toHeight){
    
    // Get the original geometry and calculate scales
    list($width, $height) = getimagesize($originalImage);
    $xscale=$width/$toWidth;
    $yscale=$height/$toHeight;
    
    // Recalculate new size with default ratio
    if ($yscale>$xscale){
        $new_width = round($width * (1/$yscale));
        $new_height = round($height * (1/$yscale));
    }
    else {
        $new_width = round($width * (1/$xscale));
        $new_height = round($height * (1/$xscale));
    }
    // Resize the original image
    $imageResized = imagecreatetruecolor($new_width, $new_height);
    $imageTmp     = imagecreatefromjpeg ($originalImage);
    imagecopyresampled($imageResized, $imageTmp, 0, 0, 0, 0, $new_width, $new_height, $width, $height);

    return $imageResized;
} 

function generateThumbnails(){
	global $thmb_width,$thmb_height;
	
	// Open the actual directory
	if ($handle = opendir(".")) {
		// Read all file from the actual directory
		while ($file = readdir($handle))  {
			// Check whether tha actual item is a valid file
			if (is_file($file)){
				// Check whether the actual image is a thumbnail
	      		if (strpos($file,'_th.jpg')){
	      			$isThumb = true;
	      		} else {
		      		$isThumb = false;
		      	}
	      	
	      		if (!$isThumb) {
		      		// Process the file string
	      			$dirName  = substr($file,0,strpos($file,basename($file)));
	      			if (strlen($dirName) < 1) $dirName = '.';
	      			$fileName = basename($file);
	      			$fileMain = substr($fileName,0,strrpos($fileName,'.'));
	      			$extName  = substr($fileName,strrpos($fileName,'.'),
	      								strlen($fileName)-strrpos($fileName,'.'));
  					
	      			// Check if the actual file is a jpeg image
	      			if (($extName == '.jpg') || ($extName == '.jpeg')){
			    		$thmbFile = $dirName.'/'.$fileMain.'_th.jpg';
			    		// If a thumbnail dosn't exists tahn create a new one
			    		if (!file_exists($thmbFile)){
				    		imagejpeg(resizeImage($file,$thmb_width,$thmb_height),$thmbFile,80);
				    	}
					}
	      		} 
	   		}
   		}
	}
	
}

function getNormalImage($file){
	$base = substr($file,0,strrpos($file,'_th.jpg'));
	if (file_exists($base.'.jpg')) return $base.'.jpg';
	elseif (file_exists($base.'.jpeg')) return $base.'.jpeg';
	else return "";
}

function displayPhotos(){
	global $columns;
	generateThumbnails();
	$act = 0;
	// Open the actual directory
	if ($handle = opendir(".")) {
		// Read all file from the actual directory
		while ($file = readdir($handle))  {
			// Check whether tha actual item is a valid file
			if (is_file($file)){
				// Check whether the actual image is a thumbnail
	      		if (strpos($file,'_th.jpg')){
					++$act;
					if ($act > $columns) {
						echo '</tr><tr><td class="photo"><a href="'.getNormalImage($file).'"><img src="'.$file.'" alt="'.$file.'"/><br>'.$file.' </a></td>';	
						$act = 1;
					} else {
						echo '<td class="photo"><a href="'.getNormalImage($file).'"><img src="'.$file.'" alt="'.$file.'"/><br>'.$file.' </a></td>';	
					}
	      			
	      		}
	      	}
		}
	}	
}

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<html>
<head>
   <title>Micro Photo Gallery</title>
   <link href="style/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
  <div id="main">
    <div class="caption">Ray's Gallery</div>
      <table align="center"><tr>     
    		<?php displayPhotos(); ?>
      </table>		
    		
	<div id="source">Ray's Gallery - Work in Progress.</div>
  </div>
</body>

Which does a very nice job - currently I'm using <br>'.$file.' to display in the table a copy of the pictures filename, however the _th.jpg is rather annoying, can a nyone think of a way looking of the code, of displaying the filename, but say stripping it of the last 7 characters of the string? So rather than displaying pic1_th.jpg it displays pic1.


Thanks for all the help so far!
 
can a nyone think of a way looking of the code, of displaying the filename, but say stripping it of the last 7 characters of the string? So rather than displaying pic1_th.jpg it displays pic1.

Thanks for all the help so far!

sorry i took ages to reply.
erm, stripping characters is done like so,

PHP:
$trimname = substr($file, 0, -7);
where -7 is the number of characters to trim.

and then use:
PHP:
<br>'.$trimname.'

-------------------
example:
PHP:
$file = "pic1_th.jpg"
$trimname = substr($file, 0, -7);
Print $trimname;
would print:
HTML:
pic1

it that what you wanted?

hope that helps
 
Nope - don't apologise - that looks perfect, I'll go play with it before moving onto my next task.

(That is creating a page where a user can upload one or more files to a folder on the ftp via html/php)
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.