Gallery examples

 Gallery from files

As it’s seen in the examples, the built-in samples orientate the images proportionally, making it as wide as it can, and split up the distance between images equally.

If the subtitles are multiple lines, the layout is still correct. In case of the last line, it makes the distance between images valid to the previous line.

For the custom samples to act like this, the div element needs to get the .gallery-from-files files class, and the image containing div-s need to get the .gallery-from-files-item class. (As a starter base, it’s a good idea to copy the built-in samples and modify them.)

Images (images.html)

The displaying of the images of the folder. If neccessary, the scroll bar automatically appears under the images. Clicking on the images, they can be scrolled through in a new window.

[gallery-from-files folder="demo/galleries" template="images" page_limit="6"]

  • 1
  • 2

Folders (folders.html)

The displaying of folders in the folder. In this case, each folder is displayed with it’s first image, but clicking on it results in all images to open in a popup window.

[gallery-from-files folder="demo/galleries" template="folders"]

One image (image.html)

If target is folder, then show first image.

One folder (folder.html)
[gallery-from-files folder="demo/galleries" template="one-image"] [gallery-from-files folder="demo/galleries" template="one-folder"]
Ez egy megjegyzés
Ez egy megjegyzés
Demó galéria
Demó galéria (11)
The counter parameter tells you how to display the picture in the current order.
If this is negative, then counts from the end of the list in descending order.
[gallery-from-files folder="demo/galleries" template="one-image" counter="2"] [gallery-from-files folder="demo/galleries" template="one-folder" counter="2"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus egestas sed eros maximus mattis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus egestas sed eros maximus mattis.
Demó galéria
Demó galéria (11)

Limiting the amount of images

The number of displayed images can be limited with a switch. If the images need to be put onto more pages, naturally, it happens correctly.

[gallery-from-files folder="demo/galleries" template="images" max="3"]

Displaying images in custom sizes

There could be a need for the thumbnails to appear in different sizes. In this case, it needs to be overwritten while calling. (The thumbnail’s size itself is not going to be changed, only the display.) There could be a need for the subtitles to be blocked.
[gallery-from-files folder="demo/galleries" template="images" th_size="120x120" title="0"]


The custom size does not need to keep the original image ratios, it can vary. In this case, only a bit of the image appears, but the image itself does not get distorted.
[gallery-from-files folder="demo/galleries" template="images" th_size="120x70" title="0"]

Designed sample

This sample using custom theme.

[gallery-from-files folder="demo/galleries" template="default-child"]