fbpx
Documentation and Tutorials for your BestWebSoft products

 

Gallery

User Guide

Gallery

4.6.9 *

WordPress

6.2 *

Slider

1.0.7 *

Custom Search        

1.48 *

*When using other versions some differences are possible to occur

** Screenshots were taken from a PC

Table of Contents

1. Introduction

2. Add New Gallery

2.1. Add Title

2.2. Images

2.3. Add Galleries via Shortcode

2.4. Add Galleries to Particular Pages

3. Gallery Categories

3.1. Create Categories

3.2. Edit Category

3.3. Set a Category of a Gallery

3.4. Add Existing Gallery Categories to a Page/Post

3.5. Add Gallery Categories Widget

4. Global Settings

4.1. Gallery Layout

4.2. Number of Columns

4.3. Image Size

4.3.1. Custom Image Size

4.3.2. Crop Images

4.3.3. Crop Position

4.4. Image Title

4.5. Image Border

4.6. Unclickable Thumbnail Images

4.7. Pagination

4.8. Sort Images by

4.9. Arrange Images by

4.10. Back Link

4.11. Disable Fancybox

5. Cover

5.1. Galleries Page

5.2. Albums Displaying

5.3. Column Alignment

5.4. Cover Image Size

5.5. Cover Image Border

5.6. Sort Albums by

5.7. Arrange albums by

5.8. Read More Link Label

5.9. Instant Lightbox

6. Lightbox Settings

6.1. Enable Lightbox

6.2. Image Size

6.2.1. Custom Lightbox Image Size

6.2.2. Crop Lightbox Images

6.2.3. Crop Position

6.3. Overlay Color

6.4. Overlay Opacity

6.5. Slideshow

6.6. Lightbox Helpers

6.7. Download Button

6.8. Lightbox Thumbnails

6.9. Lightbox Button Label

6.10. Single Lightbox

7. Social Sharing Buttons Settings

7.1. Social Buttons

7.2. Social Networks

7.3. Counter

8. Miscellaneous Settings

8.1. Gallery Slug

8.2. ShortPixel Image Optimizer

8.3. Search Galleries

8.4. Track Usage

8.5. Default Settings

9. Custom Code

10. Import/ Export

11. License Key

11.1. Gallery Pro License

11.2. Check License Key

11.3.  Manage License Settings

12. Single Gallery Settings

13. Create Slider

14. Latest Galleries Widget

You can download the “Gallery” plugin here:

https://bestwebsoft.com/products/wordpress/plugins/gallery/.

1. Introduction

Note: Сlick the “Save Changes” button in order to apply any changes.  

1.1. Open your WordPress Admin Dashboard and find the menu on the left.

1.2. Select “Galleries > Add New” on your dashboard.

 

1.3. The “Add New Gallery” page will open.

2. Add New Gallery

Use the “Add New Gallery” page to add information and configure a single gallery.

2.1. Add Title

Type the title of a new gallery and a short description of its content.

2.2. Images

Add images from your device or from the media library using the “Images” tab.

2.2.1. Click the Add Media button to open the Media Library window.

2.2.2. Click the “Select Files button or drag and drop files into the window to upload new images from your computer.

2.2.3. Open the “Media Library” tab to choose images that are already uploaded into the Media Library. Select images and click the “Insert” button.

2.2.4. The selected images will be displayed in the “Gallery Images” tab.

2.2.5. To add additional info to gallery images click the “Pencil” icon in the upper right corner of the image.

 

2.2.6. Use the Edit Image Info” window to change the title, alt-text, URL and description of the image.

2.2.7. After saving changes the title and the description of the image will be displayed in the lightbox mode.

 

2.2.8. Click the “Set featured image link in the Featured Image” section to add a featured image used as the album cover of a gallery.

2.2.8.1. Upload an image or select the preferred one from the “Media Library” tab and click the “Set featured image button.

2.2.8.2. The chosen image will appear in the Featured Image” section.

2.2.8.3. Click the Update button to save changes.

2.3. Add Galleries via Shortcode

Add galleries to posts and pages using the shortcodes.

2.3.1. Create a new page/post or open it in the “Edit” mode, enter its title and click the “[ ] Add BWS Shortcode” button.

2.3.2. Select the preferred gallery from the drop-down list and click the “Insert button.

