WordPress Carousel Pro is a carousel plugin for your WordPress website. By this plugin, you can easily create many fantastic carousels. This plugin has a nice combination of WordPress regular gallery. So, if you know about WordPress gallery media, you can use this plugin in a handy way. If you are not familiar with WordPress default gallery, this document will help you to use all the nice features and options of the plugin.
System Requirements
To get the best experience of this plugin, we recommend the followings–
- PHP 5.6 or later
- MySQL 5.6 or later
- WordPress 4.4.1 or later
To be sure about the above requirements contact your hosting vendor.
Installation
Suppose you have installed WordPress. If you do not know how to install WordPress, contact your hosting provider or see the document – https://codex.wordpress.org/Installing_WordPress.
- Login to the admin panel of WordPress
- Navigate to the to Plugins → Add New → Upload File. Click Choose File and select the zipped file named wordpress-carousel-pro. Click Install Now. When done, click Activate Plugin.
- After activating the WordPress Carousel Pro plugin, you are ready to add carousel in your post, page, widget or anywhere you like.
Now we are going to add a carousel in a regular page.
Go to Page → Add New. Click on "Add Media" then you can see media uploader. Now click on "Create gallery, then upload some images here."
After adding all necessary information, Click the blue button saying "Create a new gallery". You can re-organize carousel items here. Ignore the gallery settings, just click the blue button saying "Create Gallery"
Then you will get WordPress default gallery images in your editor, to see shortcode just click on the button Text, it is on the top right of the post editor. Add WCP before the gallery shortcode. If your gallery shortcode is [ gallery ids="39,38,37,36,35,34,31" ], just add WCP before the gallery text. So your shortcode will look like [wcpgallery ids="39,38,37,36,35,34,31"].
Now save your page, then visit the newly created page & see something awesome. :)
Carousel from gallery
[wcpgallery ids="559,558,554,493,556,555,492"]
| Attribute | Default value | options | Description |
|---|---|---|---|
| width | 600 | Numeric value only eg: 100/200/300 | Used as the image width in pixel. |
| height | 450 | Numeric vlaue only eg: 100/200/300 | Used as the image height in pixel. |
| crop | true | true / false | Set true to crop the image. |
| target | _blank | _blank / _self / _parent / _top | Set a target option. |
| slides_to_scroll | 1 | Numeric vlaue only eg: 2/3/4 | |
| items | 5 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displayed at a time. It's for largest view. |
| items_desktop | 3 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in desktop view. Maximum screen size is 1200px. |
| items_desktop_small | 3 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in small desktop view. Maximum screen size is 980px. |
| items_tablet | 2 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in tablet view. Maximum screen size is 768px. |
| items_mobile | 1 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in mobile view. Maximum screen size is 480px. |
| items_margin | 10px | Numeric vlaue only eg: 20px/30px | |
| auto_play | true | true / false | Carousel autoplay on / off option. |
| auto_play_speed | 3000 | Numeric vlaue only | Carousel autoplay speed. |
| lightbox | false | true / false | Carousel with lightbox or not. |
| group | gallery | use any id | |
| speed | 300 | Numeric vlaue only | Carousel speed. |
| ticker | false | true / false | |
| bullets | false | true / false | Show carousel bullets or not. |
| bullets_color | #cccccc | color code | |
| bullets_active_color | #5dc8d0 | color code | |
| fade | false | true / false | Fade only for slingle item. |
| nav | true | true / false | Show next/prev buttons. |
| nav_color | #888888 | color code | |
| nav_hover_color | #5dc8d0 | color code | |
| auto_height | false | true / false | Use carousel height auto. |
| stop_on_hover | true | true / false | Stop carousel on hover. |
| draggable | true | true / false | |
| image_only | false | true / false | Show only image without text. |
| title | false | true / false | Show image title |
| title_color | #333333 | color code | Show image title |
| description | false | true / false | Show image description. |
| description_color | #333333 | color code | |
| rtl | false | true / false | |
| overlay | false | true / false | |
| overlay_bg | #000000 | color code | |
| grayscale | blank | gray_with_color / gray_on_hover / always_gray | Grayscale effect of gallery image. |
Testimonial
[wcp_testimonial]
12 time 5000 number Testimonial autoplay time in millisecond.
| Attribute | Default value | options | Description |
|---|---|---|---|
| total_items | -1 | Numeric vlaue only | Total number of items items to show in the carousel. Default value is unlimited. |
| width | 120 | Numeric vlaue only | Used as the image width in pixel. |
| height | 120 | Numeric vlaue only | Used as the image height in pixel. |
| crop | true | true / false | Set true to crop the image. |
| category | blank | balnk/category name/category name, category name | For all cagtegories no need to write category name; for single category = category name; for multiple categories write category names with comma = category name, category name. |
| items_margin | 10px | number | |
| bullets | true | true / false | Show testimonial bullets. |
| bullets_color | #cccccc | color code | |
| bullets_active_color | #5dc8d0 | color code | |
| nav | true | true / false | Show testimonial next/prev buttons. |
| nav_color | #888888 | color code | |
| nav_hover_color | #5dc8d0 | color code | |
| slides_to_scroll | 1 | number | |
| items | 3 | number | Set item number in multi items testimonial view. The attribute single_view have to be false. |
| items_desktop | 3 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in desktop view. Maximum screen size is 1200px. |
| items_desktop_small | 3 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in small desktop view. Maximum screen size is 980px. |
| items_tablet | 2 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in tablet view. Maximum screen size is 768px. |
| items_mobile | 1 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in mobile view. Maximum screen size is 480px. |
| style | two | one / tow / three/ four/ five/ six / seven | Set a style from the styles.. |
| auto_height | false | true / false | Set testimonial height auto. |
| auto_play | true | true / false | |
| auto_play_speed | 3000 | Number | |
| speed | 300 | Number | |
| stop_on_hover | true | true / false | Stop testimonial slide on hover. |
| draggable | true | true / false | |
| rtl | false | true / false | |
| ticker | false | true / false | |
| fade | false | true / false | Fade only for single item. |
Carousel from post/custom post
[wcp_post]
| Attribute | Default value | options | Description |
|---|---|---|---|
| post_type | post | post/ wcp_item / cpt name | For default post use post and for custom post use custom post type e.g. wcp_item. |
| width | 600 | Numeric vlaue only | Used as the image width in pixel. |
| height | 450 | Numeric vlaue only | Used as the image height in pixel. |
| crop | true | true / false | Set true to crop the image. |
| total_items | -1 | Numeric vlaue only | Number of total items to show. Default valuse is unlimited. |
| items | 3 | Numeric vlaue only | Maximum amount of items displayed at a time. |
| items_desktop | 3 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in desktop view. Maximum screen size is 1200px. |
| items_desktop_small | 3 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in small desktop view. Maximum screen size is 980px. |
| items_tablet | 2 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in tablet view. Maximum screen size is 768px. |
| items_mobile | 1 | Numeric vlaue only eg: 2/3/4 | Maximum amount of items displays in mobile view. Maximum screen size is 480px. |
| items_margin | 10px | Numeric vlaue only eg: 10/20 | |
| slides_to_scroll | 1 | Numeric vlaue only eg: 1/2/3 | |
| auto_play | true | true / false | |
| auto_play_speed | 3000 | Numeric vlaue only | |
| speed | 300 | Numeric vlaue only | |
| category | All Category | balnk / myterm / term_one,term_two | Used to show carousel items from particular taxonomy term.For all cagtegories/terms no need to write category name; for single term = term_one; for multiple terms write terms name with comma = term_one, term_two. |
| taxonomy | category | category / wcp_cat / custom taxonomy | Used to show items from WordPress default taxonomy or from custom custom taxonomy. |
| ticker | false | true / false | |
| bullets | true | true / false | Show carousel bulletes. |
| bullets_color | #cccccc | color code | |
| bullets_active_color | #5dc8d0 | color code | |
| read_more_limit | 55 | numeric value only | The word(excerpt text) limit to show the read more button after. |
| readmore | false | true / false | Show readmore button. |
| readmore_text | Read More | text | Readmore button text. |
| image_only | false | true / false | Show only image without text. |
| nav | true | true / false | Show next/prev buttons. |
| nav_color | #888888 | color code | |
| nav_hover_color | #5dc8d0 | color code | |
| auto_height | false | true / false | Set carousel height auto. |
| stop_on_hover | true | true / false | Stop carousel on hover. |
| title | true | true / false | Show post title. |
| title_color | #333333 | color code | |
| description | true | true / false | Show post description. |
| description_color | #333333 | color code | |
| draggable | true | true / false | |
| rtl | false | true / false | |
| grayscale | blank | gray_with_color / gray_on_hover / always_gray | Grayscale effect of post image. |
Title & Description:
01. Title: To write title caption, use Title field of the gallery. To make linked title, write the title like this– <a href="http://www.facebook.com" target="_blank">Title</a>.
02. Description: To write the description, use Description field of the gallery.
Link:
To make the carousel image linked, use caption field fo the gallery. Just write the URL/link in the caption field.
The plugin is widget area supported. To add your carousel to a widget area, follow the instruction below –
Add a text widget → Write the Title → paste / write your shortcode. Save and see the output.
If you have any idea or suggestion to improve this plugin, please write us here. And, Don't get any help from above documentation? Don't hesitate to post your query/issue in our Instant Support Forum. Thank you!
Are you ready? Buy Now