[Update: see end of page for added feature in new version!]
PXSWBPGS? What is it?
It's a VERY simple php script that provides you with a web based picture gallery.
All you have to do is some one-time minimal configuration, like setting your email address and trivial stuff like that.
All you need is FTP access to your website's web server which should support php.
One of the main goals of the application (besides being a picture gallery script!), is to be, and remain, SIMPLE. There are many VERY good free picture gallery applications out there, but they are all rather complicated to install and maintain.
I realize I can add all kinds of neat bells and whistles to the script, but my main goal is to keep things extremely simple and configuration to a minimum, so that one can have a picture gallery up and running in, approximately, the time it takes you to upload the pictures.
If you need more sophistication, go ahead and add it!
What does it cost?
It's completely free, and it's open source, so you can do with it what you want. (Just don't claim authorship of it)Couldn't you have called it something simpler than PXSWBPGS?
Yes.How to prepare pictures for uploading
All pictures in the gallery are first compressed and converted to a certain fixed width (landscape) or height (portrait).
I usually use 1024 pixels for the full size pictures and 150 for the thumbnails.
The script relies on both the full size picture and the thumbnail to have the same name, followed by a dash (-) and then a unique identifier, for which I use the size (1024 or 150 in my case).
So, for example, if I have an image called img00666.jpg, I will create two compressed and resized pictures: img00666-1024.jpg and img00666-150.jpg.
These last two files will then be uploaded, each to their own directory called after the 'size' of the pictures (1024 and 150 in this case, respectively).
This compressing, converting and renaming is done by a free neat utility that I will discuss later. It dramatically simplifies the above process.
I realize I could have made this script even simpler to use by having it create the thumbnails automatically, but I instead chose for my own 'pre-processing' because of the dramatic superiority of the forementioned utility with regards to quality and file size!
Quick Installation Guide
(A more detailed example will follow these steps)- Download the zip file HERE (select 'pxswbpgs', or 'pxswbpgs-no-example' if you're not interested in the example pictures (MUCH smaller!))
- Unzip the files, modify the variables that you want changed at the beginning of the index.php script
- Create a new directory at the server.
Note: the name of this directory will also be the name of your gallery.
Put underscores where you want the script to display spaces and a [ where you want a comma. - Upload (FTP) index.php and style.css to the newly created directory on your server, along with a picture that you want to use as frontpage image for your gallery.
- Create one or more directories under the newly created gallery directory: each one of them constitutes an 'album'.
Same 'underscore=space' and '[=comma" rules apply. - Under EACH 'album' directory create two directories, one for the full size pictures and one for the thumbnails. For now, call them '1024' and '150', just to get a feel for how this works.
- Upload your full size pictures (*-1024.jpg) and thumbnails (*-150.jpg) to their respective directories and albums.
If you do this right every set of 1024 and 150 directories has the same filenames except for the suffix (-1024 versus -150). Simply browse to your top level gallery directory and check the result.
So, what program do you use for compressing and resizing?
[Update: Since I wrote this guide, I have found a nice windows based picture resizer that works great. It lets you combine resizing and renaming in one step .. I can really recommend it: it's freeware too, and you can download it HERE!]I use an extremely easy to use and free tool that creates VERY compressed images with an amazing quality and you can download it HERE.
There are quite a few nifty things you can do with it, so I encourage you to read the advanced settings page.
But to keep things simple: download the program, place it on your desktop, and rename it (for now) to 'resize1024.exe'.Whenever you drag a jpg file over this icon, it will create a picture, compressed and resized to a picture with a width of 1024 pixels (landscape! A portrait oriented picture would now have a height of 1024 pixels). The important thing to remember is that the numeric part of the icon's NAME determines the dimensions of the picture. Now go ahead and copy/paste that desktop icon as another icon, and rename that one to 'resize150.exe'. Guess what IT will create! (Yes, your thumbnails)
Detailed example
The downloaded zip file also contains 5 pictures, which are not part of the application, but can be used in the following example 'tutorial'.Suppose you want to create a gallery called "Vacation, December 2007", with two albums called "Day 01" and "Day 02".
Preparation
- Compress and resize your pictures using the above mentioned resizer program. Create two versions of each picture: one with size 1024, the other with 150.
- (you can skip this step if you don't care about quality, or your pictures are already perfect)
Pimp up your pictures, using photo editing software.
If you're looking for a rather sophisticated program that has a very simple, yet powerful, 'fix picture in one step' function, which, as a bonus, can also be executed automatically on any number of pictures in a batch command: I can really recommend Corel Paint Shop Pro X2.
This is also where you may have to rotate pictures to their proper orientation. - Customize index.php.
Installation
- Use FTP to connect to youur server and create a directory called "Vacation[_December_2007".
Under that directory, create two more directories called "Day_01" and "Day_02".
Under EACH of those two directories, create two directories called "1024" and "150". - Copy the files index.php, style.css and fp.jpg (from the downloaded zip file) to the newly created top-level directory.
- Copy pictures a1-1024.jpg and a2-1024.jpg to the 1024 directory inder "day_01".
Copy pictures b1-1024.jpg and b2-1024.jpg to the 1024 directory inder "day_02".
Copy pictures a1-150.jpg and a2-150.jpg to the 150 directory inder "day_01".
Copy pictures b1-150.jpg and b2-150.jpg to the 150 directory inder "day_02". - That's all! Browse to your "Vacation[_December_2007" page!
To see how it should look like: go HERE - Feel free to alter the file style.css for different colors and layouts.
- Pictures will be shown in alphabetical order. Since most digital camera pictures are named with a fixed pre-fix and a sequence number, they will, by default, be shown in the order they were taken. You can change the order by properly renaming pictures.
Update: New version: added feature
Version 1.1 (now at the FTP site: see below) has a new feature:You can now add captions to any full sized picture by adding an ASCII text file called 'caption.txt' to the gallery's root directory.
For every picture that you want a caption displayed for, enter a line in this file, starting with the name of the picture file, followed by an equal sign (=), followed by the caption.
Keep the entire caption for one picture on one line! You can insert <br />'s for line break control.
You can change the size and color of the caption (and add other attributes if desired) in the style.css file: look for name ".caption".
You can also look at the provided sample (and sample page) to see how this works.
Download the zip file HERE (select 'pxswbpgs').
If you have any questions or remarks, drop me an email.
If you like the product, feel free to help me with the cost of hosting this site:
If desired, I will acknowledge your donation on this site.