WordPress Folder Gallery – How to create a WordPress gallery from a folder on web server

Product:

Wonder Gallery

Tutorial:

This tutorial will guide you how to create an image and video gallery from a folder on your WordPress web server.

The images and videos in the gallery will be dynamically retrieved from the folder. That's, if you upload image and video files to this folder or remove files from it, the plugin will automatically find the change and update the gallery.

Step 1 - Upload image and video files to a folder on your WordPress web server

For image, the plugin supports jpg, jpeg, gif and png files.

For video, the plugin supports mp4 and m4v files.

If myimage.jpg and myimage-thumb.jpg are found in the folder, myimage-thumb.jpg will be used as the thumbnail of the image.

If myvideo.mp4, myvideo-thumb.jpg and myvideo-poster.jpg are found in the folder, myvideo-thumb.jpg will be used as the thumbnail, myvideo-poster.jpg will be used as the poster image.

Step 2 - Create a gallery by using WonderPlugin Gallery

In WonderPlugin Gallery, create a new gallery, in step 1, click the button "Import Folder".

In the "Import Folder" dialog, select the folder where you have uploaded the image and video files.

Please note, the plugin will only search files in the selected folder, it will not loop through its subfolders.

WordPress folder gallery

In the Options tab, you can choose to sort the images and videos by the filename or the modified date.

wordpress-folder-gallery-options

Step 3 - Add the gallery shortcode to a WordPress post or page

Save the gallery and add the generated shortcode to a WordPress post or page. For more information about how to use the plugin, please view the quick start tutorial: How to create a WordPress image and video gallery.

An online demo is as follows:

Use list.xml file to define extra title and description information

You can use an xml file to define extra information, for example, title and description, for the images and videos in the folder.

The name of the xml file must be list.xml (case sensitive) and it must be placed inside the folder.

An XML file is actually a text file. A demo list.xml file is as follows:

<list>
  <item>
    <type>0</type>
    <image>dog.jpg</image>
    <thumbnail>dog.jpg</thumbnail>
    <title>Dog</title>
    <description></description>
    <altusetitle>false</altusetitle>
    <alt>Image alt</alt>
    <weblink></weblink>
    <linktarget></linktarget>
  </item>
  <item>
    <type>0</type>
    <image>dog2.jpg</image>
    <thumbnail>dog2.jpg</thumbnail>
    <title>Dog2</title>
    <description></description>
    <altusetitle>false</altusetitle>
    <alt>Image alt</alt>
    <weblink>https://www.wonderplugin.com</weblink>
    <linktarget>_blank</linktarget>
  </item>
</list>

The above XML adds two images to the gallery. The available XML keys are as follows:

Key Description
type 0: image
1: mp4 video
2: YouTube video
3: Vimeo video
image image URL
thumbnail thumbnail image URL. If the key is not defined or the value is empty, it will use the image URL as the thumbnail URL.
mp4 URL for mp4 video
video YouTube or Vimeo URL. This key is only valid for YouTube and Vimeo videos. For mp4 videos, use the key mp4.
title image title
description image long description
altusetitle If this option is false, it will use the alt value for the image alt attribute, otherwise, it will use the title value
alt image alt attribute. This key is only valid when the option altusetitle is false.
weblink Goto the weblink on clicking the thumbnail in the gallery. This option is only valid when the lightbox is false.
linktarget Target of the web link. The value _blank will open the weblink in a new tab or page.
category The category slug of the item. The category must have been defined in the plugin. If the item belongs to multiple categories, seperate them with :, for example: category1:category2