2.3.3. The gallery’s shortcode will be automatically inserted into the content of a post/page. Click the “Update/Publish” button to see the gallery in the front-end.

2.3.4. After saving changes the page with the inserted gallery may look as follows.

2.3.5. Click the [ ] Add BWS Shortcode” button to select a gallery from the dropdown list.

2.3.6. Enable the “Display an album image with the description and the link to a single gallery page” option and click the “Insert” button to place all the pictures of the gallery in one album with the description and the link to a single gallery page.

2.3.7. The shortcode will appear in the content of the post/page. Click the Update button to save changes.

2.3.8. After saving changes the page with the album image may look as follows.

2.4. Add Galleries to Particular Pages

It is possible to add all the existing galleries to one page at once. This can be implemented in several steps.

2.4.1. Open the “Galleries > Global Settings page.

2.4.2. Select the “Cover” tab and choose the page for your galleries in the drop-down of the  ”Galleries Page” option.

2.4.3. The existing galleries will be added to the chosen page and will be displayed as albums.

2.4.4. Make the paginal navigation settings in standard WordPress option: “Settings > Reading > Blog pages show at most”.

2.4.5. If the number set in the box of the “Blog pages show at most” option makes “1”, the page with the galleries will display only one gallery. To view the other galleries use the paginal navigation at the bottom of the page.

3. Gallery Categories

Use the options of the “Gallery Categories” page to sort the galleries by categories.

3.1. Create Categories

To create a category fill out the necessary fields, choose the parent category, the type of sorting, and click the Add New Gallery Category button.

3.2. Edit Category

Use the options of the “Edit” mode to edit a category.

3.2.1. Make the preferred settings and click the “Update button to save changes.

 

3.3. Set a Category of a Gallery

Use the “Gallery Categories” section to set the category of a gallery.

3.3.1. Set the preferred category and click the Update button.

3.4. Add Existing Gallery Categories to a Page/Post

Use the [ ] Add BWS Shortcode” button for adding gallery categories to a post/page.

3.4.1. Open the page in “Edit” mode and click the “[ ] Add BWS Shortcode” button.

 

3.4.2. Select the necessary gallery category from the drop-down list and click the “Insert button.

3.4.3. The shortcode of the chosen category will be automatically inserted into the content. Click the “Publish/Update button to save changes.

3.4.4. After saving changes the galleries included in the category will be displayed on the page.


3.5. Add Gallery Categories Widget

Use the “Widgets” page for adding a gallery category widget to a post/page.

3.5.1. Open ”Appearance” > ”Widgets” page and select the “Gallery Categories” widget in the list of “Available Widgets”.

3.5.2. Add Gallery Categories widget to a Sidebar. Set the title of the widget by necessity, choose its type and click the “Save” button.

 

3.5.3. If the “Display as dropdown option is enabled, the “Gallery Categories” widget will look as follows.

3.5.4. If the “Show gallery counts” option is enabled, the number of galleries, placed in the chosen category, will be displayed next to the category. The “Gallery Categories” widget will look on a page as follows.

4. Global Settings

Use the options of the “Global Settings” page to make the settings applicable to all the galleries of the website.

4.1. Gallery Layout

Use the “Gallery Layout” option to choose the type of layout for galleries between “Grid” and “Masonry”.

4.1.1. The “Grid” layout will look on a page as follows.

4.1.2. The “Masonry” layout will look on a page as follows.

4.2. Number of Columns

Use the "Number of Columns” option to set the number of columns for the galleries.

4.2.1. If the number of columns makes “4”, the gallery on a page will look as follows.

4.3. Image Size

Use the “Image Size” option to set the size of the images, displayed in a gallery on a page.

4.3.1. Custom Image Size

Choose “Custom image size and set the preferred width/height values in the boxes of the “Custom Image Size option to set the size of the images manually.

4.3.1.1. After saving changes the gallery with the custom-sized images may look as follows.

4.3.2. Crop Images

Enable the “Crop Images” to crop images using the sizes defined for Custom Image Size. Disable to resize images automatically using their aspect ratio.

4.3.3. Crop Position

Use the “Crop Position” option to choose the crop position base (by default: center).

4.3.3.1. After saving changes you will see a notification “Custom image size was changed” at the top of the page. Click the “Update images” button in order to apply the set Crop Position.

