Responsive Image Gallery, Gallery Album

Description

Responsive Image and video Gallery plugin is very important tool for any website. The most of users have Galleries on their website. Our plugin allow you to display your Galleries with awesome views and animation effects, so you need to try our plugin.
We have a lot of different standard and Canvas animation that you will like. You can create your own design and make your style. We are sure that you will like our plugin.

View our plugin Demo pages:

Our plugin have a lot of free and Premium features, so let us introduce some of that features.

Features of free version

  • Fully Responsive
  • Handy and easy to use admin panel
  • Tested on all modern browsers
  • Works perfectly with all versions of WordPress
  • Ability to create unlimited number of Galleries, Albums and images
  • Ability to change pictures names and descriptions
  • Ability to change Popup overlay background color, opacity
  • Position
  • Border width
  • Border color
  • Border opacity and radius
  • Control bar icons sizes
  • Control bar height
  • Description panel settings
  • Description panel text and background colors
  • Description panel opacity
  • Description panel hover options
  • Previous and Next icons, icons color, icons size and icons position
  • Slide pause time
  • Ability to create unlimited themes
  • Ability to change Album pictures size and text options
  • Ability to change general pictures size and text options
  • Ability to change count of elements in page
  • Ability to set number of columns
  • Ability to set Pagination panel height
  • Ability to change Pagination panel background options
  • Ability to set pictures thumbnails cropping width and height
  • Ability to set cropping max width and height
  • Tested on popular WordPress themes

You can upgrade the free version to Pro Version to add some nice features.

The features of Pro version

  • 8 Awesome views
  • 5 standard animation effects
  • 27 Canvas animation effects
  • Ability to set slide animation time
  • Ability to change Popup design settings
  • Control bar design settings, position, icons design.
  • Outside Icons conteiner settings
  • Thumbnail line settings
  • Thumbnail images settings
  • Fully customizable design
  • Premium support

This was the settings list of our plugin, but you need to try our demo or create Galleries yourself for haveing closer look on it. We hope you will like our plugin.
We tried to do our best for creating user friendly and easy to use plugin, but if you have any questions then check the User Manual page or contact us.

Fully Responsive

Our plugin is one of the most responsive galleries that are available on WordPress. You can check our demo pages on different devices and you will see what we are talking about.
Today the mobile development and promotion is more then important, so we try to do our best in this case.

27 Canvas animation effects

We have nice and unique Canvas effects that you will like. Try them, there are a lot of awesome animation effects.

Fully customizable design

You can set almost every element design setting, so our plugin design will fit to your website design.

8 Awesome views. Below you can check Views and their short descriptions.

Square view

Square view is very simple and nice view. In Square view all pictures have the same height and different width.
Try this view we think you will like it.

Masonry view

Masonry view is the most popular view. It will display pictures in a beautiful style and we are sure you will like this view.

Mosaic view

Mosaic view is on of the most popular views. In this view pictures have the same width, but height can be different.

Thumbnail view

In Thumbnail view images sizes will be automatically modified and will get the same width and height. This is handy view as well.

Column view

This view will display Galleries, Albums and pictures by column. It’s not so popular view, but some users prefer this view.

Square, Masonry, Mosaic, Thumbnail alternative views

Alternative views have beautiful style as well and not so different as the original views

If you found any bug or mistake in our plugin or have a question contact us at support@wpdevart.com, we will try to fix it as soon as it possible.

On this page we will provide detailed information about how to create and insert Galleries into your website posts/pages. Also, below we will provide more information about Popup and theme settings.

First of all go to Crop setting page from admin panel and set up the cropping parameters for pictures. It’s very important, don’t miss this step.

Gallery page

When you install our plugin and go to the main page from WordPress admin panel you will see the detailed information about how to configure our plugin.

Popup page

On this page you can configure Popup(lightbox) settings.
There are a lot of options that will allow you to configure the Popup design and other settings. Popup have fully customizable design, so you can configure it as you need.
Beslow you can view the Popup options list and some descriptions.

General

Distance from window – Type here the distance from screen(not for middle position)
Rotation when photo started open – Type here the rotation degree when Popup started
Popup Position – Choose the Position
Photo location at Popup start – Choose the location at Popup start
Popup closing type – Choose the closing type
Popup location – Choose the location
Popup border width – Type the border width
Popup border color – Select the border color
Popup border opacity – Type the border opacity
Popup border radius – Type the border radius
Popup radius metric type – Select the radius metric type
Minimum photo width – Type the minimum width
Photo width at Popup start – Type the width at start

Description panel

