XL Product Carousel Pro

Product Carousel

View full feature at a glance

XL Product Carousel is a WordPress plugin which creates product slider to display anywhere of your site using the shortcode. It is a simple but flexible & powerful plugin.

Upgrade to PRO »
View live Demos »
Support Forum »
Contact Us »

Plugin Features

  • Shortcode ready product carousel
  • Responsive product carousel.
  • Very light weight.
  • No need any settings.
  • Work with all WordPress theme.
  • Easy to use.
  • Developer friendly & easy to customize.
  • Powered by Owl Carousel 2.
  • Its easy user interface allows you to manage plugin.

Pro Features

  • Advance setting panel with all necessary settings.
  • Multiple sliders can be shown from different product categories.
  • Responsive settings. Can be control product item to show on tablet & mobile.
  • Great settings panel.
  • On / Off – stop on hover
  • On / Off infinite loop.
  • 3 way to display slider navigation
  • 5 nav arrow styles.
  • 4 border style
  • Unlimited colors select.
  • Auto select font from your website
  • Number of product to move on transition.
  • Lot’s of shortcode parameters
  • Works with any WordPress Theme.
  • Build with HTML5 & CSS3.
  • Responsive. Work on any device.
  • Easy and user-friendly setup.
  • Well documentation
  • 24/7 support.
  • And many more.

Shortcode

Basic Usage – Use following shortcode to display product carousel.

[xl_product]

5 Theme Style

  • Default
  • xl_style_1
  • xl_style_2
  • xl_style_3
  • xl_style_4

3 Caption Style

  • xl_left
  • xl_right
  • xl_center

10 Button Style

  • xl_btn_1
  • xl_btn_2
  • xl_btn_3
  • xl_btn_4
  • xl_btn_5
  • xl_btn_6
  • xl_btn_7
  • xl_btn_8
  • xl_btn_9
  • xl_btn_10

4 border styles

  • solid
  • dotted
  • dashed
  • double

5 Navigation Arrow styles

  • Top right corner – trc
  • Top left corner – tlc
  • Bottom left corner – blc
  • Bottom right corner – brc
  • Default

Example Uses

Use the following shortcode to display product slider combined with 4 product in large desktop, 4 in medium desktop, 4,3 and 2 accordingly in tablets, large phone, and small phone, nav arrow in top right corner, 20px margin between two products. and 1px solid light gray border.

[xl_product theme="xl_style_1" caption_alignment="xl_center" large_desktops="4" medium_desktops="4" tablets="4" large_phones="3" small_phones="2" nav_arow_style="trc" logo_margin="20" product_border_style="solid" product_border_thickness="1" product_border_color="#ddd"]

Still have any confusion?
View live Demos »

Normally product will display by descending order, latest will show first. But if you wish to display ascending order, oldest at first then pass order=”ASC” parameter to shortcode like

[xl_product order='ASC']

 


 

Installation process of XL Product Carousel

Install by Upload Plugin

Download the latest version of XL Product Carousel (.zip file)
Go to Dashboard > Plugins > Add New
Select “Upload Plugin”
Click on “Choose File”
Select downloaded xl-product-carousel & click on ‘Install Now’ button
Activate the plugin

upload-plugin

Select-File


Install Plugin using FTP

Upload xl-product-carousel folder inside the /wp-content/plugins/ directory
Go to WordPress dashboard > Plugins & Activate the XL Product Carousel

Screenshot 2016-01-29 00.26.47


Manage XL Product

You will find setting panel at-
Settings > XL Woo Product Slider

Screenshot 2016-01-29 00.40.18


XL Woo Product Slider Admin options available only at PRO version. At Basic Settings, instructions added with each field.

Screenshot 2016-01-29 00.42.54


XL Woo Product Slider Admin options available only at PRO version. At Color Settings instructions added with each field.

Screenshot 2016-01-29 00.44.45


XL Woo Product Slider Admin options available only at PRO version. At Advanced Settings instructions added with each field.

Screenshot 2016-01-29 00.46.19


XL Product Carousel shortcode usage

Basic Usages

[xl_product]

Shortcode attributes Usage

No.AttributeDefault valueOptionsDescription
1cat_nameAllProduct Category SlugTo get your Product category slug, Go to Products > Categories. Here you will find Products Categories & all the slugs.
2orderDESCDESC / ASCNormally Product will show by descending order, latest will show first. But if you wish to display ascending order, oldest at first then pass order=’ASC’ parameter
3themeDefaultxl_style_1 / xl_style_2 / xl_style_3 / xl_style_4To change Product style use theme attributes. Ignore, if you don’t want change theme. Default will show.
4default_items5Any positive real numberUse any positive real number. eg. 1,2,3,4,5…
5large_desktops5Any positive real numberUse any positive real number. eg. 1,2,3,4,5… By default it will display ‘default_items’ value.
6medium_desktops4Any positive real numberUse any positive real number. eg. 1,2,3,4,5… By default it will display ‘default_items’ value.
7tablets4Any positive real numberUse any positive real number. eg. 1,2,3,4,5… By default it will display ‘default_items’ value.
8large_phones3Any positive real numberUse any positive real number. eg. 1,2,3,4,5… By default it will display ‘default_items’ value.
9small_phones2Any positive real numberUse any positive real number. eg. 1,2,3,4,5… By default it will display ‘default_items’ value.
10autoplay_speed500Any positive real number. Not less then 100.Any positive real number. Not less then 100. Use higher value for slow speed.
11autoplay_timeout1000Any positive real number. Not less then 100.Any positive real number. Not less then 100. Use higher value for long delay.
12product_margin20Any positive real number.Use any positive real number. eg. 1,2,3,4,5…
13caption_alignmentDefaultxl_left / xl_right / xl_centerUse preferred caption style attribute from 3 different caption styles
14nav_arow_styleDefaulttrc / tlc / brc / blcUse preferred nav arrow style attribute from 5 Different nav arrow styles
15product_border_styleNonesolid / dotted / dashed / doubleUse any of them to display border. Ignore, If you don’t want any border.
16product_border_thicknessNoneAny positive real numberUse any positive real number. eg. 1,2,3,4,5… Border thickness should be 4 for border style “double”. Ignore, If you don’t want any border.
17product_border_colorNoneUse any color code.Use any color code. We preferred Hexadecimal color code like #dddddd. Ignore, If you don’t want any border.
18product_border_hover_colorNoneUse any color code.Use any color code. We preferred Hexadecimal color code like #dddddd. Ignore, If you don’t want.
19product_paddingNoneAny positive real numberUse any positive real number. eg. 1,2,3,4,5… Ignore, If you don’t want any padding.
20btn_styleDefaultxl_btn_1 / xl_btn_2 / xl_btn_3 / xl_btn_4 / xl_btn_5 / xl_btn_6 / xl_btn_7 / xl_btn_8 / xl_btn_9 / xl_btn_10Use preferred button style from 10 different button styles.
21caption_bgNoneUse any color code.Use any color code. We preferred RGBA color code like rgba(221, 221, 221, 0.9). You also can use Hexadecimal.
22featured_productnoyes / noIf you want to display only featured product then use this this attributes or ignore if you do not want.
23view_cart_stylexl_vcs_2xl_vcs_1 / xl_vcs_2Use preferred style. Ignore for default value.

Some screenshots of different styles

Screenshot 2016-01-29 01.09.15

Screenshot 2016-01-29 01.11.52

Screenshot 2016-01-29 01.13.11

Screenshot 2016-01-29 01.14.57

Screenshot 2016-01-29 01.17.24

Screenshot 2016-01-29 01.19.22