4.3.3.3. After updating the images will be cropped in accordance with the set crop position.

4.4. Image Title

Enable the “Image Title” option to display the image title along with the gallery image.

4.4.1 Titles of the images under image will look on the gallery as follows.

4.4.2 Titles of the images on mouse hover will look at the gallery as follows.

 

4.5. Image Border

Enable the “Image Border” option to make the images be displayed with a border.

4.5.1. Enter the necessary border size in pixels next to the “Image Border Size option and select the color using the color picker of the “Image Border Color option.

 


4.5.2. After saving changes the gallery images will be displayed with the set border.

 

4.6. Unclickable Thumbnail Images

Enable the “Unclickable Thumbnail Images” option to make the images in a single gallery unclickable, to hide their URLs and to disable the lightbox.

4.7. Pagination

Enable the “Pagination” option to limit the number of images displayed on a single gallery page.

4.7.1. Set the number of images, displayed on a gallery page in the box of the “Number of Images” option (the default number is “9”).

4.6.2. If the number of images is “2” the page with a gallery may look as follows.

4.8. Sort Images by

Use the “Sort Images by” option for sorting the images.

4.8.1. Choose the image sorting order in the dropdown of the "Sort Images by” option between “Manually (default), Image ID, Name, Date and “Random”.

4.9. Arrange Images by

Сhoose the image arranging order in the "Arrange Images by” option between “Ascending (e.g. 1, 2, 3; a, b, c) and Descending (e.g. 3, 2, 1; c, b, a)”.

4.9.1. The “Descending (e.g. 3, 2, 1; c, b, a)” order will look on the page as follows.

 

4.9.2. The Ascending (e.g. 1, 2, 3; a, b, c) order will look on the page as follows.

4.10. Back Link

Enable the “Back Link” option to have a back link at the bottom of a gallery.

4.10.1. Specify the “Back Link URL and the “Back Link Label” in the corresponding fields if you need to customize them.

 

4.10.2. In order to set the page for a back link open the “Global Settings” > “Cover” tab and choose in the dropdown of the “Galleries Page” option the base page where all the existing galleries will be displayed.

4.10.3. Enable the “Back Link with Shortcode” option in order to place a back link on the pages with the shortcode of a gallery.

4.10.4. After saving changes the Back Link placed on the page will look as follows.


Note: If neither “Back Link URL” nor the “Galleries Page” option is active, the back link will not be displayed on the page.

4.11. Disable Fancybox

Enable the “Disable Fancybox” option to avoid conflicts of the plugin with the theme’s fancybox.

 

5. Cover

Use the options of the “Cover” tab to make all the necessary settings for the covers of the galleries.

5.1. Galleries Page

Choose the base page where all existing galleries will be displayed in the dropdown of the “Galleries Page” option.

5.2. Albums Displaying

Use the “Albums Displaying” option to choose the way the galleries will be displayed on the “Galleries” page.

5.2.1. Albums displaying in “Columns” may look on a page as follows.

5.2.2. Albums displaying in “Rows” may look on a page as follows.

5.3. Column Alignment

Use the “Column Alignment” option to align the album column on the page.

5.3.1. The “Center” column alignment will look on the page as follows.

5.3.2. The “Left” column alignment will look on the page as follows.

5.3.3. The “Right” column alignment will look on the page as follows.

5.4. Cover Image Size

Use the “Cover Image Size” choose the gallery cover image size in the dropdown menu.

 

5.4.1. To set the custom cover image sizes select “Custom” in the dropdown of the “Cover Image Size” option and type the preferred height/width values in the boxes of the “Custom Cover Image Size” option.

5.4.2. After saving changes you will see the notification: “Custom image size was changed. You need to update gallery images”. Click the “Update Images” button.  

5.5. Cover Image Border

Enable the “Cover Image Border” option to set the cover image border color and cover image border size.

5.5.1. Enter the preferred width of the border in the box of the “Cover Image Border Size option and select a color using the color picker of the “Cover Image Border Color option.

5.5.2. The gallery cover with the set border may look as follows.

5.6. Sort Albums by

Use the “Sort Albums by” option to choose the albums sorting order in the dropdown menu.

 

5.7. Arrange albums by