Description panel background color – Select the description panel background color
Description panel on hover background color – Select the description panel on hover background color
Description panel opacity – Select the description panel opacity
Description panel on hover opacity – Select the description panel on hover opacity
Description panel text color – Select the description panel text color
Description panel on hover text color – Select the description panel on hover text color
Description panel text distance from top – Type the description panel text distance from top
Text distance from left and right side – Type the description panel text distance from left and right side
Description panel text font size – Type the description panel text font size

Icons general settings

Control bar display settings – Choose when to show or hide the control bar
Control bar icons position – Select control bar icons position
Control bar position – Select the control bar position
Control bar vertical position – Choose the control bar vertical position
Control bar background color – Select the control bar background color
Control bar icons color – Select the control bar icons color
Control bar icons on hover color – Select the control bar icons on hover color
Control bar height – Type the control bar height
Control bar icons on hover size changing – Type here how to zoom in or zoom out icons on hover
Distance between control bar icons – Type distance between control bar icons

Control bar icons

Previous and Next photo icons – Choose the Previous and Next icons
Previous and Next photo icons size – Type the Previous and Next icons size
Play icon – Choose the play icon
Pause icon – Choose the pause icon
Play and Pause icon size – Type the Play and Pause icon size
Counter separating symbol – Type the counter separating symbol
Counter separating symbol size – Type the counter separating symbol size
Close icon – Choose the close icon
Close icon size – Type the close icon size

Outside Icons conteiner

Outside Icons distance from screen – Type here outside Icons distance from screen
Outside Icons panel background color – Select outside Icons panel background color
Outside Icons panel background opacity – Select outside Icons panel background opacity
Outside Icons panel border radius – Type outside Icons panel border radius

Overlay

Overlay background color – Select the overlay background color
Overlay opacity – Select the overlay opacity

Slide effects

When start slide effect – Choose when the slide effect should start
Slide type – Select slide effect type
Standard effects list – Choose what standard effects use(5 Standard effects)
Canvas effects list – Choose what Canvas effects use(27 Canvas effects)

Popup Previous and Next icons

Previous and Next icons – Select the Previous and Next icons
Previous and Next icons color – Selcet Previous and Next icons color
Previous and Next icons size – Type the Previous and Next icons size
Previous and Next icons position – Type the distance for Previous and Next icons from popup border

Popup thumbnail line

Show thumbnail line – Choose to show or hide thumbnail line
Distance between control bar icons and thumbnail line – Type the distance between control bar icons and thumbnail line
Thumbnail line width – Select the width
Active thumbnail line height – Type the active line height
Thumbnail line color – Select the color
Active image line color – Select the active line color
Viewed photo line color – Select the viewed line color
Hovered photo line color – Select the hovered line color

Popup thumbnail images

Width – Type the width
Height – Type the height
Thumbnail border – Type the border size
Distance between thumbnail line and thumbnail photos – Type here the distance
Thumbnail border color – Type the border color
Background color of residual space – Select the background
Thumbnail opacity – Select the opacity

Thumbnail image counter

Show the counter – Choose to show or hide the counter
Counter width – Type the counter width
Counter height – Type the counter height
Counter background color – Select the counter background color
Counter opacity – Select the counter opacity
Numbers text color – Select the numbers text color

Themes page

On themes page you can create or edit themes. Also, you can select the default theme from this page.
If you need to create new themes, then click on “Add New” button from right side of Themes text.
After that type the new theme name and cofigure options.

Below is the list of options of theme.

General

Count of elements in page – Type the count of elements in page
Image distance type – Select the distance type(work only for Masonry alternative, Mosaic alternative and Thumbnail alternative view)
Number of max columns – Type number of max columns
Count of added elements(more button) – Type the count of added elements(more button)
Pagination panel height – Type pagination panel height
Main background color – Select main background color
Main background opacity – Select main background opacity
Pagination type – Select pagination type
Pagination buttons font size – Type Pagination buttons font size
Pagination buttons background color – Select pagination buttons background color
Active pagination buttons background color – Select active pagination buttons background color
On hover pagination buttons background color – Select on hover pagination buttons background color
Pagination buttons text color – Select pagination buttons text color
Active pagination buttons text color – Select active pagination buttons text color
On hover pagination buttons text color – Select on hover pagination buttons text color
Show ordering type on front end – Choose to show or hide ordering type on front end
When text hover should work – Select when text hover should work
Elements on hover animation speed – Type elements on hover animation speed

Image Settings

