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

Use the [slideshow] shortcode to show images with nice transitions. To make a slideshow fill the entire page, use the the [full_slideshow] shortcode. The following parameters can be used with the [slideshow] and [full_slideshow] shortcodes.

[line_break/] [toggle_code open="false" title="Show code"][slideshow style="recover" autoplay="true" animation="scale" transition_duration="500" autoplay_interval="10000" kenburns="false"] <!-- slide 1 --> [slide] [slider_img src="/images/demo/default/slider/1.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]This is a title[/heading] [slide_text]Lorem ipsum dolor amit[/slide_text] [/slide_caption] [/slide] <!-- slide 2 --> [slide] [slider_img src="/images/demo/default/slider/2.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]Another title[/heading] [slide_text]Lorem ipsum dolor amit[/slide_text] [/slide_caption] [/slide] <!-- slide navigation --> [slide_nav position="top" align="left"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [/slide_nav] [/slideshow][/toggle_code]

The following are the parameters required when using the [slideshow] or [full_slideshow] shortcodes:

Parameters	Description
style	Defines the slideshow style. This parameter cannot be left blank. You can set the style as default or recover
autoplay	Set it to true to have the slideshow play automatically. Otherwise, set to false to stop the automatic play.
animation	Set the transition animation between slides
transition_duration	set the duration for the transition animation
autoplay_interval	Set the duration between switching slideshow items
kenburns	Set it to true or false to enable/disable kenburns effect to an image

[line_break/]

See the UIkit documentation on the available animations available for the slideshow component

[line_break/] [heading size="h3" style="uk-module-title uk-margin-top"]Default Slideshow[/heading] [slideshow style="default" autoplay="true" animation="scale" transition_duration="500" autoplay_interval="10000" kenburns="false"] [slide][slider_img src="/images/demo/default/slider/1.jpg" width="1200" height="500" alt="image"/][/slide] [slide][slider_img src="/images/demo/default/slider/2.jpg" width="1200" height="500" alt="image"/][/slide] [slide][slider_img src="/images/demo/default/slider/3.jpg" width="1200" height="500" alt="image"/][/slide] [slide_nav align="center"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [slide_nav_item order="2"/] [/slide_nav] [/slideshow] [badge style="note uk-margin-top"]markup[/badge] [toggle_code open="false" title="Show code"] [slideshow style="default" autoplay="true" animation="scale" transition_duration="500" autoplay_interval="10000" kenburns="false"] [slide][slider_img src="/images/demo/default/slider/1.jpg" width="1200" height="500" alt="image"/][/slide] [slide][slider_img src="/images/demo/default/slider/2.jpg" width="1200" height="500" alt="image"/][/slide] [slide][slider_img src="/images/demo/default/slider/3.jpg" width="1200" height="500" alt="image"/][/slide] [slide_nav align="center"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [slide_nav_item order="2"/] [/slide_nav] [/slideshow] [/toggle_code] [line_break/] [heading size="h3" style="uk-module-title uk-margin-top"]Recover Slideshow[/heading] [slideshow style="recover" autoplay="true" animation="scale" transition_duration="500" autoplay_interval="10000" kenburns="true"] [slide] [slider_img src="/images/demo/default/slider/1.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]This is a title[/heading] [slide_text]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet nibh. Vivamus non arcu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. [/slide_text] [button style="default uk-button-large" href="#" target="_self"]Learn more[/button] [/slide_caption] [/slide] [slide] [slider_img src="/images/demo/default/slider/2.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]Another title[/heading] [slide_text]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet nibh. Vivamus non arcu. Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/slide_text] [button style="default uk-button-large" href="#" target="_self"]Learn more[/button] [/slide_caption] [/slide] [slide] [slider_img src="/images/demo/default/slider/3.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]A simple title[/heading] [slide_text]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet nibh. Vivamus non arcu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. [/slide_text] [button style="default uk-button-large" href="#" target="_self"]Learn more[/button] [/slide_caption] [/slide] [slide_nav align="right"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [slide_nav_item order="2"/] [/slide_nav] [/slideshow] [badge style="note uk-margin-top"]markup[/badge] [toggle_code open="false" title="Show code"] [slideshow style="recover" autoplay="true" animation="scale" transition_duration="500" autoplay_interval="10000" kenburns="true"] [slide] [slider_img src="/images/demo/default/slider/1.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]This is a title[/heading] [slide_text]Lorem ipsum dolor amit[/slide_text] [button style="default uk-button-large" href="#" target="_self"]Learn more[/button] [/slide_caption] [/slide] [slide] [slider_img src="/images/demo/default/slider/2.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]Another title[/heading] [slide_text]Lorem ipsum dolor amit[/slide_text] [button style="default uk-button-large" href="#" target="_self"]Learn more[/button] [/slide_caption] [/slide] [slide] [slider_img src="/images/demo/default/slider/3.jpg" width="1200" height="500" alt="image"/] [slide_caption animation="slide-left"] [heading size="h3"]A simple title[/heading] [slide_text]Lorem ipsum dolor amit[/slide_text] [button style="default uk-button-large" href="#" target="_self"]Learn more[/button] [/slide_caption] [/slide] [slide_nav align="right"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [slide_nav_item order="2"/] [/slide_nav] [/slideshow] [/toggle_code] [line_break/] [heading size="h3" style="uk-module-title uk-margin-top"]Testimonials in slideshow[/heading] [slideshow style="scroller" autoplay="true" animation="scroll" transition_duration="500" autoplay_interval="10000" kenburns="false"] [slide] [testimonial author="Gary Long" title="CEO" avatar="images/demo/avatar/client-1-thumb.png" icon="comment-o"]Believe in yourself! Have faith in your abilities! Without a humble but reasonable confidence in your own powers you cannot be successful or happy.[/testimonial] [/slide] [slide] [testimonial author="Lori Carroll" title="Chief Editor" avatar="images/demo/avatar/client-2-thumb.png" icon="comment-o"]Do not dream of the future, concentrate the mind on the present moment. Dream big. Go forward Never allow yourself to be made a victim. Accept no one's definition.[/testimonial] [/slide] [slide] [testimonial author="Paul Morgan" title="Creative Designer" avatar="images/demo/avatar/client-3-thumb.png" icon="comment-o"]Everything should be as simple as it is, but not simpler; Believe that life is worth living and your belief will help create the fact. We help your ideas come to life.[/testimonial] [/slide] [slide_nav align="center"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [slide_nav_item order="2"/] [/slide_nav] [/slideshow][line_break/] [badge style="note uk-margin-top"]markup[/badge] [toggle_code open="false" title="Show code"] [slideshow style="scroller" autoplay="true" animation="scroll" transition_duration="500" autoplay_interval="10000" kenburns="false"] [slide] [testimonial author="Gary Long" title="CEO" avatar="images/demo/avatar/client-1-thumb.png" icon="comment-o"]Believe in yourself! Have faith in your abilities! Without a humble but reasonable confidence in your own powers you cannot be successful or happy.[/testimonial] [/slide] [slide] [testimonial author="Lori Carroll" title="Chief Editor" avatar="images/demo/avatar/client-2-thumb.png" icon="comment-o"]Do not dream of the future, concentrate the mind on the present moment. Dream big. Go forward Never allow yourself to be made a victim. Accept no one's definition.[/testimonial] [/slide] [slide] [testimonial author="Paul Morgan" title="Creative Designer" avatar="images/demo/avatar/client-3-thumb.png" icon="comment-o"]Everything should be as simple as it is, but not simpler; Believe that life is worth living and your belief will help create the fact. We help your ideas come to life.[/testimonial] [/slide] [slide_nav align="center"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [slide_nav_item order="2"/] [/slide_nav] [/slideshow] [/toggle_code] [line_break/] [heading size="h3" style="uk-module-title uk-margin-top"]Slideshow Panel[/heading] [slideshow_panel id="1" style="recover" slide-width="1-2" animation="swipe"] [slide][slider_img src="/images/demo/default/content/content-1.jpg" width="650" height="420" alt="demo"/][/slide] [slide][slider_img src="/images/demo/default/content/content-2.jpg" width="650" height="420" alt="demo"/][/slide] [/slideshow_panel] [slide_panel_nav align="bottom"] [slide_nav_item order="0"/] [slide_nav_item order="1"/] [/slide_panel_nav] [slideshow_panel_content id="1" content-width="1-2"] [slide_panel_item title="We provide timely support" link="#"] Do not dwell in the past, do not dream of the future. Let reality be reality. Let things flow naturally. Do not dwell in the past, do not dream of the future. Everything should be as simple as it is, but not simpler; Believe that life is worth living and your belief will help create the fact. We help your ideas come to life.[/slide_panel_item] [slide_panel_item title="We keep our word" link="#"]Let reality be reality. Let things flow naturally. Do not dwell in the past, do not dream of the future. Do not dwell in the past, do not dream of the future. Everything should be as simple as it is, but not simpler; Believe that life is worth living and your belief will help create the fact. We help your ideas come to life.[/slide_panel_item] [/slideshow_panel_content] [line_break/] [badge style="note uk-margin-top"]markup[/badge] [toggle_code open="false" title="Show code"][slideshow_panel id="1" style="recover" slide-width="1-2" animation="swipe"] [slide][slider_img src="/images/demo/default/content/content-1.jpg" width="650" height="420" alt="demo"/][/slide] [slide][slider_img src="/images/demo/default/content/content-2.jpg" width="650" height="420" alt="demo"/][/slide] [/slideshow_panel] [slide_panel_nav align="bottom"] [slide_nav_item order="0"/][/slide_nav_item] [slide_nav_item order="1"/][/slide_nav_item] [/slide_panel_nav] [slideshow_panel_content id="1" content-width="1-2"] [slide_panel_item title="We provide timely support" link="#"] Do not dwell in the past, do not dream of the future. Let reality be reality. Let things flow naturally. Do not dwell in the past, do not dream of the future. Everything should be as simple as it is, but not simpler; Believe that life is worth living and your belief will help create the fact. We help your ideas come to life.[/slide_panel_item] [slide_panel_item title="We keep our word" link="#"]Let reality be reality. Let things flow naturally. Do not dwell in the past, do not dream of the future. Do not dwell in the past, do not dream of the future. Everything should be as simple as it is, but not simpler; Believe that life is worth living and your belief will help create the fact. We help your ideas come to life.[/slide_panel_item] [/slideshow_panel_content][/toggle_code]