Use the ”Arrange Albums by” option to choose the albums arranging order. The Ascending (e.g. 1, 2, 3; a, b, c)” and “Descending (e.g. 3, 2, 1; c, b, a)” orders are available.

5.8. Read More Link Label

Change the read more link label by typing the preferred text in the box of the “Read More Link Label option.

5.8.1. After saving changes the “Read More” link label may look on the page as follows.


5.9. Instant Lightbox

Enable the “Instant Lightbox” option to view the images of the gallery in lightbox mode instead of going to a single gallery page after clicking the cover image.

 

6. Lightbox Settings

Use the options of the “Lightbox Settings” tab to make all the necessary settings for lightbox mode.

6.1. Enable Lightbox

Enable the “Enable Lightbox” option to view the images in the lightbox by clicking them.

6.2. Image Size

Use the “Image Size” option to set the size for images displayed in the lightbox mode.

6.2.1. Custom Lightbox Image Size

Set the custom lightbox image size entering the height/ width values in the boxes of the “Custom Lightbox Image Size” option.

6.2.1. Image with custom size may look in the gallery lightbox as follows.4

6.2.2. Crop Lightbox Images

Enable the “Crop Lightbox Images option to crop the images using the size defined for the lightbox.

6.2.3. Crop Position

Use the “Crop Position” option to set the crop position base.

 

6.2.3.1. After saving changes and updating the images the lightbox will display them with a consideration of the set crop position.


6.3. Overlay Color

Use the “Overlay Color” option to set the color for the overlay of the lightbox. Select the color with the color-picker.    

6.3.1. After saving changes and updating the images the lightbox will be overlaid with the set color.

6.4. Overlay Opacity

Use the “Overlay Opacity” option to set the overlay color intensity.

Note: The lower the value of the opacity is, the less intensive is the color of the overlay.

6.4.1. The “0.3” opacity level of the overlay may look as follows.


6.5. Slideshow

Enable the “Slideshow” option to start the slideshow automatically when the lightbox is used.

6.5.1. Set the duration of a single image display in ms entering the preferred value in the box of the “Slideshow Duration” option.

 

6.6. Lightbox Helpers

Enable the “Lightbox Helpers” option to display the toolbar and arrows in the lightbox.

6.6.1. After saving changes and updating images the lightbox with the displayed toolbar and  arrows will look as follows.

6.7. Download Button

Enable the “Download Button” option to place a download button in the toolbar of the lightbox.

6.7.1. After saving changes and updating images the download button will be available.

Note: If the “Lightbox Helpers” option is disabled the “Download button will not be displayed in the lightbox.

6.8. Lightbox Thumbnails

Enable the “Lightbox Thumbnails” option to use a lightbox helper navigation between images.

6.8.1. Set the position of lightbox thumbnail images in the dropdown menu of the “Lightbox Thumbnails Position” option.

 6.8.2. After saving changes the thumbnail images will be displayed in accordance with the chosen position.

6.9. Lightbox Button Label

Use the “Lightbox Button Label” option to change enter the preferred text for the button label.

 


6.9.2. After saving changes and updating the
images the entered text will be displayed on the button.



Note: If the button URL is not specified in the image info, the button will not be displayed in the lightbox mode.

6.10. Single Lightbox

Enable the “Single Lightbox” option to use a single lightbox for multiple galleries placed on one and the same page.

7. Social Sharing Buttons Settings

Use the options of the “Social Buttons” tab to make all the necessary settings for sharing the images through social networks.

7.1. Social Buttons

Enable the “Social Buttons” option to show social sharing buttons in the lightbox.

7.2. Social Networks

Use the “Social Networks” option to choose the preferred social networks to be displayed as buttons in the lightbox mode.

7.2.1. The buttons of the chosen networks will be displayed in the bottom left corner of the lightbox.

 

7.3. Counter

Enable the “Counter” option to show “Likes Counter for social buttons.

7.3.1. After saving changes and updating images the number of likes will be displayed on the “Like” button.

8. Miscellaneous Settings

Use the options of the “Miscellaneous Settings” tab to make the settings regarding the search of the galleries.

8.1. Gallery Slug

To set the custom slug for your galleries, enter the necessary text in the field of the Gallery Slug option.

 

8.1.1. The entered gallery slug will be displayed in the browser search bar for each gallery.