Width – Type the width
Height – Type the height
Distance between photos – Type the distance between
Zoom on hover – Type the zoom on hover
Rotation on hover – Type the rotation on hover
Opacity – Select the opacity
On hover opacity – Select the on hover opacity
Border size – Type the border size
Border color – Select the border color
Border opacity – Select the border opacity
Border on hover color – Select the border on hover color
Border on hover opacity – Select the border on hover opacity
Border radius – Type the border radius
Border on hover radius – Type the border on hover radius
Shadow color – Select the shadow color
Shadow on hover color – Select the shadow on hover color
Horizontal shadow – Type the horizontal shadow
Horizontal on hover shadow – Type the horizontal on hover shadow
Vertical shadow – Type the vertical shadow
Vertical on hover shadow – Type the vertical on hover shadow
Shadow blur – Type the shadow blur
Shadow on hover blur – Type the shadow on hover blur
Separate shadow – Type the separate shadow
On hover separate shadow – Type the on hover separate shadow
Shadow opacity – Select the shadow opacity
Shadow on hover opacity – Select the shadow on hover opacity
Shadow type – Choose the shadow type
Shadow on hover type – Choose the shadow on hover type
Text padding – Type the text padding
Text font size – Type the text font size
Text on hover font size – Type the text on hover font size
Text color – Select the text color
Text on hover color – Select the text on hover color
Text opacity – Select the text opacity
Text on hover opacity – Select the text on hover opacity
Text shadow color – Select the text shadow color
Text on hover shadow color – Select the text on hover shadow color
Text shadow blur – Type the text shadow blur
Text on hover shadow blur – Type the text on hover shadow blur
Text shadow opacity – Select the text shadow opacity
Text shadow on hover opacity – Select the text shadow on hover opacity
Text panel background color – Select the text panel background color
Text panel on hover background color – Select the text panel on hover background color
Text panel background opacity – Select the text panel background opacity
Text panel on hover background color – Select the text panel on hover background color

Album settings

Pictures width – Type the width
Pictures height – Type the height
Distance between Albums – Type the distance between
Folder size inside album window – Select folder size inside album window
Opacity – Select opacity
On hover opacity – Select on hover opacity
Background color – Select background color
On hover background color – Select on hover background color
Background opacity – Select background opacity
On hover background opacity – Select on hover background opacity
Border size – Type border size
Border color – Select border color
On hover border color – Select on hover border color
Border opacity – Select border opacity
On hover border opacity – Select on hover border opacity
Border radius – Type border radius
On hover border radius – Type on hover border radius
Shadow color – Select shadow color
On hover shadow color – Select on hover shadow color
Horizontal shadow – Type horizontal shadow
On hover horizontal shadow – Type on hover horizontal shadow
Vertical shadow – Type vertical shadow
On hover vertical shadow – Type on hover vertical shadow
Shadow blur – Type shadow blur
On hover shadow blur – Type on hover shadow blur
Separate shadow – Type separate shadow
On hover separate shadow – Type on hover separate shadow
Shadow opacity – Select shadow opacity
On hover shadow opacity – Select on hover shadow opacity
Shadow type – Select shadow type
On hover shadow type – Select on hover shadow type
Text padding – Type text padding
Text font size – Type text font size
On hover text font size – Type on hover text font size
Text color – Select text color
On hover text color – Select on hover text color
Text opacity – Select text opacity
On hover text opacity – Select on hover text opacity
Text shadow color – Select text shadow color
On hover text shadow color – Select on hover text shadow color
Text shadow blur – Type text shadow blur
On hover text shadow blur – Type on hover text shadow blur
Text shadow opacity – Select text shadow opacity
On hover text shadow opacity – Select on hover text shadow opacity
Number of albums to show before clicking more button – Type how many albums to show before clicking more button(work only when selected more button option)

Gallery settings

Pictures width – Type the width
Pictures height – Type the height
Distance between galleries – Type the distance
Folder size inside window – Select folder size inside window
Opacity – Select opacity
On hover opacity – Select on hover opacity
Background color – Select background color
Folder background color – Select folder background color
On hover background color – Select on hover background color
Background opacity – Select background opacity
On hover background opacity – Select on hover background opacity
Border size – Type border size
Border color – Select border color
On hover border color – Select on hover border color
Border opacity – Select border opacity
On hover border opacity – Select on hover border opacity
Border radius – Type border radius
On hover border radius – Type on hover border radius
Shadow color – Select shadow color
On hover shadow color – Select on hover shadow color
Horizontal shadow – Type horizontal shadow
On hover horizontal shadow – Type on hover horizontal shadow
Vertical shadow – Type vertical shadow
On hover vertical shadow – Type on hover vertical shadow
Shadow blur – Type shadow blur
On hover shadow blur – Type on hover shadow blur
Separate shadow – Type separate shadow
On hover separate shadow – Type on hover separate shadow
Shadow opacity – Select shadow opacity
On hover shadow opacity – Select on hover shadow opacity
Shadow type – Select shadow type
On hover shadow type – Select on hover shadow type
Text padding – Type text padding
Text font size – Type text font size
On hover text font size – Type on hover text font size
Text color – Select text color
On hover text color – Select on hover text color
Text opacity – Select text opacity
On hover text opacity – Select on hover text opacity
Text shadow color – Select text shadow color
On hover text shadow color – Select on hover text shadow color
Text shadow blur – Type text shadow blur
On hover text shadow blur – Type on hover text shadow blur
Text shadow opacity – Select text shadow opacity
On hover text shadow opacity – Select on hover text shadow opacity

