[heading size="h2" style="uk-module-title"]Slider[/heading]

To create a slideset of panels with filters, use the [slider] shortcode. The settings attribute can be used configure the parameters of the slider. See this table for all the available settings options.

[line_break/]

Parameter	Description
default	Number of default visible in a slide set
small	Number of visible in a slide set at small breakpoint i.e. when viewed on a phone
medium	Number of visible in a slide set at medium breakpoint i.e. when viewed on a tablet
large	Number of visible in a slide set at large breakpoint i.e. when viewed on a laptop/desktop
xlarge	Number of visible in a slide set at extra large breakpoint i.e. when viewed on a large screen

[line_break/]

The slideset allows you to set different filters by using the [slider_filters] shortcode.

[badge style="note"]markup[/badge] [code] [slider_filters] [filter_button style="uk-active" tag=""]All[/filter_button] [filter_button style="uk-active" tag="design"]design[/filter_button] [filter_button style="uk-active" tag="mockup"]mockup[/filter_button] [/slider_filters] [/code] [line_break/] [slider style="tm-slideset-recover" settings="default: 1,small: 2,medium: 2,large: 3, xlarge: 3" animation="slide-horizontal"] [slider_filters] [filter_button tag=""]All[/filter_button] [filter_button tag="interior"]Interior[/filter_button] [filter_button tag="building"]Buildings[/filter_button] [filter_button tag="family-house"]Family House[/filter_button] [filter_button tag="green-building"]Green Building[/filter_button] [filter_button tag="office"]office[/filter_button] [/slider_filters] [slideset title="Business Center" tag="building,green-building" src="/images/demo/projects/1.jpg" large_src="images/demo/projects/1-large.jpg" width="480" height="480" url=""/] [slideset title="Office Building" tag="building,office" src="/images/demo/projects/2.jpg" large_src="images/demo/projects/2-large.jpg" width="480" height="480" url=""/] [slideset title="Family House" tag="family-house,interior" src="/images/demo/projects/3.jpg" large_src="images/demo/projects/3-large.jpg" width="480" height="480" url=""/] [slideset title="Leisure center" tag="family-house,green-building" src="/images/demo/projects/4.jpg" large_src="images/demo/projects/4-large.jpg" width="480" height="480" url=""/] [slideset title="Entertainment Center" tag="building,office" src="/images/demo/projects/5.jpg" large_src="images/demo/projects/5-large.jpg" width="480" height="480" url=""/] [slideset title="Modern Building" tag="building,family-house" src="/images/demo/projects/6.jpg" large_src="images/demo/projects/6-large.jpg" width="480" height="480" url=""/] [slideset title="Shopping Mall" tag="family-house,interior,office" src="/images/demo/projects/7.jpg" large_src="images/demo/projects/7-large.jpg" width="480" height="480" url=""/] [slideset title="Storage" tag="building,green-building" src="/images/demo/projects/8.jpg" large_src="images/demo/projects/8-large.jpg" width="480" height="480" url=""/] [slideset title="Office Building" tag="building,office" src="/images/demo/projects/9.jpg" large_src="images/demo/projects/9-large.jpg" width="480" height="480" url=""/] [slideset title="Business center" tag="green-building" src="/images/demo/projects/10.jpg" large_src="images/demo/projects/10-large.jpg" width="480" height="480" url=""/] [/slider] [line_break/] [toggle_code open="false" title="Show code"] [slider style="tm-slideset-recover" settings="default: 1,small: 2,medium: 2,large: 3, xlarge: 3" animation="slide-horizontal"] [slider_filters] [filter_button tag=""]All[/filter_button] [filter_button tag="interior"]Interior[/filter_button] [filter_button tag="building"]Buildings[/filter_button] [filter_button tag="family-house"]Family House[/filter_button] [filter_button tag="green-building"]Green Building[/filter_button] [filter_button tag="office"]office[/filter_button] [/slider_filters] [slideset title="Business Center" tag="building,green-building" src="/images/demo/projects/1.jpg" large_src="images/demo/projects/1-large.jpg" width="480" height="480" url=""/] [slideset title="Office Building" tag="building,office" src="/images/demo/projects/2.jpg" large_src="images/demo/projects/2-large.jpg" width="480" height="480" url=""/] [slideset title="Family House" tag="family-house,interior" src="/images/demo/projects/3.jpg" large_src="images/demo/projects/3-large.jpg" width="480" height="480" url=""/] [slideset title="Leisure center" tag="family-house,green-building" src="/images/demo/projects/4.jpg" large_src="images/demo/projects/4-large.jpg" width="480" height="480" url=""/] [/slider] [/toggle_code]