8.2. ShortPixel Image Optimizer

Enable the “ShortPixel Image Optimizer” option to apply ShortPixel optimizer to gallery images.

8.2.1. Input API Key. If you don't have an API Key, go to the website: https://shortpixel.com/wp-apikey. Use the “Your Email” to enter your email and click the “Get API Key” button.

8.2.2. After successfully subscribing, copy your API key.

8.2.3. Insert your API key in the “API Key” field.

8.2.4. After saving changes you will see the notification: “Optimize your images”. Click the “Optimize Images” button.  

8.3. Search Galleries

Gallery by BestWebSoft plugin is compatible with Custom Search by BestWebSoft plugin. This plugin will include Galleries in search results.

You can download the Custom Search plugin here:  https://bestwebsoft.com/products/wordpress/plugins/custom-search/.

8.3.1. After download and activation of the “Custom Search” plugin, enable the “Search Galleries” to include galleries in search results.

8.3.2. After a successful installation and download of the plugin enable the “Search Galleries” option.

8.3.3. After saving changes and updating images you will be able to find your galleries by their titles and content.

8.4. Track Usage

Enable the “Track Usage” option to allow tracking plugin usage anonymously.

8.5. Default Settings

Click the “Restore Settings button to reset all the settings made previously and revert them to the default ones.

8.5.1. Click “Yes, restore all settings” button to confirm the procedure.

9. Custom Code

Use the “Custom Code” tab to insert a CSS, PHP or JavaScript code. To activate the inserted code, enable the “Activate custom … code” option and save changes.

10. Import/ Export

Use the “Install Demo Data/Remove Demo Data” button of the “Demo Data” option (found on the “Import/Export” tab) to import or export the demo data of the plugin.

11. License Key

Use the “License Key” tab to activate or check the Pro plugin license.

11.1. Gallery Pro License

After a successful plugin purchase, you will receive an email notification with a download link and a license key. Activate Pro license by pasting a license key into the “Gallery Pro License” field and clicking the “Save Changes” button.


11.2. Check License Key

To check the license key, click the “Check license key” button. If the entered key is correct, the notification “The license key is valid. Your license will expire on XXXX-XX-XX” will be displayed in the upper left corner of the page.

11.3. Manage License Settings

Use the “Manage License Settings” option to change your license settings. Click the “Login to Client Area” button to open your personal Client Area dashboard located on the https://bestwebsoft.com/ website. Browse and download purchased products, change the license domain and copy the license keys.

12. Single Gallery Settings

To make the settings for one of the galleries separately, open the preferred gallery in the “Edit” mode.

12.1. Enable the “Single Gallery Settings” option on the “Settings” tab to make the adjustments within the chosen gallery and to disable the Global Settings for it.

13. Create Slider

Gallery by BestWebSoft plugin is compatible with Slider by BestWebSoft plugin. This plugin will create a slider with single gallery images

You can download the Slider plugin here:  https://bestwebsoft.com/products/wordpress/plugins/slider/.

13.1. After download and activation of the “Slider” plugin, click the “Create New Slider” button on the edited gallery “Settings” tab to create a slider with single gallery images.

13.2. The notification “A new slider is added” will appear on the page. Click the “Edit slider” to open the list of sliders.

13.2. The “Sliders” page will open. Copy the shortcode of the slider with the gallery images and insert it in the necessary place of the post or page.

13.2. The slider with single gallery images may look on a page as follows.

14. Latest Galleries Widget

You can add a widget of the latest galleries using the “Widgets” submenu in the Apearance menu item on the Admin Dashboard.

14.1. To add the Latest Galleries widget click the “Add widget” button and find the “Latest Galleries”. Drag and drop the widget to the place you want it to be displayed.

14.2. You can adjust the settings of the widget by clicking on it. Set up the Title, Button Text, Link to the Galleries Page, Link to the Galleries Page, and Gallery Hover Color.

14.3. Click the “Update” button to save changes.

14.4. The Latest Galleries may look on the page as follows.

Help & Support

Visit our Help Center if you have any questions — https://support.bestwebsoft.com/

Services

We provide additional services such as WordPress themes & plugins development,

graphic design, custom programming.

Contact us now to get a free quote — https://bestwebsoft.com/contacts/