How to make your own PHP image gallery

 
Post new topic   Reply to topic    Aprelium Forum Index -> Tutorials
View previous topic :: View next topic  
Author Message
loloyd
-


Joined: 03 Mar 2006
Posts: 435
Location: Philippines

PostPosted: Sun Mar 11, 2007 4:28 pm    Post subject: How to make your own PHP image gallery Reply with quote

The following code has been described "AS IS" with no warranties nor guarantees implied, and has been expressly shared by me on my own free will and volition to the entire Internet community through this forum. I am releasing this code with no claims as to copyright except for the claim of being the first one ever to manage, develop and publish an image gallery SPECIFICALLY in this manner and fashion.

Before anything else, some of you might think that this is yet another PHP image gallery implementation. You are right. But, I developed this image gallery for my specific purposes at the time I'm learning PHP. I've been quite satisfied so far. I've seen other image galleries, Coppermine, Gallery by Menalto and SPGM, or other image display methods like Lightbox (and derivatives). I was happy with Lightbox once, but when the core of my CMS platform updated (Drupal), Lightbox implementation became... let's say messy as of this writing. More historical background about this development can be seen here: http://www.loloyd.com/blog/my_own_php_gallery

OK, enough intro. Here are the caveats, installation requirements and feature discussions.

1. You must have a working PHP installation and a webserver, preferrably Abyss - of course!
2. This gallery does not support databases, nor commenting systems.
3. You need to create your own thumbnails. ImageMagick http://www.imagemagick.org/script/index.php can help you with this.
4. This has been tested to work nicely well (and I'm proud of that fact) in Linux/Apache and Windows/Abyss environments, as standalone files or embedded in CMS content platforms.
5. My PHP is quite a bit n00bish, although I've been developing software applications and systems in other languages for 23 years, so I just let experience do the dirty work. You can definitely do some mods/tweaks with my code like adding functions for redundant code segments - but in this case, my longer code MAY perform somewhat faster.
6. You need to arrange and organize your images in album directories. And your thumbnails should sit in similar directory trees but if you can understand what you're doing and you're sensible enough, this will be a cinch.
7. This gallery implementation features "just-in-place" functionality. You can embed several albums in a single page and the code will be page-location aware. I am making this a big deal because when I realized I could do this, it looked awesome with my Drupal installation.
8. The entire code is pretty small. You need to copy and paste it on a standalone PHP file, or on a PHP-enabled content platform. See to it that you have pasted the entire thing without improper word wraps on your target code-holder.
9. Edit the Settings Section, save and do your tests.
10. We can discuss your implementation problems here or from my website. Have fun!

For more information, visit http://www.loloyd.com/blog/my_own_php_gallery. For sample implementations, visit http://photos.loloyd.com/.

An offsite/cross-domain version is also available from my website - this was realized due to my specific situation (cross-domain implementation) and utilizing IFrames was quite a pain (also blogged in my website).

Code:
<?php
//--- Settings Section Begin ---//
//$img_path value must NOT end with '/'.  It should indicate the filesystem path to your photoset album.
$img_path = "M:\\photos\\public\\2007\\album_name";
//$web_path must end with '/'.  It should indicate the webserver directory address of your photoset album.
$web_path = "/photos/2007/album_name/";
//$web_paththumbs must end with '/'.  It should indicate the webserver directory address of your thumbnails for this photoset album.
$web_paththumbs = "/thumbs/2007/album_name/";
//$img_anchor allows the browser to scroll down automatically to the thumbnails set or the image when given a unique name value.  This is especially useful in Drupal (or other CMS) installations where you might be displaying multiple photosets on a single page.  Non-critical if incorrectly implemented.
$img_anchor = "photoset";
//$img_array describes the types of filename extensions that will be treated as images.
$img_array = array('.jpg', '.gif', '.png', '.JPG', '.GIF', '.PNG');
//$img_perline must be greater than 1.  This is the number of thumbnails per line or row listing.
$img_perline = 4;
//$img_perpage must be in multiples of $img_perline.  This is the maximum number of thumbnails displayed for a given page on this photoset album.
$img_perpage = 16;
//$img_maxwidth indicates the maximum width a zoomed-in image may occupy inside the browser window.
$img_maxwidth = 640;
//$width_table is the table width suggestion for thumbnails list; normally overridden by css; you can write in styles like "480", 480, "100%" or 100%.
$width_table = 480;
//$width_td is the cell width suggestion for thumbnails list; normally overridden by css; you can write in styles like "115", 115; I am not sure if percentages can be implemented here.
$width_td = 115;
//--- Settings Section End ---//

$env_script = $_SERVER["REQUEST_URI"];

if (isset($_GET['imgindex'])) {
  $imgindex = $_GET['imgindex'];
  $env_script =  ereg_replace("\?imgindex=(.*)$", "", $env_script);
} else {
  $imgindex = 0;
}
if (isset($_GET['imgpage'])) {
  $imgpage = $_GET['imgpage'];
  $env_script =  ereg_replace("\?imgpage=(.*)$", "", $env_script);
} else {
  $imgpage = 1;
}
$img_files = array ();
$open = opendir ($img_path);
while ($img_file = readdir ($open)) {
  if ($img_file != "..")
    if ($img_file != ".")
      if (in_array(strtolower(substr($img_file, -4)),$img_array)) array_push($img_files, $img_file);
}
echo 'There are currently '.count($img_files).' images in this photoset.<br />'."\n";
$imgpages = ceil(count($img_files) / $img_perpage);
if ($imgindex < 0 || $imgindex > count($img_files)) $imgindex = 0;
if ($imgpage < 1 || $imgpage > $imgpages) $imgpage = 1;
if ($img_perline < 1) $img_perline = 1;
if ($img_perpage < $img_perline) $img_perpage = $img_perline;
while ($img_perpage % $img_perline != 0) $img_perpage++;
if ($imgindex == 0) echo "You are viewing thumbnails page <a name='$img_anchor'>$imgpage</a> of $imgpages.\n";
while (list($xxxkeyxxx, $xxxvaluexxx) = each($img_files)) {
  $xxxkeyindexxxx = $xxxkeyxxx + 1;
  if ($imgindex > 0) {
    if ($imgindex == $xxxkeyindexxxx) {
      echo "You are viewing image number <a name='$img_anchor'>$imgindex</a>. $xxxvaluexxx<br />\n";
      echo "<a href='$web_path$xxxvaluexxx'><img border=0 width=$img_maxwidth src='$web_path$xxxvaluexxx' /></a>\n";
      if (count($img_files) > 1) {
        echo "<table border=0 cellspacing=0 cellpadding=5>\n";
        echo "<tr valign=top align=center>\n";
        if ($imgindex > 1) {
          $xxxkeyindexpreviousxxx = $xxxkeyindexxxx - 1;
          $xxxkeypreviousxxx = $xxxkeyxxx - 1;
          echo "<td><a href='$env_script?imgindex=$xxxkeyindexpreviousxxx#$img_anchor'>Previous</a><br />";
          echo "<a href='$env_script?imgindex=$xxxkeyindexpreviousxxx#$img_anchor'><img border=0 src='$web_paththumbs$img_files[$xxxkeypreviousxxx]'></a><br />";
          echo "$xxxkeyindexpreviousxxx. <a href='$env_script?imgindex=$xxxkeyindexpreviousxxx#$img_anchor'>$img_files[$xxxkeypreviousxxx]</a></td>\n";
        }
        $imgpage = ceil($imgindex / $img_perpage);
        echo "<td><a href='$env_script?imgpage=$imgpage#$img_anchor'>Return to thumbnails index</a><br />\n";
        echo "Go to thumbnails page";
        $i = 1;
        while ($i <= $imgpages) {
          echo " <a href='$env_script?imgpage=$i#$img_anchor'>$i</a>";
          $i++;
        }
        echo "</td>\n";
        if ($imgindex < count($img_files)) {
          $xxxkeyindexnextxxx = $xxxkeyindexxxx + 1;
          echo "<td><a href='$env_script?imgindex=$xxxkeyindexnextxxx#$img_anchor'>Next</a><br />";
          echo "<a href='$env_script?imgindex=$xxxkeyindexnextxxx#$img_anchor'><img border=0 src='$web_paththumbs$img_files[$xxxkeyindexxxx]'></a><br />";
          echo "$xxxkeyindexnextxxx. <a href='$env_script?imgindex=$xxxkeyindexnextxxx#$img_anchor'>$img_files[$xxxkeyindexxxx]</a></td>\n";
        }
        echo "</tr></table>\n";
      }
    }
  } else {
    if (ceil($xxxkeyindexxxx / $img_perpage) == $imgpage || $xxxkeyindexxxx / $img_perpage == $imgpage) {
      if ($xxxkeyindexxxx % $img_perline == 1) {
        echo "<table border=0 cellspacing=0 cellpadding=0 width=$width_table>\n";
        echo "<tr valign=top align=center>\n";
      }
      echo "<td width=$width_td>";
      echo "<a href='$env_script?imgindex=$xxxkeyindexxxx#$img_anchor'><img border=0 src='$web_paththumbs$xxxvaluexxx'></a><br />";
      echo "$xxxkeyindexxxx. <a href='$env_script?imgindex=$xxxkeyindexxxx#$img_anchor'>$xxxvaluexxx</a></td>\n";
      if ($xxxkeyindexxxx % $img_perline == 0 || $xxxkeyindexxxx == count($img_files)) {
        echo "</tr></table>\n";
        if ($xxxkeyindexxxx / $img_perpage == $imgpage || $xxxkeyindexxxx == count($img_files)) {
          echo "<table border=0 cellspacing=0 cellpadding=5><tr>\n";
          $imgpageprev = $imgpage - 1;
          $imgpagenext = $imgpage + 1;
          if ($imgpage > 1) echo "<td><a href='$env_script?imgpage=$imgpageprev#$img_anchor'>Previous page of thumbnails group</a></td>\n";
          echo "<td>Go to thumbnails page";
          $i = 1;
          while ($i <= $imgpages) {
            echo " <a href='$env_script?imgpage=$i#$img_anchor'>$i</a>";
            $i++;
          }
          echo "</td>\n";
          if ($imgpage < $imgpages) echo "<td><a href='$env_script?imgpage=$imgpagenext#$img_anchor'>Next page of thumbnails group</a></td>\n";
          echo "</tr></table>\n";
        }
      }
    }
  }
}
?>

_________________

http://home.loloyd.com/ is online if the logo graphic at left is showing.
Back to top View user's profile Send private message Visit poster's website
loloyd
-


Joined: 03 Mar 2006
Posts: 435
Location: Philippines

PostPosted: Fri Apr 20, 2007 3:47 am    Post subject: Reply with quote

Updates!

Slideshow functionality has been added. Picasa Web API has also been added. There are so many options to choose from now.

Design your own PHP image gallery - start with any of these:

1. Single domain or offsite galleries with slideshow
http://loloyd.com/blog/my_php_gallery_with_slideshow

2. Fused with Picasa Web API
http://loloyd.com/blog/igs_picasaweb_api
_________________

http://home.loloyd.com/ is online if the logo graphic at left is showing.
Back to top View user's profile Send private message Visit poster's website
aprelium
-


Joined: 22 Mar 2002
Posts: 6800

PostPosted: Mon Apr 23, 2007 5:07 pm    Post subject: Reply with quote

loloyd,

Thanks for the contribution.
_________________
Support Team
Aprelium - http://www.aprelium.com
Back to top View user's profile Send private message Send e-mail
mikeon
-


Joined: 27 Apr 2007
Posts: 2

PostPosted: Thu May 03, 2007 1:41 pm    Post subject: Reply with quote

Quote:
Design your own PHP image gallery - start with any of these:


Is there any PHP script which can allow me create a similar gallery as http://www.irisize.com :oops:
_________________
MIKE
Back to top View user's profile Send private message
loloyd
-


Joined: 03 Mar 2006
Posts: 435
Location: Philippines

PostPosted: Thu May 03, 2007 3:11 pm    Post subject: Reply with quote

mikeon wrote:
Is there any PHP script which can allow me create a similar gallery as http://www.irisize.com :oops:


ajax? i don't think so. but the demos in irisize all look pure javascript to me. i guess you can emulate their javascript and put them on your pages for your use. be aware though that they explicitly say it's "optimized for ie on windows" though.



http://www.irisize.com/image/optimized.gif
_________________

http://home.loloyd.com/ is online if the logo graphic at left is showing.
Back to top View user's profile Send private message Visit poster's website
milanna
-


Joined: 19 Aug 2010
Posts: 2
Location: Šīńńč’

PostPosted: Tue Sep 07, 2010 4:32 pm    Post subject: How to make your own PHP image gallery Reply with quote

I was going to, but instead I sent them a message referring to this post to see if they would like to make a "loop patterns" section.
When I get an answer I will post it. Thank you anyway
Back to top View user's profile Send private message Send e-mail ICQ Number
Display posts from previous:   
Post new topic   Reply to topic    Aprelium Forum Index -> Tutorials All times are GMT + 1 Hour
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB phpBB Group