Main Options
| Parameter | Value |
|---|---|
| Animation Speed | Set animation speed |
| Autoplay | Enable or disable the Autoplay |
| Autoplay Speed | Set the speed of the Autoplay, in milliseconds. It must be greater than the sum of the times of all animations. |
| Prev/Next | Enable or disable the Prev/Next navigation. |
| Dots | Enable or disable the Dots navigation |
| Height | Set height of the slideshow. For example: '70vh'. Will be ignored when Fill Rest Of the Page parameter is enabled. |
| Fill Rest Of The Page | (Yes | Yes (50 %) | Yes (67 %) | Yes (75 %) | No) Enable or disable full height. Slideshow fills the rest of the page on large screens. |
| Fill Rest Of The Page Ratio (Small Screens) | When filling the rest of page on large screens is enabled, set the ratio between width and height to correct the size on small screens. |
| Display Slideshow (Minimum Width) | Set from which width the slideshow will be displayed |
| Background Image | Select desired background image. This background image applies to all slides and can be overridden by background image of each slide. |
| Background Video | Set background video (use full path, for example: images/video.mp4). Video will be displayed only when no background image and no background item image is set. |
| Display (Component) | Set component where the carousel will be displayed. If you will set more components, separate each component by comma (,). For example: com_phocacart, com_phocadownload, com_phocagallery. Leave empty to display carousel everywhere. |
| Display (View) | Set view where the carousel will be displayed. If you will set more views, separate each component by comma (,). For example: categories, category, item. If you set view, the component must be set too. Leave empty to display carousel everywhere. |
| Load Animate CSS Library | Load Animate CSS library |
| Load Swiper JS Library | Load Swiper JS library |
Product Options
| Parameter | Value |
|---|---|
| Product Title CSS | Enter the product title CSS
Example:
animation-duration: 5s; |
| Product Title Animation | Enter product title animation.
Example:
fadeIn |
| Display Product Description | Display or hide product description |
| Product Description CSS | Enter the product description CSS
Example:
animation-duration: 5s; |
| Product Description Animation | Enter product description animation. |
| Product Price CSS | Enter the product price CSS
Example:
animation-duration: 5s; |
| Product Price Animation | Enter product price animation.
Example:
fadeIn |
| Display Product Discount Description | Display or hide product discount description |
| Product Discount Description CSS | Enter the product discount description CSS
Example:
animation-duration: 5s; |
| Product Discount Description Animation | Enter product discount description animation.
Example:
fadeIn |
| Display Stock | Display or hide stock information |
| Check Stock | Enable or disable stock checking. If enabled, products that do not have items in stock, will be not displayed. |
| Display Stock | Display or hide stock information |
| Stock Text Prefix | Set stock text prefix |
| Stock Text Suffix | Set stock text suffix |
| Stock CSS | Enter the stock CSS
Example:
animation-duration: 5s; |
| Stock Animation | Enter stock animation.
Example:
fadeIn |
| Button Title | Enter the button title |
| Button Link Type | (Product View) Select button link type |
| Button CSS | Enter the button CSS
Example:
animation-duration: 5s; |
| Button Animation | Enter the button animation.
Example:
fadeIn |
| Display Product Image | Display or hide product image |
| Product Image Type | (Small Thumbnail | Medium Thumbnail | Large Thumbnail | Original Image) Set product image type |
| Product Image CSS | Enter product image CSS |
| Product Image Size CSS | Enter product image size CSS
Example:
animation-duration: 5s; |
| Product Image Animation | Enter product image animation.
Example:
zoomIn |
| Countdown Timer Text Prefix | Set countdown timer text prefix |
| Countdown Timer Text Suffix | Set countdown timer text suffix |
| Countdown Timer CSS | Enter the countdown timer CSS
Example:
animation-duration: 5s; |
| Countdown Timer Animation | Enter countdown timer animation.
Example:
fadeIn |
| Ignore Minimum Quantity Rule | If minimum quantity rule is active in product discount options (minimum quantity of ordered items is greater than 1), product itself will be displayed in this module but discount price will be not displayed. If you enable this parameter then minimum quantity rule will be ignored and discount price will be displayed. If enabled, it is recommended to write information into product discount description that the discount is valid when ordering more items. |
| Background Image Animation | Enter background animation. For example: 'kenburnsBottomLeft'. Background image can be set in product discount options in administration - in product edit view.
Example:
kenburnsBottomLeft |
| Number of Products | (1 | 2 | 3 | 4 | 5) Set number of products displayed in slideshow. |