Cropping page

You can set the cropping parameters for all pictures.

Thumbnails cropping width – Type here the the thumbnail width, after you set this parameter the thumbnails width will be cropped
Thumbnails cropping height – Type here the the thumbnail height, after you set this parameter the thumbnails height will be cropped
Cropping max width – Type the cropping max width
Cropping max height – Type the cropping max height

Screenshots

  • Front-end
  • Front-end
  • Front-end
  • Front-end
  • Front-end
  • Front-end
  • Front-end
  • Back-end
  • Back-end
  • Back-end
  • Back-end
  • Back-end
  • Back-end
  • Back-end
  • Back-end

Installation

First download our plugin ZIP file.

Follow these steps for installing and activating the plugin

  1. Log into your WordPress website administration panel.
  2. Then go to Plugins page and click Add New > Upload Plugin.
  3. Click “Choose file” then select our WordPress Gallery plugin zip file.
  4. Then install and activate the plugin.

If you have any issue with installation contact us at support@wpdevart.com.

FAQ

Our plugin is an user friendly tool, but here you can check some frequently asked questions.

Installation Instructions

First download our plugin ZIP file.

Follow these steps for installing and activating the plugin

  1. Log into your WordPress website administration panel.
  2. Then go to Plugins page and click Add New > Upload Plugin.
  3. Click “Choose file” then select our WordPress Gallery plugin zip file.
  4. Then install and activate the plugin.

If you have any issue with installation contact us at support@wpdevart.com.

How I should insert it into my posts/pages

First of all set the Crop parameters. Then you need to create it and configure the Popup settings. After that configure the theme settings.
Then go to your post or page, find the insert shortcode button from Visual Editor buttons. Click on it, select the options you need and insert it.

Is this plugin mobile friendly

Yes, this is the most mobile friendly plugin 🙂

Can I set the same title for different Galleries

Unfortunately no, you will get an error about this.

Can I edit the inserted shotcode

Yes, just click on the shotcode icon in your post/page editor and you can chage the views or settings.

What files I need to upload for installing the plugin

You need to select the .zip file only, there is no need to extract the zip file, just upload it.

I purchased the pro, but couldn’t download the pro file

Contact us at support@wpdevart.com and we will send you the pro version.

Do I need to pay yearly or monthly for pro version

No dear user, you need to pay only once for our pro version.

Reviews

Excellent support

The WebDevart Team provided Excellent support for their Gallery Plugin when the photo’s initially did not display. They fixed it and followed up to make sure all was well. Excellent, thanks!

Efectos muy chulos y originales

No soy mucho de comentar pero esta vez lo voy a hacer.Lo RECOMIENDO a todos los usuarios. Tiene muy buenos efectos, llevaba mucho tiempo buscando algo asi y al final lo encontre. Felicito a los creadores por crear esta maravilla. Mil gracias.

Un abrazo

Hope you will like our Gallery plugin

Hi dear users.

We tried to develop such Gallery plugin that will help you easily create Galleries and Albums.

Hope you will like it.

If you have any issues or questions, then contact us and we will be happy to help.

Thanks

Read all 5 reviews

Contributors & Developers

“Responsive Image Gallery, Gallery Album” is open source software. The following people have contributed to this plugin.

Contributors

Changelog

1.0.0

  • Initial version.

1.0.1

  • Added function names.

1.2.0

  • Added new features.

1.2.1

Fixed Union SQL Injection POC:

/wordpress/wp-admin/admin.php?page=wpdevart_gallery_themes&task=add_edit_theme&id=-1+UNION+ALL+SELECT+NULL,@@VERSION,NULL,NULL–

Fixed Blind SQL Injection POC:

/wordpress/wp-admin/admin.php?page=wpdevart_gallery_themes&task=add_edit_theme&id=1+and+1=0

Thanks to Manuel Garcia Cardenas who tell us about this issue(advidsec@gmail.com).