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,  …

Ryner Galaus

Includes common libraries used for development. It also comes with simple functions that are widely used on a website. 
Libraries can be activated / deactivated. Activate what you need without worrying about unnecessary enqueued scripts and styles.
<ul>
<li>
LIBRARIES INCLUDED
<ol>
<li><a href="https://getbootstrap.com/docs/4.3/getting-started/introduction/" rel="nofollow ugc">Bootstrap v4.3.1 </a></li>
<li><a href="https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use" rel="nofollow ugc">Font Awesome v5.7.1</a></li>
<li><a href="https://sorgalla.com/lity/" rel="nofollow ugc">Lity v2.3.1 </a></li>
<li><a href="http://kenwheeler.github.io/slick/" rel="nofollow ugc">Slick v1.8.1</a></li>
<li><a href="https://mottie.github.io/tablesorter/docs/" rel="nofollow ugc">Tablesorter v2.31.1</a></li>
<li><a href="https://github.com/wp-bootstrap/wp-bootstrap-navwalker" rel="nofollow ugc">Bootstrap Navwalker v2.0.4</a></li>
</ol>
</li>
<li>
Additional Functions
<ol>
<li>WP Login Function
<ul>
<li>Add the classname ‘rsg-wp_login_toggle’ to your link or to the container of your link. </li>
<li>It will automatically toggle a login modal upon click.</li>
<li>You can change the template by copying the file rsg-login.php from the templates folder to yourtheme/rsg/templates/</li>
</ul>
</li>
<li>Logout
<ul>
<li>Add the classname ‘rsg_wp_logout_link’ to your link.</li>
<li>It will automatically logout the user on click.</li>
</ul>
</li>
<li>Popup Menu Function
<ul>
<li>Add the classname ‘rsg-wp_menupopup_toggle’ to your link or to the container of your link. </li>
<li>It will automatically toggle a popup menu on click.</li>
<li>You can change the template by copying the file rsg-popup_menu.php from the templates folder to yourtheme/rsg/templates/ </li>
</ul>
</li>
<li>Get Menu Function
<ul>
<li>Uses the Bootstrap Navwalker to get and display the menu created at the dashboard.</li>
<li>Function parameters are rsg_get_menu(String Menu slug, String Menu Name, ‘Menu Classname/s separated by space’)</li>
<li>Sample Code: echo rsg_get_menu(‘primary-menu’, ‘Main Menu Online’, ‘menu-class rsg-vertical-menu-popup’);</li>
</ul>
</li>
<li>Random String Generator
<ul>
<li>Can be used to generate random strings or characters.</li>
<li>Contents generated are lowercase or uppercase letters (A-Z | a-z), numbers (0-9), and special characters (dash, underscore, asterisk, and number sign).</li>
</ul>
</li>
<li>Back To Top Function
<ul>
<li>Adds a back to top button. Can be activated or deactivated</li>
</ul>
</li>
</ol>
</li>
<li>
RSG Stylesheet Perks 
Designs can be overridden at your theme’s style.css.
<ul>
<li>
Button Class Names
<ol>
<li>rsg-button_main (ex. Submit )</li>
<li>rsg-button_main and rsg-btn_white (ex. < button class=”rsg-button_main rsg-btn_white”> Submit < /button > )</li>
<li>rsg-button_main and rsg-btn_gray (ex. < a href=”#” class=”rsg-button_main rsg-btn_gray”> Submit < /a > )</li>
<li>rsg-button_1 (ex. < div class=”rsg-button_1″> Submit < /div > )</li>
<li>rsg-button_2</li>
<li>rsg-button_3 
Notes: 
Classnames can be used in any tags/elements(span, a, button, div, etc.). 
Copying the code from the examples given will not work. Remove the spaces between the tagnames and the < >.</li>
</ol>
</li>
<li>
Display Class Names
<ol>
<li>rsg-hide: style=”display:none;”</li>
<li>rsg-block: style=”display:block; width:100%; position:relative;”</li>
<li>rsg-iblock: style=”display:inline-block; position:relative;”</li>
<li>rsg-itable: style=”display:inline-table; position:relative;”</li>
<li>rsg-tcenter: style=”text-align: center;”</li>
<li>rsg-tleft: style=”text-align: left;”</li>
<li>rsg-tright: style=”text-align: right;”</li>
</ol>
</li>
<li>
Preloaders
<ol>
<li>Code: < div class=”rsg-loading-container_white”>< div class=”rsg-loading”>< div class=”rsg-loading-in”>< div>< div>< div> </li>
<li>Code: < div class=”rsg-loading-container_black”>< div class=”rsg-loading”>< div class=”rsg-loading-in”>< div>< div>< div> </li>
<li>Activate a preloader from your dashboard. This is a preloader that shows while your website is loading. Once activated, this will appear automatically unlike the two above. 
Note: Decide on how these loaders will appear. </li>
</ol>
</li>
</ul>
</li>
<li>
Incoming Features
<ol>
<li>Fixed Top Navigation and different templates</li>
<li>Mobile Navigation</li>
<li>Login Modal Templates</li>
<li>Popup Menu Templates</li>
<li>Back to top button designs</li>
<li>Array of different countries with flag carousel shortcode</li>
<li>Preloader designs</li>
</ol>
</li>
<li>
Requirements
<ul>
<li>PHP 5.4 or higher</li>
<li>WordPress 4.8 or higher</li>
</ul>
</li>
</ul>

RSG Compiled Libraries

Includes common libraries used for development. It also comes with simple functions that are widely used on a website.

Slick carousel vs RSG Compiled Libraries