Gungor Budak

<a href="http://www.gungorbudak.com/slidy" title="Slidy / Responsive jQuery WordPress Slider" rel="nofollow ugc">Slidy</a> is a reponsive jQuery slider that uses <a href="http://kenwheeler.github.io/slick/" title="slick - the last carousel you'll ever need" rel="nofollow ugc">slick carousel by Ken Wheeler</a> and it’s fully integrated into WordPress, so it’s possible to add and administer slides via the Dashboard. You just need to set the image that you want to see in Slidy as the featured image in each post. Slides can be categorized and in this way you can have different sliders on your website. With the functionalities slick carousel brings, it is possible to create sliders in different ways, such as having multiple items unlike many sliders. Also, with the wide range of settings, you can customize your slider in various ways such as inifinite looping, mouse dragging, swiping, arrow key navigation etc. You can also add links to the individual slides via Add/Edit Slide interface. The slides are posts at the same time so you can use them as contents but you may have to edit your theme to view slide images. Note that this version doesn’t cover all functionalities slick carousel provided but the present functionalities are very sufficent for you to create awesome sliders. Check out <a href="https://wordpress.org/plugins/slidy/screenshots/" title="Slidy's Screenshots" rel="ugc">Slidy’s screenshots here</a>.
How to use Slidy
Find the example below for inserting it directly into the template
<pre><code>$args = array(
 'category' => 'home-page',
 'autoplay' => 'true',
 'autoplaySpeed' => '500',
 'dots' => 'true',
 'slidesToShow' => '3',
 'slidesToScroll' => '1'
);

if( function_exists( 'slidy_create' ) ){ slidy_create( $args ); }
</code></pre>
Find the example below for inserting it using shortcode
<pre><code>[slidy category="" title="false" autoplay="true" autoplaySpeed="500" dots="true" slideToShow="3" slideToScroll="1"]
</code></pre>
Options you can set for the template insert / shortcode
<ul>
<li>category (none) – category of the slides (must be slug)</li>
<li>number (5) – number of sliders to be shown</li>
<li>title (true) – title of the slides</li>
<li>autoplay (true) – autoplay of the slides</li>
<li>autoplaySpeed (3000) – speed of the autoplay</li>
<li>arrows (true) – navigation arrows</li>
<li>cssEase (“ease”) – CSS3 Animation Easing</li>
<li>dots (true) – navigation dots</li>
<li>draggable (true) – desktop mouse dragging</li>
<li>fade (false) – fade transition (only possible when slidesToShow is 1)</li>
<li>infinite (true) – infinite looping of the slides</li>
<li>pauseOnHover (true) – pause when hover the slides</li>
<li>pauseOnDotsHover (false) – pause when hover the navigation dots</li>
<li>slidesToShow (1) – number of slides to show in one time</li>
<li>slidesToScroll (1) – number of slides to scroll in one time</li>
<li>speed (300) – speed of the scrolling</li>
<li>swipe (true) – swiping</li>
<li>touchMove (true) – touch move</li>
<li>touchThreshold (5) – threshold of the touch move</li>
<li>useCSS (true) – CSS transitions</li>
</ul>
The plugin is written in English and has been translated into Turkish by <a href="http:/www.gungorbudak.com/" title="Güngör Budak" rel="nofollow ugc">myself</a>. You’re welcomed if you want to translate it into your language. Use translations.pot, rename it as slidy-LANGCODE.po (e.g. slidy-tr_TR) and open it in Poedit. Translate and save. There should be a MO file created by Poedit. Send PO and MO files to me, then I will add them in the next release.

Slidy

Slidy is a responsive jQuery slider that uses slick carousel. Insert it directly into a template or with its shortcode into pages, posts & widgets …

lloydwatkin

Shortcode Options
All of these options can also be set via the settings page, however if you’d like different settings for different carousels, you can override these by using shortcode options…
<ul>
<li>
<code>orderby</code> and <code>order</code> (default <code>menu_order</code> <code>ASC</code>)
<ul>
<li>What order to display the posts in. Uses <a href="https://codex.wordpress.org/Class_Reference/WP_Query#Order_.26_Orderby_Parameters" rel="nofollow ugc">WP_Query terms</a>.</li>
<li><code>[slick-carousel orderby="rand"]</code></li>
<li><code>[slick-carousel orderby="date" orderby="DESC"]</code></li>
</ul>
</li>
<li>
<code>category</code> (default all)
<ul>
<li>Filter carousel items by a comma separated list of carousel category slugs.</li>
<li><code>[slick-carousel category="homepage,highlights"]</code></li>
</ul>
</li>
<li>
<code>id</code> (default all)
<ul>
<li>Specify the ID of a specific carousel post to display only one image.</li>
<li>Find the image ID by looking at the edit post link, eg. post 109 would be <code>/wp-admin/post.php?post=109&action=edit</code></li>
<li><code>[slick-carousel id="109"]</code></li>
</ul>
</li>
</ul>
Installation
The easy way:
<ol>
<li>Go to the Plugins Menu in WordPress</li>
<li>Search for “Slick carousel”</li>
<li>Click ‘Install’</li>
<li>Activate the plugin</li>
</ol>
Manual Installation
<ol>
<li>Download the plugin file from this page and unzip the contents</li>
<li>Upload the <code>slick-carousel</code> folder to the <code>/wp-content/plugins/</code> directory</li>
<li>Activate the <code>slick-carousel</code> plugin through the ‘Plugins’ menu in WordPress</li>
</ol>
Once Activated
<ol>
<li>Place the <code>[slick-carousel]</code> shortcode in a Page or Post</li>
<li>Create new items in the <code>Carousel</code> post type, uploading a Featured Image for each.
<ol>
<li>Optional: You can hyperlink each image by entering the desired url <code>Image Link URL</code> admin metabox when adding a new carousel image.</li>
</ol>
</li>
</ol>
Frequently Asked Questions
** How do I insert the carousel? **
First of all, install and activate the plugin. Go to ‘Slick Carousel’ in the WordPress admin pages and add some images. Then, insert the carousel using the <code>[slick-carousel]</code> into the body of any page.
** Can I insert the carousel into a WordPress template instead of a page? **
Absolutely – you just need to use the <a href="https://codex.wordpress.org/Function_Reference/do_shortcode" rel="nofollow ugc">do_shortcode</a> WordPress function. For example:
 
** Can I change the order that the images display in? **
You can specify the order that the carousel displays images by changing the setting in the Settings page, or by using the <code>orderby</code> and <code>order</code> shortcode attributes. The settings page has common settings, or you can use any terms described for the <a href="https://codex.wordpress.org/Class_Reference/WP_Query#Order_.26_Orderby_Parameters" rel="nofollow ugc">WP_Query orderby terms</a> for the shortcode.
** Can I have different carousels with different images on the same site? **
Yes – create a few categories and add your specific images to a specific category. Then, when inserting the shortcode into the page, specify which category you want it to display images from using the <code>category</code> shortcode attribute.
** Can I customise the way it looks / works? **
The carousel shortcode has a number of attributes that you can use to customise the output.
** Help! Nothing is showing up at all **
<ol>
<li>Is the plugin installed and activated?</li>
<li>Have you added any items in the <code>Slick Carousel</code> post type?</li>
<li>Have you placed the <code>[slick-carousel]</code> shortcode in your page?</li>
</ol>
Try writing the shortcode using the ‘Text’ editor instead of the ‘Visual’ editor, as the visual editor can sometimes add extra unwanted markup.

Slick carousel

Shortcode Options All of these options can also be set via the settings page, however if you'd like different settings for different carousels,  …

Slidy vs Slick carousel