Documentation
Back to website >

JCarousel Documentation

Live DEMO - see how the JCarousel would look like in your public store.

Admin DEMO - see the plugin administration.

 
Note: This documentation is valid only for JCarousel released for nopCommerce 3.8 and above and downloaded after 02.12.2016. Please visit the Old JCarousel Plugin Documentation if you are using an older version.
 

JCAROUSEL - PLUGIN SETTINGS

CREATING A CAROUSEL

You can create as many carousels as you want and add each to a place where appropriate. You can have more than one carousel on a page and each one of them will work independent from the other. 
In order to create a new carousel go to Plugins -> Nop JCarousel -> Manage JCarousels. Click on the Add new JCarousel button.

  1. Name - Specifies the name of the JCarousel

  2. Title - Specifies a title that will display before the JCarousel on the public store.

  3. Data source type - Specifies a predefined type of data that will populate the JCarousel plugin. (e.g. "Featured Products", "Related Products", etc.)

  4. Maximum number of items - Specifies the maximum number of items that the JCarousel will contain.

  5. Number of visible items in the JCarousel - Specify the number of visible items in the JCarousel.

  6. Skin - Used for adding custom class to name for the current JCarousel

  7. Item start index - The index of the item to start with.

  8. Number of items to scroll by - The numbers of items to go through on a single scroll.

  9. Autoscroll the content after (seconds) - Specifies after how many seconds periodically to auto scroll the content. If set to 0 seconds the auto scroll will be turned off.

  10. Autoscroll pause on hover - Pause autoscroll on mouse hover.

  11. Loop items - Enable or disable infinite loop of items in the JCarousel.

  12. The speed of the scroll animation - The speed of the scroll animation. If set to "none" the scroll animation will be turned off.

  13. Dot navigation - Enable or disable the dot navigation.

  14. Arrows navigation - Enable or disable the arrows navigation.

  15. Show title - If checked the title of the JCarousel will be shown.

  16. Limited to stores - Option to limit the Jcarousel to certain stores. If you don`t use this option just leave it empty.

ADD THE CAROUSEL TO A WIDGET ZONE

From the Widget Zones you could choose the locations in which you want your carousel to appear in your public store.

If you want to add the carousel to widget zones click the Add New Record button and from the drop-down select your desired widget zone.

Optionally specify a display order.

Find more information here.

ADD ADDITIONAL PRODUCTS

In order to add additional products to be displayed in the JCarousel, you need to select a product Data Source Type or select the None type. The product Data Source Types are:

  1. Home Page Featured Products - this data source is compiled from the home page featured products. Those are products that have the "Show on home page" setting checked.
  2. Best Sellers Products - this data source is compiled from your store's most sold products.
  3. Recently Added Products - this data source is compiled from the most recent products that have been added to the store.
  4. Marked As New Products - this data source is compiled from the products that are marked as new. Those are the products that have the "Mark as new" setting checked.
  5. Recently Viewed Products - this data source is compiled from the most recent products that the customer has seen.
  6. Related Products - this data source is compiled from the products that are related to the product the customer is seeing. The data source will have products only on the product details pages.
  7. Also Purchased Products - this data source is compiled from the products that have been purchased with the product the customer is seeing. The data source will have products only on the product details pages.
  8. Products From The Same Category - this data source is compiled from the products that are mapped to the category of the product that the customer is seeing. The data source will have products only on the product details pages.
  9. Category Featured Products - this data source includes the category's featured products. The data source will have products only on the category details pages.
  10. Manufacturer Featured Products - this data source includes the manufacturer's featured products. The data source will have products only on the manufacturer details pages.

If you select a Product Data Source Type and after that Add Additional Products, the product that you have selected will be added after the ones from the Data Source. If you select the None Data Source Type, only the products that you have selected will be shown in the JCarousel.

To add a new product click on the "Add a new product" button.

ADD ADDITIONAL CATEGORIES

In order to add additional categories to be displayed in the JCarousel, you need to select a category Data Source Type or select the None type. The category Data Source Types are:

  1. Home Page Categories
  2. Sub Categories
  3. Sibling Categories

If you select a Category Data Source Type and after that Add Additional Categories, the category that you have selected will be added after the ones from the Data Source. If you select the None Data Source Type, only the categories that you have selected will be shown in the JCarousel.

To add a new category click on the "Add a new record" button.

ADD ADDITIONAL MANUFACTURERS

In order to add additional manufacturers to be displayed in the JCarousel, you need to select a Manufacturer Data Source Type or select the None type. The Manufacturer Data Source Types are:

  1. Manufacturers

If you select a Manufacturer Data Source Type and after that Add Additional Manufacturers, the manufacturers that you have selected will be added after the ones from the Data Source. If you select the None data source, only the manufacturer that you have selected will be shown in the JCarousel.

To add a new manufacturer click on the "Add a new record" button.

Add Additional Vendors

In order to add additional vendors to be displayed in the JCarousel, you need to select a Vendor Data Source Type or select the None type. The Vendor Data Source Types are:

  1. Vendors

If you select a Vendor Data Source Type and after that Add Additional Vendors, the vendors that you have selected will be added after the ones from the Data Source. If you select the None Data Source Type, only the vendors that you have selected will be shown in the JCarousel.

To add a new vendor click on the "Add a new record" button.