How to create a polaroid image gallery with Tabulizer
In this tutorial we will describe how to turn a list of image filenames into a fancy polaroid image gallery! So, why use a dedicated gallery extension, when you can do it with Tabulizer?
Since there is no built-it functionality to convert a list of images files into a gallery, we will use the modification function polaroideffect:
Function Name | polaroideffect |
Function Args | none |
http://www.tabulizer.com/images/tabulizer/demo/avatar_1.png | Mary |
http://www.tabulizer.com/images/tabulizer/demo/avatar_2.png | Wisley |
http://www.tabulizer.com/images/tabulizer/demo/avatar_3.png | Homer |
http://www.tabulizer.com/images/tabulizer/demo/avatar_4.png | Igor |
http://www.tabulizer.com/images/tabulizer/demo/avatar_5.png | Maurice |
http://www.tabulizer.com/images/tabulizer/demo/avatar_6.png | Dean |
http://www.tabulizer.com/images/tabulizer/demo/avatar_7.png | James |
http://www.tabulizer.com/images/tabulizer/demo/avatar_8.png | Suzy |
http://www.tabulizer.com/images/tabulizer/demo/avatar_9.png | Anna |
Basic Gallery
Here is the input used:
Here is the resulting gallery:
Fancy Gallery
Here is the input used:
Here is the resulting gallery:
Use a directory as your input, instead of a list of files
It is possible to create the image gallery by specifying the folder that contains the images, instead of each file separately. Of course, by doing so we cannot give a subtitle/short description to our images, but this is not always a requirement.
In order to convert the files contained in a folder into an image list, that will be processed later on by the polaroideffect modification function, we are using another modification function. It's named scandirurl and takes for following arguments:
Function Name | scandirurl |
Function Args | none |
dir | recursive | mask | max_count | abs_url |
dir | The initial directory(folder) that contains the images. It can be a relative path to the root directory of your site, or an absolute path. This is the only required cell, all others are optional. |
recursive | This can be 0 or 1. If th value is set to 1, it will scan not only the initial directory but all sub-diectories as well. The default value is 0 (i.e. non-recursive). |
mask | This is a regular expression that can be used by preg_match while scanning the directories, giving you the possibility to select only certain files instead of all. It's an optional field and you can leave it blank. |
max_count | This is another optional field that is used when you want to limit the number of files that will be returned by the scanning process. |
abs_url | This is an optional field that can be either 0 or 1. 1 indicates that the resutling URLs should contain the site domain. The default value is 0. |
images/tabulizer/demo | 0 | /^avatar/ |
- images/tabulizer/demo is the initial directory that we will scan for image files
- 0 means that the operation is non-recursive.
- /^avatar/ is the regular expression that translates to "find all files that begin with avatar"
- The rest of the optional fields were not specified and left with their default values.

Here is the resulting outcome: