Slick Slider for WordPress – QuickStart

QUICKSTART GUIDE

Getting Started

The Slick Slider addon is now included with MaxGalleria Pro and no additional installations are necessary. NB: Support for our individual addons will no longer be available from the 1st May 2022.

~~Activating the Slick Slider add-on will allow you to use the Slick Slider template in your image galleries.~~

Options

Gallery Skin: Standard, Silver, Kitt, Ghost and Black are the five main options for gallery skin that will adjust how the slider image looks as well as the dots that appear below the slider.
Slider Captions Enabled: Turns on the display of the image title field. The title will appear when the mouse hovers over a slider image. The title will appear in a small box.
Slider Image Click Enabled: If enabled, a visitors click can open several different options, found below. Default setting is “disabled.”
Slider Image Click Opens: End result of a user clicking the slider image. Options are Image Page (Attachment Page), Image Link (the link you’ve set for that image) and Original Image (direct URL of image).
Auto Play Enabled: Turn auto scrolling on or off.
Auto Play Speed: From 0.5 to 10.0 in increments of 0.5, select the amount of time that each image in the slider will show before transitioning to the next image.
Display Arrows: Show or hid arrow buttons.
Display Dots: Show or hid pager dots.
Enable Mouse Drag: Allow slides to be move with a mouse drag.
Fade: Turns on fade transition effect.
Right to Left: Slides are shown from right to left.
Pause on Hover: Pause auto play when the mouse is over the image.
Pause on Dots Hover: Will pause auto play when the mouse is over the area containing the slider image dots.
Infinite: Enables infinite scrolling.
Lazy Load: Loads images as needed.
Move Slide with Touch: Enables sliding images by touch.
Transition Speed: From 0.1 to 3.0 seconds, select the amount of time the animation will take from slide to slide.
Mobile First: Will use mobile first calculation for responsive settings.
Initial Slide: Set the initial slide to start when the slider is rendered. Start with 0 as the first slider, 1 for the second slide…
Swipe: Turns on touch swipe.
Use CSS Transitions: Enable CSS Transitions.
Allow Variable Width: Disables automatic slide width calculation.
Vertical Slide: Switches the direction of the slides to vertical.
Vertical Swipe: Changes swipe direction to vertical.

Gallery Description

For each gallery you can create a description that discusses your gallery or adds extra information for anyone viewing the gallery. If enabled, you can choose to put the description above or below your gallery (default is above).

Advanced Options

MAXGalleria allows you to load your own styles and scripts if you want to add anything to the options MAXGalleria already provides. Simply use the URL of the stylesheet or JavaScript file, click “Enabled” and the scripts and styles will be loaded after the necessary MAXGalleria files.

From here you can also reset all of the gallery options to the defaults by checking the Reset option. The action cannot be undone and you will lose any previously saved options for that gallery.

Display Thumbnail Dots

Now you can display thumbnail images in place of dots. To activate this feature, check the ‘Use Thumbnails as Dots’ option and also in the ‘Custom Dot Width’ field, enter the width for the thumbnail. The height will be proportionally set.

To specify the position of the row of thumbnails below the slider. Enter the number of pixels in the ‘Dots Vertical Position’ field. To lower the row of thumbnails below the slider, the number has to be negative.

To widen the space between the thumbnails, use some custom CSS, for example:

#maxgallery-12.mg-slick-carousel .slick-dots li {
margin: 0 8px;
}

where ’12’ in #maxgallery-12.mg-slick-carousel is the ID of the MAXGalleria gallery.

8px adds eight pixels of space to each side of each thumbnail.