Installation

Installation of WP Slick Slider and Image Carousel Pro requires a few small clicks. To install the plugin, please use the following steps:

  • Buy WP Slick Slider and Image Carousel Pro plugin and Upload the “wp-slick-slider-and-image-carousel-pro” folder to the ‘/wp-content/plugins/’ directory.
  • You can also go to Plugins-> Add New -> upload wp-slick-slider-and-image-carousel-pro.zip
  • Activate the WP Slick Slider and Image Carousel Pro plugin through the “Plugins” menu in WordPress.
  • Enter the WP Slick Slider Plugin License under Slick Slider Pro -> WP Slick Slider Plugin License.

WP Slick Slider and Image Carousel Pro should now be installed successfully!

Getting started with WP Slick Slider and Image Carousel Pro

WP Slick Slider and Image Carousel Pro adds a Menu tab in WP Admin side with the name “Slick Slider Pro” where you can add new Image Title, Content, Link and Image as a featured image, edit and delete.

Screen shows “Slick Slider Pro” tab in the left side and All Images added
slick-slider-1

This plugin work same like WordPress post section where you can add title, content and featured image. To add a news slide in WP Slick Slider just need to follow few steps.

  • Go to Slick Slider Pro Tab and click on add slide
  • Add Image title, content, Read more link and featured image and update
  • If you want to display category wise then go to Slick Slider -> Slider Category and create a category
  • When you create a slide, select the category for that slide

Below screen shows how to add a Image for image slider
slick-slider-2

If you want to display category wise then go to Slick Slider Pro -> Slider Category and select the shortcode.

Below screen show category shortcode
slider-category

How to display and shortcode

Display a Slick Image slider is very simple. Just add the following shortcode on any page to display image slider
[slick-slider] – Slick Slider
[slick-carousel-slider] – Slick Carousel Slider
[slick-variable-slider] – Slick Variable Slider

If you want to select the design then you can use following parameter :
[sick-slider design="prodesign-1"]
Where design are prodesign-1, prodesign-2, prodesign-3, prodesign-4, prodesign-5, prodesign-6, prodesign-7, prodesign-8, prodesign-9, prodesign-10, prodesign-17, prodesign-18, prodesign-19, prodesign-20

[slick-carousel-slider design="prodesign-11"]
Where design are prodesign-11, prodesign-12, prodesign-13, prodesign-14, prodesign-15, prodesign-16, prodesign-17, prodesign-18, prodesign-19, prodesign-20

[slick-variable-slider design="prodesign-13"]
Where design are prodesign-13, prodesign-14, prodesign-15, prodesign-16, prodesign-17, prodesign-18, prodesign-19, prodesign-20

You can also use template code to display image slider in your theme template.

Complete Shortcode parameters

Use Following parameters with shortcode

