Skip to main content

WP Media Folder: WordPress Galleries from Folder

WordPress has a native inbuilt gallery function. We've chosen to offer a enhancement of this feature based on the folders. You will be able to create galleries from folders or from a selection of images. Please go to 6. Gallery block in Gutenberg if you are using Gutenberg editor.

 

create-gallery

 

If you open a folder or select an image you will see a button called Create a gallery from folder. Once your gallery is created you have several new options in addition to the WordPress default ones such as:

  • Gallery theme: layout for the gallery
  • Columns: a number of columns for theme
  • Gallery image thumbnail size: a choice from WordPress default image resizing
  • Gallery image lightbox (large) size
  • The action on click on an image: open a lightbox, load a separated page, do nothing or link to custom link (a link can also be chosen by clicking on a single image)

action-click-gallery

  • Auto insert image: when you add an image in this folder, it can be automatically added to the gallery
  • Order by: you can order images by date, title, custom or random
  • Order: Ascending, Descending

If you experience bad quality images in case of a big thumbnail display, for example a big width gallery on 2 columns, we recommend that you load medium or large image.

 

gallery-parameters

 

The default gallery will override the WordPress default gallery theme. If your theme already has a styling option for the WordPress gallery, you can disable this feature.

- In order to use Gallery shortcode, you should go to Settings > WP Media Folder > Wordpress Gallery > Shortcode tab. After selecting the options, you can see the shortcode at the bottom page.

 

wp-gallery-shortcode

 

Here is the sample shortcode:

[gallery wpmf_autoinsert="1" wpmf_folder_id="8" display="default" columns="3" size="medium" targetsize="large" link="file" wpmf_orderby="post__in" wpmf_order="ASC" gutterwidth="10" border_style="solid" img_border_radius="10" border_width="1" border_color="#dd3333" img_shadow="1px 1px 10px 2px #cecece" autoplay="1"]

- Attributes:

+ 'wpmf_autoinsert': 1,
+ 'wpmf_folder_id': ID of folder,
+ 'display': default || slider || portfolio || masonry,
+ 'columns': 1 -> 9,
+ 'size': size of image,
+ 'targetsize': size of lightbox image,
+ 'link': file || post || none || custom, // use 'file' if want show lightbox when click image
+ 'wpmf_orderby': post__in || rand || title || date,
+ 'wpmf_order': ASC || DESC,
+ 'gutterwidth': padding betwene images (px),
+ 'border_style': solid || dotted || dashed, ....
+ img_border_radius (px), border_width (px), border_color,
+ img_shadow: shadow includes H offset, V offset, blur, spread (px) and color,
+ 'autoplay': 1 || 0 // autoplay slider,
+ 'include_children': 1 || 0 // include images in subfolders

You can define custom links per image in the gallery, which can be very useful if you need to create a homepage layout based on a gallery that redirects to pages or posts.

While editing galleries, click on an image and look at the right column options.

 

link-gallery-image

 

You can define an internal or external link to this image using the WordPress default link manager. You will also be able to define the target where the link will open as the same window, or a new window (new tab).

 

image-detail

 

The first gallery option is the theme choice.  The default theme is an enhancement of the WordPress default theme, bringing you lightboxes to images.

 

default-theme

 

Masonry will display a wall of images with fixed width and fluid height.

 

Masonry-theme

 

Portfolio theme is a stylish gallery with hover effects, titles and captions.

 

Portfolio-theme

 

The slider theme is a horizontal slider with title and captions.

 

image28

 

4. Image options

Each image has some options in a gallery. Click on an image to see them.

  • Title and caption can be displayed in the gallery depending of the theme you've chosen
  • Link to allow you to add, for example, lightboxes to images or add custom links to individual images in a gallery - the WordPress link manager will help you to do that
  • Link target can define if the link will be loaded in the same window or in a new one

In each gallery you can order your images by:

  • Custom order
  • Random order
  • Title
  • Date

WP Media Folder has a NextGEN gallery importer. Once the plugin is installed, WP Media Folder will detect the NextGEN gallery installation and you'll get a notice to import galleries.

Each gallery will be imported as a single folder with the name of the gallery as the folder name.

 

image32

 

You can show your galleries in Gutenberg editor now.

In order to display a gallery in Gutenberg editor, clicking on the WP Media Folder Gallery button in the WP Media Folder category. After that, you can select the folder from your Media, then clicking on the Create Gallery button. Besides, you can make your own gallery by selecting images from your Media Library or upload directly from your PC.

 

wpmf-gallery

 

And then, you can edit the gallery by clicking on the Edit Gallery button on the top or add more images by clicking on Upload an image button at the bottom.

All the gallery settings are on the right panel; for example: theme, folder selection, columns, lightbox, ordering, update folder content ...

 

gallery-block-setting

 

Once the gallery is created, by clicking on an image you can edit quickly its Title, Caption, Custom link or Link target on the right panel.

 

image-setting-block