Gallery Pro

The features of the Image Gallery Extension

Six Views Options - Gallery

Gallery / Content-Popup. The initial look of this view is standard sized image boxes with title, as you click on image popup opens with title & description on the right side next to the image/video.
Content Slider. It is Slider with image/video, title and description next to it. The slider view will slide the whole content
Lightbox Gallery. This view doesn’t provide description, You only can show your image projects with title, and a beautiful lightbox opens the images as you click on them. The view takes the natural size of the images
Slider. The Slider view takes images/videos, make slider with title and description laying on it, and fluently slide them with many effects. Slider view provides current options: width & height of the slider, effect, speed of sliding & speed of effect, hover stopping feature and positioning
Thumbnails. This view gives similar image boxes with title which opens on click and demonstrate only images in beautiful lightbox.
Justified. Show your images/projects in a beautiful horizontal line or puzzle with natural size of the images/videos which also can be watched with lightbox tool
2. Fully responsive
3. Unlimited uploading of images/videos
4. Unlimited amount of Galleries in one page

User manual

Stage 1. Addition of Huge-IT Image Gallery Extension

For installation of slider go: Extensions > extensions manager > choose the zip file > upload > module manager > activate

Stage 2. Use of Gallery Module

Gallery module allows to manage gallery within your website: place in in different positions within page, select the pages where to display and where not display

2.1 Installing module zip file

Extensions > Module Manager > Activate Huge-IT Image Gallery > Choose slider from list and Position within specific theme (on right panel) > Menu assignment > Choose where you need to display it

Stage 3. Inserting the Image Gallery Extension

Menu > Main Menu > “page” > Select > Sliders > choose our Slider > Save

Stage 4. General option of Image Gallery Extension

4.1 Gallery/Content-popup.

Content Styles - Gallery

Show Content In The Center. Move the gallery to the center of the theme container

Element Styles - Gallery

Element Width. Give width to image box while popup closed
Element Height. Give height to image box while popup closed
Element Border Width. Adjust width size of element’s border
Element Border Color. Give a color to the border of element
Element’s Image Overlay Color. Choose another color for the overlay on the image box while hovering on it
Element’s Image Overlay Transparency. Set the extent of transparency of the image overlay
Zoom Image Style. Pick up a color for zoom, white or black

Popup Styles - Gallery

Popup Background Color. Give a specific color to popup background area
Popup Overlay Color. Give overlay color to popup
Popup Overlay Transparency. Decide extent of transparency for popup overlay
Popup Close Button Style. Choose white or black color for close button
Show Separator Lines. Select to see separation lines in popup, which separates title, description and image

Popup Description - Gallery

Show Description. Select to see description of the image
Description Font Size. Choose size extent for description font
Description Font Color. Give some specific color to description text

Element Title - Gallery

Element Title Font Size. Decide the dimension of the title on element (thumbnail)
Element Title Background Color. Give some specific color to title background on element
Element Title Font Color. Give color to title on element (thumbnail)

Element Link Button - Gallery
Show Link Button On Element. Select to see link button on the element
Link Button Text. Write some other phrase instead of “view more” on element
Link Button Font Size. Decide size extent for link button text on element
Link Button Font Color. Give some specific color to link text on element
Link Button Background Color. Give color to link button background on element

Popup Title - Gallery

Popup Title Font Size. Decide the size for title in popup
Popup Title Font Color. Give color to title in popup

Popup Link Button - Gallery

Show Link Button. Select to see link button in popup
Link Button Text. Write any other phrase instead of “view more” in popup
Link Button Font Size. Decide size extent for link button text in popup
Link Button Font Color. Give some specific color to link text in popup
Link Button Font Hover Color. Give some specific color to link text in popup while hover on it
Link Button Background Color. Give color to link button background in popup
Link Button Background Hover Color. Give color to link button background in popup while hover on it

4.2 Content Slider - Gallery

Slider Container - Gallery

Main Image Width. Choose size for image/video
Slider Background Color. Give some specific color to slider’s back space
Arrow Icons Style. Choose color: black or white for arrows in slider
Show Separator Lines. Select to see separation lines between description, title, and link

Link Button - Gallery