[slick-slider]

  • Limit: [slick-slider limit="8"] (Limit define the number of slides to be display at a time. By default set to “15”. if you want to display all images then set limit to limit=”-1″.)
  • Design: [slick-slider design="prodesign-1"] (You can select 10 design for your slider. Designs are prodesign-1 to prodesign-10 and prodesign-17, prodesign-18, prodesign-19, prodesign-20 )
  • Category: [slick-slider category="category_ID"] ( Display slider by their category ID. )
  • Include Cat Child: [slick-slider include_cat_child="true"] (Display child category slides. Values are “true” OR “false”.)
  • Show Content: [slick-slider show_content="true" ] (Display content OR not. By default value is “true”. Options are “true OR false”.)
  • Slider Loop: [slick-slider loop="true" ] (Create a Infinite loop sliding. By default value is “true”. Options are “true OR false”).
  • Slider Pagination and Arrows: [slick-slider dots="false" arrows="false"]
  • Autoplay: [slick-slider autoplay="true"] (Start slider automatically. Values are “true” OR “false”.)
  • Autoplay Interval: [slick-slider autoplay_interval="3000"] (Delay between two slides.)
  • Slider Speed: [slick-slider speed="3000"] (Control speed of slider.)
  • Fade: [slick-slider fade="true"] (Slider Fade effect. By default effect is slide. If you set fade=”true” then effect change from slide to fade.)
  • Slider Height: [slick-slider sliderheight="400"] (Set Slider height. By default given 400px height.)
  • Show Read More: [slick-slider show_read_more="false"] (Show/Hide read more links. Values are “true” and “false”.)
  • Read More Text: [slick-slider read_more_text="More"] (Control read more button text.)
  • Link Target: [slick-slider link_target="blank"] (Open link in a same window or in a new tab. Values are “self” OR “blank”.)
  • Order: [slick-slider order="DESC"] (Controls slides order. Values are “ASC” OR “DESC”.)
  • Order By: [slick-slider orderby="date"] (Display slides in your order. Values are “date”, “modified”, “title” (Post Title), “ID”, “rand” (Random), “menu_order” (Sort Order).)
  • Exclude Category: [slick-slider exclude_cat="1,5,6"] (Exclude some slider category which you do not want to display.)
  • Exclude Post: [slick-slider exclude_post="1,5,6"] (Exclude some slides which you do not want to display.)
  • Display Specific Posts: [slick-slider posts="1,5,6"] (Display only specific slides.)
  • Slider Nav Column: [slick-slider slider_nav_column="3"] (Number of columns for slider navigation. Only applicable to Design 4,5,6)

Use Following parameters with shortcode

[slick-carousel-slider]

  • Limit: [slick-carousel-slider limit="8"] (Limit define the number of slides to be display at a time. By default set to “15”. if you want to display all images then set limit to limit=”-1″.)
  • Design: [slick-carousel-slider design="prodesign-11"] (You can select 6 design for your carousel slider. Designs are prodesign-11 to prodesign-20 ).
  • Category: [slick-carousel-slider category="category_ID"] ( Display slider by their category ID ).
  • Include Cat Child: [slick-carousel-slider include_cat_child="true"] (Display child category slides. Values are “true” OR “false”.)
  • Image Display Size: [slick-carousel-slider image_size="large"] ( Display appropriate image size from WordPress. Default is “large”. Values are thumbnail, medium, large, original.)
  • Slides Column: [slick-carousel-slider slidestoshow="3"] (Display number of slides at a time in slider.)
  • Slides to Scroll: [slick-carousel-slider slidestoscroll="1"] (Scroll number of slides at a time.)
  • Show Content: [slick-carousel-slider show_content="true"] (Display content OR not. By default value is “true”. Options are “true OR false”).
  • Slider Loop: [slick-carousel-slider loop="true"] (Create a Infinite loop sliding. By default value is “true”. Options are “true OR false”).
  • Slider Pagination and Arrows: [slick-carousel-slider dots="false" arrows="false"]
  • Autoplay: [slick-carousel-slider autoplay="true"] (Start slider automatically. Values are “true” OR “false”.)
  • Autoplay Interval: [slick-carousel-slider autoplay_interval="3000"] (Delay between two slides.)
  • Slide Speed: [slick-carousel-slider speed="3000"]
  • Center Mode: [slick-carousel-slider centermode="true"] ( Enables centered view with partial previous/next slides. Use with odd numbered slidesToShow counts and slides_to_scroll=”1″. By default value is “false”)
  • Variable Width: [slick-carousel-slider variablewidth="true"] (Variable width of images in slider. By default value us “false”.)
  • Show Read More: [slick-carousel-slider show_read_more="false"] (Show/Hide read more links. Values are “true” and “false”.)
  • Read More Text: [slick-carousel-slider read_more_text="More"] (Control read more button text.)
  • Link Target: [slick-carousel-slider link_target="blank"] (Open link in a same window or in a new tab. Values are “self” OR “blank”.)
  • Order: [slick-carousel-slider order="DESC"] (Controls slides order. Values are “ASC” OR “DESC”.)
  • Order By: [slick-carousel-slider orderby="date"] (Display slides in your order. Values are “date” (Post Date), “modified” (Post Modified Date), “title” (Post Title), “ID”, “rand” (Random), “menu_order” (Sort Order).)
  • Exclude Category: [slick-carousel-slider exclude_cat="1,5,6"] (Exclude some slider category which you do not want to display.)
  • Exclude Post: [slick-carousel-slider exclude_post="1,5,6"] (Exclude some slides which you do not want to display.)
  • Display Specific Posts: [slick-carousel-slider posts="1,5,6"] (Display only specific slides.)
  • Slider Height: [slick-carousel-slider sliderheight="400"] (Set Carousel Slider height.)

Use Following parameters with shortcode

[slick-variable-slider]

  • Limit: [slick-variable-slider limit="8"] (Limit define the number of slides to be display at a time. By default set to “15”. if you want to display all images then set limit to limit=”-1″.)
  • Design: [slick-variable-slider design="prodesign-13"] (You can select 8 design for your slider. Designs are prodesign-13, prodesign-14, prodesign-15, prodesign-16, prodesign-17, prodesign-18, prodesign-19, prodesign-20 )
  • Category: [slick-variable-slider category="category_ID"] ( Display slider by their category ID. )
  • Include Cat Child: [slick-variable-slider include_cat_child="true"] (Display child category slides. Values are “true” OR “false”.)
  • Image Display Size: [slick-carousel-slider image_size="large"] ( Display appropriate image size from WordPress. Default is “full”. Values are thumbnail, medium, large, full.)
  • Show Content: [slick-variable-slider show_content="true"] (Display content OR not. By default value is “true”. Options are “true OR false”.)
  • Slider Loop: [slick-variable-slider loop="true"] (Create a Infinite loop sliding. By default value is “true”. Options are “true OR false”).
  • Slider Pagination and Arrows: [slick-variable-slider dots="false" arrows="false"]
  • Autoplay: [slick-variable-slider autoplay="true"] (Start slider automatically. Values are “true” OR “false”.)
  • Autoplay Interval: [slick-variable-slider autoplay_interval="3000"] (Delay between two slides.)
  • Slider Speed: [slick-variable-slider speed="3000"] (Control speed of slider.)
  • Slider Height: [slick-variable-slider sliderheight="400"] (Set Slider height. By default given 400px height.)
  • Show Read More: [slick-variable-slider show_read_more="false"] (Show/Hide read more links. Values are “true” and “false”.)
  • Read More Text: [slick-variable-slider read_more_text="More"] (Control read more button text.)
  • Link Target: [slick-variable-slider link_target="blank"] (Open link in a same window or in a new tab. Values are “self” OR “blank”.)
  • Order: [slick-variable-slider order="DESC"] (Controls slides order. Values are “ASC” OR “DESC”.)
  • Order By: [slick-variable-slider orderby="date"] (Display slides in your order. Values are “date”, “modified”, “title” (Post Title), “ID”, “rand” (Random), “menu_order” (Sort Order).)
  • Exclude Category: [slick-variable-slider exclude_cat="1,5,6"] (Exclude some slider category which you do not want to display.)
  • Exclude Post: [slick-variable-slider exclude_post="1,5,6"] (Exclude some slides which you do not want to display.)
  • Display Specific Posts: [slick-variable-slider posts="1,5,6"] (Display only specific slides.)

Slick Slider with Custom Order

You can display Slick Slider in custom order with Drag & Drop interface. Click on ‘Sort slides link on Slick Slider listing page, Drag FAQ’s row and click the ‘Save Sort Order’ button to save.
slick-slider

Note: Put orderby='menu_order' order="ASC" parameter in Slick Slider shortcode for custom ordering.