video-gallery

JOOMLA EXTENSIONS | video-gallery


User Manual

Step 1. Adding process of Huge-IT Video Gallery Extension

In order to install Video Gallery extension, go: Extensions > extensions manager > choose the zip file > upload > module manager > activate

Step 2 Usage of Video Gallery Module

Modul ability allows you to manage the Video Gallery within your site: put it in different positions within page, select the pages where to display and where not display.

2.1 How to install module zip file

Extensions > Module Manager > Activate Huge-IT Video Gallery > Choose video gallery and Position within specific theme (on right panel) > Menu assignment > Choose where to display it.

Step 3. How to Insert Created Video Gallery

Menu > Main Menu > “page” > Select > choose our Video Gallery > Save.

Step 4. Free version options of Video Gallery Extension

Components > Video Gallery > My First Gallery.

On the Galleries page the Video Gallery extension give you 5 ways to demonstrate the videos with many style options for each view.

4.1 Video Gallery/Content popup
Element Styles
  • Video Video element Width. With this option you can set the width of the element.
  • Video element Height. Set the height of the elements.
  • Video element Border Width. Set the size for the border around each element.
  • Video element Border color. Choose a color for the border around elements.
  • Element’s Image Overlay Color. Select a color for the overlay on the video.
  • Element’s Image Overlay Transparency. Set the extent of transparency for the overlay on the video thumbnail.
  • Zoom Image Style. Select a color for zoom icon, white or black.
Popup Styles
  • Popup Background color. Pick preferable background color of popup.
  • Popup Overlay color. Pick preferable color for popup overlay.
  • Popup Overlay Transparency. Specify preferable degree of background transparency in your.
  • Popup Close Button Style. Pick up among white or black icon color for X button.
  • Show Separator Lines. Selection of this option will enable separation lines between text content.
Popup Description
  • Show Description. Do not select to hide description.
  • Description Font Size. Font size of the description can be changed.
  • Description Font color. Font color can be changed to your preferable one.
Element Title
  • Element Title Font Size. Pick up a color for title on element.
  • Element Title Font color. Edit preferable color of title.
  • Element Title Background color. Determine preferable color of title’s background.
Element Link Button
  • Show Link button on Video-element. Select to show “View More” button on the video.
  • Link button Text. You can change the “View More” button text.
  • Link button Font Size. Choose preferable size of Link-button.
  • Link button Font color. Determine preferable color of link font.
  • Link button Background color. Determine preferable color for link background.
  • Link Button Background Color. Select the background color for the Show More button.
  • Link Button Background Hover Color. Select the background color for the Show More button when hovered.
Popup Title
  • Popup Title Font Size. Determine title size of the letters of popup.
  • Popup Title Font color. With this option configure the most appropriate color for title in popup.
Popup Link Button
  • Show Link button. Choose to make Link-button visible in popup.
  • Link button Text. With this option edit the text of Link-button in popup.
  • Link button Font Size. With this option set most appropriate size of the letters of Link-button in popup.
  • Link Button Font Color. With this option change color of link button in popup.
  • Link button Font color. With this option configures the most appropriate color for link-button in popup.
  • Link button Font Hover color. With this option determine the most appropriate color of Link-button when you hover the mouse on it.
  • Link button Background color. Specify preferable background color of the Link-button in popup.
  • Link button Background Hover color. Specify preferable background color of the link as you hover the mouse on it.
4.2 Content Video Slider
Slider Container
  • Main image Width. This fixes the margin of the main image.
  • Slider Background color. With this option select most appropriate color for slider background.
  • Arrow Icons Style. Specify black/white color of arrows in slider.
  • Show Separator Lines. With this option you can see or hide lines between text, title, and link visible.
Title
  • Title Font Size. With this option select most appropriate size of the letters of the title.
  • Title Font color. With this option select most appropriate color of the font.
Link Button
  • Show Link button. Click to show the Link button.
  • Link button Text. With this option, you can change text on link button.
  • Link button Font Size. With this option, you can edit the size of the letters of the link text.
  • Link button Font color. With this option, you can edit the color of the link text.
  • Link button Font Hover color. Choose most appropriate color of the link text while hovering the mouse on it.
  • Link button Background color. Determine preferable color for link field.
  • Link button Background Hover color. Choose most appropriate a color for your link background while hovering on it.