Show Link Button. Select to see link button in slider
Link Button Text. Write new text instead of “view more” in slider
Link Button Font Size. Decide size extent for link button text
Link Button Font Color. Give some specific color to link text
Link Button Font Hover Color. Give some specific color to link text in slider while hover on it
Link Button Background Color. Give color to link button background
Link Button Background Hover Color. Give color to link button background in slider while hover on it

Title - Gallery

Title Font Size. Give a size to title in slider
Title Font Color. Give some specific color for title in slider

Description - Gallery

Show Description. Select to see the description of the image
Description Font Size. Decide size for description font
Description Font Color. Give some specific color to description font

4.3 Ligthtbox Gallery - Gallery

Content Styles - Gallery

Show Content In The Center. move the gallery in the middle of the theme container

Image - Gallery

Image Width. Adjust width of the images
Image Border Width. Set borders and adjust their width size
Image Border Color. Give some specific color to borders of the images
Border Radius. Set radius extent on image borders

Title - Gallery

Title Font Size. Adjust size of the title
Title Font Color. Give color to tile font
Title Font Hover Color. Give another color to title, which will change while hover on it
Title Background Color. Give some specific color to title background area
Title Background Transparency. Decide the extent of title background transparency

4.4 Slider - Gallery

Title - Gallery

Title Width. Decide title box width, laying on slider
Title Has Margin. Select to have margin for title
Title Font Size. Decide font size extent on title
Title Text Color. Give specific color to your title
Title Text Align. Set the position of title within title box
Title Background Transparency. Give extent of transparency on title background area
Title Background Color. Give specific color to title background area
Title Border Size. Select to have and decide border size of the title
Title Border Color. Give specific color to title border
Title Border Radius. Change the radius extent for title border’s corners
Title Position. Decide where to place title within slider

Slideshow - Gallery

Image Behaviour. In “natural” mode you can see image with actual dimension
Slider Background Color. The extra space color (in natural mode)
Slideshow Border Size. Select to have borders, and decide their size
Slideshow Border Color. Give specific color to slider borders
Slideshow Border radius. Decide radius extent for slider border’s corners

Description - Gallery

Description Has Margin. Select to have margin for description
Description Font Size. Decide size of the description font
Description Text Color. Give specific color to description
Description Text Align. Decide the position of description within description box
Description Background Transparency. Adjust extent of transparency for description background area
Description Background Color. Give specific color to description background
Description Border Size. Select to have and adjust size of the description borders
Description Border Color. Give specific color to description borders
Description Border Radius . Adjust radius degree for description borders
Description Position. Decide where to put the description within slider

Navigation - Gallery

Show Navigation Arrows. Select to be able to see navigation arrows
Navigation Dots Position / Hide Dots. Adjust where to place dots, or vanish them from slider
Navigation Dots Color. Give color to navigation dots in general
Navigation Active Dot Color. Give color to navigation dot, which is active

4.5 Thumbnails View - Gallery

Image - Gallery

Image Behavior. Select to see the whole image size, unselection will cut the image
Image Width. Decide the width for images/videos
Image Height. decide the height of images/videos
Image Border Width. Adjust to have and customize the width of image/video borders
Image Border Color. Give some color to image/video borders
Border Radius. Set radius extent for borders
Margin Image. Adjust margin value of them images

Container Style - Gallery

Box padding. Decide the size of container box padding
Box background. Set some color on box background
Box Use shadow. Select to have shadow on container box.
Box Has background. Decide if you need your box to have background

Title - Gallery

Title Font Size. Choose dimension of the title font
Title Font Color. Define font color for title on image/video
Overlay Background Color. Set any color on background overlay
Title Background Transparency. Set title background transparency extent in percents
Link Text. Write some new text instead of “view picture” button

4.6 Justified View - Gallery

Element Styles - Gallery

Image height. Specify the height of images/videos within the view
Image margin. Decide margin between images/videos
Image Justify. Select and get width level up to the 100% of theme container. Unselect to see them all in actual size.
Image Randomize. Select display all images/videos randomly on frontend
Opening With Animation. Select to appear the gallery animated
Opening Animation Speed. Decide the time of animation speed

Element Title - Gallery

Show Title. Selection will show title on image/video
Element Title Font Size. Adjust size level for title font
Element Title Font Color. Define a color for title
Element Title Background Color. Color for title background area
Element's Title Overlay Transparency. Choose the extent of transparency on imposition