Slider Widget

Create a series of items that you can scroll through using the mouse, touch gestures or a regular navigation. You can apply overlays and several styles to Slider items.

Center Image

The Slider provides the option of centering the items, so that the active item will be displayed in the middle. Images that spill over the width of the Slider will be cut off.

Image Hover

You can display both image and content statically or on hover. Choose from a number of animations for the image and the overlay or even display a second image on hover.

Infinite Scrolling

By default, the Slider loops the items, enabling you to scroll infinitely through the Slider. But you can also disable this, so that it stops after reaching the final item.

Slider Options

Slider Options Settings Description
Navigation Slidenav None, Default, Top/Left, Top/Right, Bottom/Left, Bottom/Right Display or hide the prev/next navigation and define the alignment.
Mode Infinite Items are looped and you can scroll endless.
Mode Center Center active item.
Columns Phone Portrait 1, 2, 3, 4, 5, 6 Number of columns on phones in portrait view.
Columns Phone Landscape Inherit, 1, 2, 3, 4, 5, 6 Number of columns on phones in landscape view.
Columns Tablet Inherit, 1, 2, 3, 4, 5, 6 Number of columns on tablets.
Columns Desktop Inherit, 1, 2, 3, 4, 5, 6 Number of columns on desktops.
Columns Large Screens Inherit, 1, 2, 3, 4, 5, 6 Number of columns on large screens.
Height Fullscreen Extend media to full viewport height.
Min Height [Number] Minimum height of the media.
Media Options Settings Description
Display Show Media Display the media of all items.
Media Image [Number] Set the width and height of images in pixels.
Overlay Content Toggle overlay content on hover.
Overlay Background None, Static, On hover Set the visiblity of the overlay background.
Overlay Animation Fade, Slide Top, Slide Bottom, Slide Left, Slide Right Select the animation used to show the overlay.
Overlay Image Static, On hover, Second Image on hover Set the visibility of the overlay image.
Overlay Link Link entire overlay, if link exists.
Content Options Settings Description
Text Display Show or hide title and content.
Text Title Size H1, H2, H3, H4, Extra Large Define the font size of the title.
Text Content Size Default, Text Large, H2, H3, H4 Define the font size of the title.
Text Alignment Left, Right, Center Define the text alignment.
Link Display Display the Read More link. The link URL is added to each item in the Content Manager.
Link Style Text, Button, Button Primary, Button Large, Button Large Primary Set the style of the Read More link.
Link Text [Text] Define the link text.
General Options Settings Description
Custom HTML Class [Text] Set a custom HTML class that will be added to the widget element in the rendered output.

Leave a comment

Get Widgetkit for WordPress or Joomla.

Buy Widgetkit