Description
  • Show Description.With this option, you can hide the description.
  • Description Font Size. Set most appropriate the font size of description.
  • Description Font Color. Set the color of font in description.
Link Button
  • Show Link Button. Choose whether to display Show More button.
  • Link Button Text. Define the text of the Show More button.
  • Link Button Font Color. With this option, you can select the font color for the Show More button.
  • Link Button Font Hover Color. With this option, you can select the font color for the Show More button when hovered.
  • Link Button Background Color. With this option, you can select the background color for the Show More button.
  • Link Button Background Hover Color. With this option select most appropriate background color for the Show More button when hovered.
4.3 LIghtbox-Video Gallery
Video-image
  • Video-image Width. Specify preferable size of the video.
  • Video-image Border Width. Specify preferable width of surrounded borders.
  • Video-image Border color. Using this option, you can configure your preferable the color for border.
  • Border Radius. Using this option, you can determine prefered radius of border corners.
Title
  • Title Font Size. Set the font size of the title.
  • Title Font Color. Set the color of the title.
  • Title Font Hover Color. Set the color of the title while hovering on it.
  • Title Background Color. Choose title background color.
  • Title Background Transparency. Choose the level of title background transparency.
4.4 Video Slider
Slider
  • Video Behaviour. Choose “resized” to stretch and fit your videos to the size of Slider.
  • Slider Background color. Set preferable color of the vacant part of slider field while images has its natural size.
  • Slider Border Size. Specify the size of the border in your slider.
  • Slider Border color. Choose your prefered color for border.
  • Slider Border radius Determine preferable radius for slider border.
Description
  • Description Width. Select the width of description text box.
  • Description Has Margin. Determine if description need to have margin.
  • Description Font Size. Specify the size of the letters in description.
  • Description Text color. Determine preferable color of the description text.
  • Description Text Align. Specify the location of the description in the box.
  • Description Background Transparency. Using this function, you can set background transparency degree for description.
  • Description Background color. Using this function, you can set a color for description field.
  • Description Border Size. Using this function, you can specify preferable size for the description border.
  • Description Border color. Using this function, you can specify preferable color of description border.
  • Description Border Radius . Using this function, you can specify preferable corner’s radius of the description box.
  • Description Position. Using this function, you can specify where to posit the description on the slider view.
Title
  • Title Width. Determine the width for title box.
  • Title Has Margin. Click if you’d like the title to have margin.
  • Title Font Size. Edit to set preferable size of the letters for the title.
  • Title Text color. Using this option give any other color to for the title.
  • Title Text Align. Specify the place of the title in the box.
  • Title Background Transparency.
  • Title Background color. Using this option give any other color to title background.
  • Title Border Size. Specify preferable size of the title border.
  • Title Border color. Using this option give any other color to the title border.
  • Title Border Radius. Specify preferable radius for border corners.
  • Title Position. Specify preferable position of the title.
Navigation
  • Show Navigation Arrows. Click to show navigation arrows in slider.
  • Navigation Dots Position / Hide Dots. Choose where to locate the dots, or choose to remove them.
  • Navigation Dots color. Using this option give any other color to navigation dots of slider.
  • Navigation Active Dot color. Using this option give any other color to moving dots in slider.
  • Navigation Type. Determine preferable type of your navigation arrows.
4.5 Thumbnails View
Container Style
  • Presence of a background. Click to have background for thumbs.
  • Box background color. Using this option give any other color surrounded box.
  • Box shadow. Click if you’d like to have shadows in the box.
  • Box padding. Specify desired distance between box and video.
  • Box padding. Specify desired distance between box and video.
Image
  • Video-image Behavior. Click to Determine behavior of video image.
  • Video-image Width. Allows to specify preferable width of thumbs.
  • Video-image Height. Allows to specify preferable height of thumbs.
  • Video-image Border Width. Allows to specify preferable width of the border between thumbs.
  • Video-image Border color.Using this option give any other color to the border between thumbs.
  • Border Radius. Allows to specify preferable radius of the border.
  • Margin Video. Allows to specify the distance between each thumb.
Title
  • Title Font Size. With this option give any other size to your title.
  • Title Font color. Using this option give any other color to your title.
  • Title Background Transparency. With this option specify the degree of background transparency.
  • Link text. With this option you can change the text of the link.