Gallery picture

[Matpatnik]

Hi guys, I need to know how to display a gallery, something simple but with those specification:

• 9 pictures thumbnails which are not the same as the original: 3 rows by 3 cols
• at the bottum of the page it will show all the link of the next page that contain a maximum of 9 pictures
• when clicking on the picture it display the original picture with all it's information (I think I can figured this one)

It's a very basic gallery that I would like to create but I have no idea where to start.I don't even know how to display something in a 3x3 table without repetision Thank you

[justsomeguy]

Is it a database-driven gallery? Where do the images come from, are they files? Have you set anything up for this yet?

[Matpatnik]

Is it a database-driven gallery?

All the picture name are stored in the database by the id number ex: 1 == 1.jpg (original) and 1.gif (thumb)

Where do the images come from, are they files?

They are all stored in specific folder, each section contain it's own set of picture

Have you set anything up for this yet?

No, I have no idea how to start. I gess I can start to learn how to display the picture 3x3 in a table

[MrAdam]

It's simple to display 3 x 3 table:ie.

<table> <tr>  <td><img src="#" /></td>  <td><img src="#" /></td>  <td><img src="#" /></td> </tr> <tr>  <td><img src="#" /></td>  <td><img src="#" /></td>  <td><img src="#" /></td> </tr> <tr>  <td><img src="#" /></td>  <td><img src="#" /></td>  <td><img src="#" /></td> </tr></table>

(As i'm sure you're aware)To output this with php you need to use a loop. create a variable to store the column number, and create an 'if' to check if it's last in row... eg:

print '<table>';while ($rows = mysql_fetch_array($query)) { if (x == 1) {  print '<tr>';  print '<td><img src="{$rows['url']}" /></td>';  x++; } elseif (x==2) {  print '<td><img src="{$rows['url']}" /></td>';  x++; } elseif (x==3) {  print '<td><img src="{$rows['url']}" /></td>';  print '</tr>';  x = 1; }}print '</table>';

.. Just an example, there's probably a number of ways of doing it.

[Matpatnik]

Nice I didn't think of that, simple enough

[Matpatnik]

ok it work good and I did managed the link to the originalThe code look like this now

$sql = "SELECT images_id, images_name 		FROM images 		ORDER BY images_lastmod DESC		LIMIT 9";$result = mysql_query($sql)	or die (mysql_error());echo "<table>";$x = 1;while ($row = mysql_fetch_array($result)) {	if ($x == 1) {		echo "<tr>\n";		echo "<td><a href=\"picture.php?action=3&id=" . $row['images_id'] . "\">			  <img src=\"../images/3/thumbs/" . $row['images_id'] . ".gif\" alt=\"" . $row['images_name'] . "\" border=\"0\" /></a></td>\n";		$x++;	} elseif ($x == 2) {		echo "<td><a href=\"picture.php?action=6&id=" . $row['images_id'] . "\">			  <img src=\"../images/6/thumbs/" . $row['images_id'] . ".gif\" alt=\"" . $row['images_name'] . "\" border=\"0\" /></a></td>\n";		$x++;	} elseif ($x == 3) {		echo "<td><a href=\"picture.php?action=1&id=" . $row['images_id'] . "\">			  <img src=\"../images/1/thumbs/" . $row['images_id'] . ".gif\" alt=\"" . $row['images_name'] . "\" border=\"0\" /></a></td>\n";		echo "</tr>\n";		$x = 1;	}}echo "</table>";

Now how do I do the link at the bottum of the page?ie: if I have 100 picture I will have 12 pages including the one we are on

[jlhaslip]

Google for a "pagination" script. Try hotscripts.com.Larry Ullman has a book about "dynamic Websites" which has a good php pagination script.

[Matpatnik]

Hey thank you I didn't know the english term, I'll take a look at that tomorow morning

[MrAdam]

