Create CMS Website

Photo gallery

The Beginner's Tutorial
How To Create Own Website with CMS Made Simple

Photo gallery

Add a sophisticated photo gallery on your website with module Album. Upload image files, select between different built-in templates and your gallery is ready to use.

Features of module Photo Albums

  • Create and edit albums
  • Create and edit album categories
  • Add up to 3 descriptions to one image
  • More than 10 different ready-to-use templates to display your albums
  • Show random images
  • Show recently updated images

There are more than 10 templates built in the module for your convenience.

Live photo galleries made with CMS Made Simple

Below you can see how some of standard templates look like (click on the link below the picture) and how they are used in live websites (click on the picture):


You do not need any special knowledge to use above templates as they are.

Still there are no limits for your creativity. The below examples show standard templates that have been customized. You have a full control about the appearance of your gallery with HTML templates.


To install the module In the admin panel select Extensions → Module Manager and choose on the tab "Available modules". Find module Album and click on "Download & Install". The module is successfully installed and can be used now.

Upload photos

This module can display all images uploaded to your website in the folder uploads/images and sub-folders. It means that you can upload your images with module itself or Image Manager or even FileZilla (FTP) if you have a bunch of them.

To keep your image folder clean and clear go to admin panel and select Content → Image Manager. Type album In the field "Create New Folder" and press "Create". Folder is created. You can upload your images right here, one by one. But if you have a lot of images you better open FileZilla and upload all the files with FTP.

Attention! For images uploaded with FTP thumbnails are *NOT* created automatically. To ensure that thumbnails are created before you add images to the gallery, you open Content → Image Manager and then the folder where the images are saved. Image Manager will recognize all the files and creates automatically missing thumbnails.

To create first album in the admin panel go to Content → Photo Albums. Click on "Add an Album" and type in album title in the field "Name" (e.g. My Photos). Press "Submit". A new album is created. Start to assign images to the newly created album. Click on "Add pictures" at the bottom of the page. On the next page you see the content of uploads/images folder and sub-folders. Click on the folder album if you uploaded your images into this folder. You have to see the list of images. You can also upload images one by one at the bottom of this page by selecting pictures for the album in the field "Upload a picture" and pressing "Upload".

It does not matter how you upload your images: with Image Manager, FileZilla or direct within module Album. They are always saved in the folder uploads/images or sub-folders and can be displayed in one or more albums.

Select images that you would like to assign to your album with check box in front of each image or click the link "Select all" below the list to select all images. Then press "Save" at the bottom right. All selected images are now associated with the album.

To gain the first idea how your photo gallery looks like create a new content page (Content → Pages) and add the following line in the content field:

{cms_module module="Album"}

Save the page and see it on your website. It displays the thumbnail for your first album, click on it and the list of images assigned to the album is displayed.

To change titles and add description for the images go to the admin panel Content → Photo Albums and click on the album. In the list of images you can now click on the edit symbol below each image, change the title of the image and add up to 3 descriptions into comment fields.

Image Titles

By default the file name is taken as image title. It's ugly and normally does not describe the image or photo properly. Í recommend changing it for every image to help your visitors to understand what is on the photo.

Album template

There are different albums templates that you can use for your album. Each album can have its own template. To define template for album In the admin panel go to Content → Photo Albums. In the list of albums you see what template is actually used for each album in the column Template. To choose another template, click on the album name and switch to the tab "Options". Select template from the list.

There are 4  templates that are installed by default. But you can add other templates. Go to Content → Photo Albums and switch to the tab "Available Templates". Click on the "Import Template" for the template you would like to use. Type in the name for the new template and press "Submit". You are redirected to the list of active templates with the message "The template was successfully imported into the database and is now installed for use." The template is now available and can be used to display albums the same way I have described it above.

Useful settings and parameters

By default friendly URLs are not used in Album module. It means that links to single images look ugly, e.g:

http://www.yourdomain.com/index.php?mact=Album,,default,1&albumid=1&pictureid=1&returnid=76&page=76

If you deselect "Use Inline Links" in the Options tab of Album admin area, your URLs will look cleaner and nicer:

http://www.yourdomain.com/photos/album-1/1/76

Refine the output of your photo gallery with further parameters:

  • albums="1,3" - a list of one or more (separated by commas) IDs of albums to be shown. IDs for your albums are created automatically. You can see them in the list of albums in the admin panel of the photo gallery.
  • categories="1" - display only albums from the category with ID 1. This way you can group many albums together instead of listing all the albums with previous parameter.
  • action="recently_updated" - shows the list of recently added pictures. Tip: use it on the start page of your website to output the newest photos or randomly display images from your album(s) with action="random_image".
  • number="3" - limit the number of images displayed with action parameter above.

You can combine the parameters above. For example to display 4 recently updated images from the album with ID 1 you should use:

{cms_module module="Album" albums="1" action="recently_updated" number="4"}

There is no limit for album categories, albums or images for your photo gallery. Albums can be assigned to multiple categories and images can be assigned to multiple albums. You can use all gallery images in your content as well. No need to upload them twice! With HTML knowledge you can even create your own template to make your gallery as distinctive as possible.


Comments to "Photo gallery"

  1. Victor Demidov August 27, 2009, 10:56 pm

    In http://www.calgary-convention.com/index.php?page=gallery-north-building mistake of a conclusion of a code in an empty field around of a picture.


  2. Scranton web design August 30, 2010, 10:06 pm

    Useful!


  3. nicmare November 25, 2010, 5:39 pm

    very old module! you may want to check out "Gallery"


del.icio.us digg stumbleupon buzzup BlinkList mixx myspace linkedin facebook reddit.com ma.gnolia.com newsvine.com furl.net google yahoo technorati.com

CMS Made Simple Beginner's Guide
Loading...