Introduction

The slider shortcode has multiple different slider types to choose from. The different slider types have their own strengths and limitations. Each slider is mobile responsive.

Basic Slider

The basic slider type cycles through the slides. Each slide can contain different types of content (ex. image, video, html, shortcodes, etc.) and can be different sizes. The slider has the option to pause when the mouse is hovered over and you can control the speed. However, there aren’t controls that allow the user to control the slider.

Owl Carousel

The Owl Carousel slider is the most feature rich slider type. It includes navigation controls which can be set to show in eight different locations. You can also control the size, icon, color, text, border radius, and more for the navigation controls.

The Owl Carousel allows you to control how many items to show for different screen sizes. If you choose to show more than one item, the slides will automatically be paged with the option to show the paging navigation as bullets or numbers.

In this example we use the Owl Carousel in a full width content section. This is good for showing product images, promotional materials, and more.

Flexslider

The Flexslider is a similar to the Owl Carousel but with less options. It is a good in-between slider that works better in certain situations.

When showing more than one item at a time, the Flexslider is less forgiving than the Owl Slider and requires you to specify the width of the items.

Explore More Shortcodes

[intense_content_section]
<h2>Introduction</h2>
The slider shortcode has multiple different slider types to choose from. The different slider types have their own strengths and limitations. Each slider is mobile responsive.
[/intense_content_section]
[intense_content_section background_type="color" background_color="#f9f9f9" border_top="1px solid #ededed" border_bottom="1px solid #ededed"]
<h2>Basic Slider</h2>
The basic slider type cycles through the slides. Each slide can contain different types of content (ex. image, video, html, shortcodes, etc.) and can be different sizes. The slider has the option to pause when the mouse is hovered over and you can control the speed. However, there aren't controls that allow the user to control the slider.

[intense_row padding_top="0"]
[intense_column size="2" medium_size="2"][/intense_column]
[intense_column size="8" medium_size="8"]
[intense_slider type="basic" speed="3000"]
[intense_slide]
[intense_image image="2180" size="postWide" title="nightlife"]
[/intense_slide]
[intense_slide]
[intense_image image="2184" size="postWide" title="nightlife"]
[/intense_slide]
[intense_slide]
[intense_image image="2181" size="postWide" title="nightlife"]
[/intense_slide]
[/intense_slider]
[/intense_column]
[intense_column size="2" medium_size="2"][/intense_column]
[/intense_row]
[/intense_content_section]
[intense_content_section]
<h2>Owl Carousel</h2>
The Owl Carousel slider is the most feature rich slider type. It includes navigation controls which can be set to show in eight different locations. You can also control the size, icon, color, text, border radius, and more for the navigation controls.

The Owl Carousel allows you to control how many items to show for different screen sizes. If you choose to show more than one item, the slides will automatically be paged with the option to show the paging navigation as bullets or numbers.

[intense_slider type="owl-carousel" navigation_prev_text="Previous" navigation_next_text="Next" items_tablet="2" items_mobile="2"]
[intense_slide][intense_image image="2180" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2184" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2181" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2185" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="780" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="781" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="779" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="776" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="771" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="759" size="small240" title="nightlife"][/intense_slide]
[/intense_slider]

[intense_slider type="owl-carousel" items="3" items_desktop="3" items_desktop_small="2" items_tablet="1" navigation_position="middleoutside" navigation_size="medium" navigation_color="#fff" navigation_font_color="primary" navigation_pagination_type="numbers"]
[intense_slide][intense_image image="2180" size="medium500" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2184" size="medium500" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2181" size="medium500" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2185" size="medium500" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="780" size="medium500" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="781" size="medium500" title="nightlife"][/intense_slide]
[/intense_slider]

[intense_row padding_top="0"]
[intense_column size="2" medium_size="2"][/intense_column]
[intense_column size="8" medium_size="8"]
[intense_slider type="owl-carousel" items="1" items_desktop="1" items_desktop_small="1" items_tablet="1 navigation_position="bottomright" navigation_pagination_type="none" navigation_prev_border_radius="50%" navigation_next_border_radius="50%" navigation_prev_icon="double-angle-left" navigation_next_icon="double-angle-right"]
[intense_slide][intense_image image="2185" size="large1024" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="780" size="large1024" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="781" size="large1024" title="nightlife"][/intense_slide]
[/intense_slider]
[/intense_column]
[intense_column size="2" medium_size="2"][/intense_column]
[/intense_row]
[/intense_content_section]
[intense_content_section size="full"]
<div class="intense container">In this example we use the Owl Carousel in a full width content section. This is good for showing product images, promotional materials, and more.</div>
[intense_slider type="owl-carousel" items="1" items_desktop="1" items_desktop_small="1" items_tablet="1" navigation_position="middleoutside" navigation_size="large" navigation_color="#ffffff" navigation_font_color="#666" navigation_pagination_type="none"]
[intense_slide]
[intense_row padding_top="30"]
[intense_column size="2" medium_size="2"][/intense_column]
[intense_column size="8" medium_size="8"]
[intense_image image="2184" size="postExtraWide" title="Photography"]
[/intense_column]
[intense_column size="2" medium_size="2"][/intense_column]
[/intense_row]
[/intense_slide]
[intense_slide]
[intense_row padding_top="30"]
[intense_column size="2" medium_size="2"][/intense_column]
[intense_column size="8" medium_size="8"]
[intense_image image="2181" size="postExtraWide" title="Photography"]
[/intense_column]
[intense_column size="2" medium_size="2"][/intense_column]
[/intense_row]
[/intense_slide]
[intense_slide]
[intense_row padding_top="30"]
[intense_column size="2" medium_size="2"][/intense_column]
[intense_column size="8" medium_size="8"]
[intense_image image="781" size="postExtraWide" title="Photography"]
[/intense_column]
[intense_column size="2" medium_size="2"][/intense_column]
[/intense_row]
[/intense_slide]
[/intense_slider]
[/intense_content_section]
[intense_content_section background_type="color" background_color="#f9f9f9" border_top="1px solid #ededed" border_bottom="1px solid #ededed" ]
<h2>Flexslider</h2>
The Flexslider is a similar to the Owl Carousel but with less options. It is a good in-between slider that works better in certain situations.
[intense_row padding_top="0"]
[intense_column size="2" medium_size="2"][/intense_column]
[intense_column size="8" medium_size="8"]
[intense_slider transition="goDown"]
[intense_slide][intense_image image="2185" size="large1024" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="780" size="large1024" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="781" size="large1024" title="nightlife"][/intense_slide]
[/intense_slider]
[/intense_column]
[intense_column size="2" medium_size="2"][/intense_column]
[/intense_row]

When showing more than one item at a time, the Flexslider is less forgiving than the Owl Slider and requires you to specify the width of the items.
[intense_slider item_width="240" ]
[intense_slide][intense_image image="2180" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2184" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2181" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="2185" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="780" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="781" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="779" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="776" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="771" size="small240" title="nightlife"][/intense_slide]
[intense_slide][intense_image image="759" size="small240" title="nightlife"][/intense_slide]
[/intense_slider]
[/intense_content_section]

[intense_snippet snippet_id="Child Theme | Shortcodes/footer" snippet_title="Shortcode Page Footer"]