for in case on the last page there is an unfitting number of images (eg. 5) you should create some kind of save (otherwise the table may mess up because the <tr> wasn't closed right and the columns don't match.

print '<table>';$total = mysql_count_rows($query);$y = 1;$x = 1;while ($rows = mysql_fetch_array($query)) { if ($x == 1 && $y < $total) {  print '<tr>';  print '<td><img src="{$rows['url']}" /></td>';  $x++; } elseif ($x == 1 && $y == $total) {  print '<tr>';  print '<td><img src="{$rows['url']}" colspan="3" /></td>';  print '</tr>';  $x++; } elseif ($x == 2 && $y < $total) {  print '<td><img src="{$rows['url']}" /></td>';  $x++; } elseif ($x == 2 && $y == $total) {  print '<td><img src="{$rows['url']}" colspan="2" /></td>';  print '</tr>';  $x++; } elseif (x==3) {  print '<td><img src="{$rows['url']}" /></td>';  print '</tr>';  $x = 1; }$y++;}print '</table>';

- I haven't checked it, last time I did it sloppy and forgot $ on the x variable; there still could be errors with it - but it should be fool proof.

[Matpatnik]

Thank you MrAdam I didn't think about this situation

[PrateekSaxena]

See this DHTML Gallery, It is very nice you can use some of them they are open source!

[Matpatnik]

Thank you Prateek but it's not what I'm looking for. I find a code at http://lampgeekz.netgeekz.net/ but there is some part missing, I will try to find a more complet code with more explanation.

[PrateekSaxena]

Alright, Best of Luck

[Lengo]

These are great answers. But one thing:How do you obtain image size? Will calling the inage tag without dimensions give the image the proper dimensions? Or must I keep that info in the database?Forgive me for being ignortant, but I'm simply exhausted and have no energy to test it. Thanks.

[PrateekSaxena]

I think you can just set a particular height for the image and the width changes accordingly in ratio with the other size without srewing up the image!

[justsomeguy]

You can leave off the height and width on an image tag and it will display the image at normal size. If you want to get the size of an image using PHP, you can use this function:http://www.php.net/manual/en/function.getimagesize.phpIf you want to resize the image using PHP, look into the image functions. There is an example on resizing an image here:http://www.php.net/manual/en/function.imagecopyresampled.php

[TheHamburgler]

Hi,Great answers, I'm also having a problem with displaying images in PHP.I'm holding image names in a table and selecting one at random to be displayed. I can construct and display a string of the image location combining the base image directory and image name. When i try and insert this into the <img scr"" /> i get nothing I'm pretty new to php and probably doing something stupid but it's driving me nuts!

// Define the base image dir$base_img_dir = "images/";// Select a random row from table$sql = "SELECT image		FROM votes		ORDER BY Rand()		LIMIT 1";// Pass random row to variable$result = mysql_query($sql)	or die (mysql_error());//while ($row = mysql_fetch_array($result)){// This image, directly linked displays okecho '<img src="images/Image.jpg" />';// This line displays the image path ok eg. "images/Image.jpg"echo $base_img_dir."{$row[image]}";// But when I combine the two I just get the image place holder! It cant seem to locate the imageecho '<img src=" $base_img_dir . "{$row[image]}" " />';}

[Mr_CHISOL]

Hi!You have just put the var. names in a string so PHP ignores them, and treats them simply as a string (that sounded fuzzy), so the output will look like this:

<img src=" $base_img_dir . "{$row[image]}" " />

There are two ways to do what you want:Use single quotes and "concat" the string:

echo '<img src="' . $base_img_dir . $row[image].'" />'; // No need for the curly brackets

Or you can use double quotes (which I don't prefer in this case):

echo "<img src=\"$base_img_dir{$row[image]}\ " />";

Here we could put the variables directly in the string, but we neede to escape the quotes (\")..Hope that helped.Good Luck and Don't Panic!

[TheHamburgler]

Great! thanks a lot, I'd just found a work around by sticking the array value into another variable, $img = $row[image]; and using that but you're solution is a lot cleaner.