Media Gallery

Media Gallery is element for images to make it easier for you, to create carousel, metro or masonry gallery for you. If you want to learn how to set and customize follow our steps below.

1. Layout - You can set layout grid and carousel.

2. Skin - You can set skin for your actually widget.

3. Columns - You can set columns from 1 to 6 in row.

4. Stretch - This options is if you want to make widget stretch.

5. Masonry - This options will be show only if layout is on grid and you need to turn on this to make posts in masonry.

6. Metro Grid - This options will be show only if layout is on grid and you need to turn on this to make posts in Metro Grid.

7. Image Size - You can select your size for your page.

8. Image Ratio - You can set your posts in Sqaure, Landscape and Portait.

9. Image Visibility - You can show or hide featured image by clicking Show or Hide.

10. Show Hover Icon - You can show or hide hover icon by clicking on Show or Hide.

11. Lightbox - Enable the lightbox for the images, the images will open in a large slideshow when clicked.

Query

1. Add Item - To add item you need to click on button "Add Item" and will show some options.

Filter Bar

1. Show Filter Bar - If you want to show filter bar you need to click show button.

2. Show Counter Tooltip - You can show Tooltip and you can set position to Top, Right, Left and Bottom.

3. Show All Button - You can show or hide button, also you can set custom text for this button.

4. Posts Categories To Show - You can select category to show.

Carousel

Carousel Tab will show only if Layout is selected to Carousel because this tab has some extra optipons.

1. Items - Here you can set the number of items you want to see on the screen.

2. Margin - Enter the margin space, number will be represented in pixels.

3. Width - On this part you can set widget width.

4. Height - Set the height of images to auto or full.

5. RTL (Right to Left) - If you want to activate RTL you need to click ON button.

6. Loop - You can activate loop posts.

7. Center - This options is to show your last post on center.

8. Mouse Drag - Turn on if you want to activate mouse drag.

9. Touch Drag - Turn on if you want to activate touch drag.

10. Navigation - If you want to show navigation arrows.

11. Dots - Turn on if you want to show dots in bottom.

12. Autoplay - Turn on if you want to set Autoplay on start.

13. Pause on mouse hover - You can pause in mouse hover by clickin On button.

14. Stage Padding - Padding left and right on stage (can see neighbours).

15. Start Position - Enter from which element you want to start the position of carousel.

16. Auto Play Timeout - Autoplay interval timeout, number is represented in seconds.

17. Smart Speed - Speed Calculate, number is represented in seconds.

Style Tab

Items

1. Items Reveal Effect - You have many Effects for items reveal.

2. Columns and Row Gap - You can set gap in pixels.

3. Border Type - You can set border type but default is none.

4. Box Shadow - At this section you can set box shadow, and below you will se Box Shadow on hover.

5. Border Radius - You can set border radius for item.

Items Image

1. Dominant Background Color - Use image dominant color as image Background color until page is loading.

2. Background Type - You can set color or Gradient on background until page is loading.

Items Overlay

1. Visibility - You can show or hide items overlay.

2. Overlay Active - You can set overlay active.

3. Overlay Opacity - You can set customise overlay easy by setting number.

4. Dominant Background Color - You can activate dominant image color for overlay.

5. Background Type - You can set color for gradient on overlay.

6. Border Type - You can set border on overlay.

7. Overlay Spacing - You can set overlay spacing on overlay.

8. Padding - You can customize padding for overlay.

9. Content Alignment - You can set alignment Top, Middle or bottom.

10. Text Alignment - You can set text alignment Left, Center or Right.

Items Details

1. Border Type - You can set border type for items details.

2. Padding - You can set padding for details.

3. Text Alignment - You can set alignment for details Left, Center or Right.

Items Date

1. Text Color - You can change color for date.

2. Typography - You can customize text easy on your own style.

3. Text Shadow - You can set text shadow.

4. Alignment - You can customize alignment for date.

Items Title

1. Title Color - You can change color for title.

2. Typigraphy - You can customise title typography on your own style.

3. Title Shadow - You can set title shadow.

4. HTML Tag - You can change html tag for title.

5. Alignment - You can set alignment for title Left, Center or Right.

6. Spacing (Margin) - You can change spacing for title by your own style.

Items Like Button

1. Background Color - You can change button like background color.

2. Button Size - You can change size of button by your own style.

3. Border Radius - You can change border radius.

4. Icon Color - You can change icon color.

5. Icon Size - You can change icon size by your own style.

6. Spacing - You can change spacing of icon.

Filter bar

1. Alignment - Set filter bar alignment Left, Center or Right.

2. Spacing - Set spacing for filter bar.

3. Color - Set the color of the Filter Bar text.

4. Typography - Customize the typography of the Filter Bar text.

5. Space - Set the space for items in the Filter Bar.

6. Filter Spacing - Set the spacing between the Filter Bar and the images.

7. Show Before Text - Active Show before text by clickin On Button.

Pagination

1. Color - Set the color of the Pagination text.

2. Spacing - Set sp

3. Text Color - Set the color for the Pagination text.

4. Typography - Customize the typography of the Filter Bar text.

5. Border Radius - Set border radius.

6. Space - Set the space of Pagination.

7. Padding - Set padding for Pagination.

8. Alignment - Set pagenation alignment Left, Center or Right.