This plugin requires at least WordPress 3.0

 

 

1. Video Tutorials

Installation - https://www.youtube.com/watch?v=HHwNe2CYXL0
How To Create a Perspective Carousel - https://www.youtube.com/watch?v=RsOReGcav38
How To Create a Classic Carousel - https://www.youtube.com/watch?v=uk_V4vX8AMo

 

2. Plugin Installation

Step 1. Enter in your wordpress CMS and go to Plugins menu
Step 2. Under Plugins menu click "Add New"
Step 3. Select "Upload", choose the archive multimedia_carousel.zip that you downloaded and hit "Install Now"
Step 4. After the plugin is installed click "Activate Plugin"
Step 5. In you page just add the shortcode: [multimedia_carousel settings_id='1']
click here for more details regarding the shortcode

 

3. Manage Carousels

From this section you can:
- add a new carousel
- select the carousel you want to edit by clicking "Carousel Settings"
- add/edit playlist images by clicking "Playlist"
- delete an existing carouel by clicking "Delete"
- duplicate an existing carouel by clicking "Duplicate"

 

4. Carousel Settings

From this section you can define the carousel settings.

A. PERSPECTIVE TYPE

   
General settings
Skin Possible values:
- black
- white
Carousel Width carousel width
Carousel Height carousel height
Width 100% Possible values:
true - the carousel width will be 100%
false - the carousel width will be what you've set for 'width' parameter
Center Plugin Possible values:
true - the carousel will be centered on the page
false - the carousel will be centered on the page
Carousel Loading Delay The timeout delay (in seconds) for carousel loading
Image Width image width
Image Height image height
Responsive
Possible values:
true - the carousel will responsive
false - the carousel will not be responsive
Responsive Relative To Browser Possible values:
true - the carousel will be responisve relatively to browser dimensions
false - the carousel will be responisve relatively to parent div
Auto Play You can define the time (in seconds) until the next photo will play. If you set it 0 the carousel will not autoplay
Number Of Visible Items The number of visible items. It has to be an odd number: 3,5,7,9,11 etc
Elements Horizontal Spacing The horizontal distance between visible items
Elements Vertical Spacing The value with which the elements are becoming smaller
Vertical Adjustment This value will rise the whole carousel up
Animation Time The speed with which the elements are moving (in seconds)
Easing The animation easing. Possible values:
easeInQuad
easeOutQuad
easeInOutQuad
easeInCubic
easeOutCubic
easeInOutCubic
easeInQuart
easeOutQuart
easeInOutQuart
easeInSine
easeOutSine
easeInOutSine
easeInExpo
easeOutExpo
easeInOutExpo
easeInQuint
easeOutQuint
easeInOutQuint
easeInCirc
easeOutCirc
easeInOutCirc
easeInElastic
easeOutElastic
easeInOutElastic
easeInBack
easeOutBack
easeInOutBack
easeInBounce
easeOutBounce
easeInOutBounce
swing
liniar
Resize Images If you are using images (or front image) inside the carousel you can set it to auto resize as it moves
Active Item Optional Class You can insert here the name of a css class which you want for the active item. The class can be defined in your css files or in Appearance->Customize->Additional CSS
Border Width the image border thickness
Border Color OFF State the image border color for OFF state. It can be a hexa value or 'transparent'
Border Color ON State the image border color for ON state. It can be a hexa value or 'transparent'
Target Window For Link Possible values:
'_blank' - the link associated to the primary photo will open in a new window
'_slef'- the link associated to the primary photo will open in the same window
Show Element Title Possible values:
true - the photo title/description will apear
false - the photo title/description will apear
Title Color title color, hexa value.
Enable Touch Screen Possible values:
true - mobile touch screen support enabled
false - mobile touch screen support disabled
LightBox Window Width Divider The LightBox window width divider. The Lightbox window with will be equal to browser width / LightBox Window Width Divider
LightBox Window Height Divider The LightBox window height divider. The Lightbox window with will be equal to browser height / LightBox Window Height Divider
   
Controllers Settings  
Show All Controllers Possible values:
true - all controllers will appear (next, previous, bottom navigation)
false - all controllers will not appear (next, previous, bottom navigation)
Show Navigation Arrows Possible values:
true - next, previous buttons will appear
false - next, previous buttons will not appear
Show Navigation Arrows On Init Possible values:
true - next, previous buttons will appear on first carousel init
false - next, previous buttons will not appear on first carousel init
Auto Hide Navigation Arrows Possible values:
true - next, previous buttons will hide when mouse out
false - next, previous buttons will not hide when mouse out
Show Bottom Navigation Possible values:
true - bottom navigation buttons will appear
false -bottom navigation buttons will not appear
Show Bottom Navigation On Init Possible values:
true - bottom navigation buttons will appear on first carousel init
false - bottom navigations buttons will not appear on first carousel init
Auto Hide Bottom Navigation Possible values:
true -bottom navigations buttons will hide when mouse out
false - bottom navigations buttons will not hide when mouse out
Show Preview Thumbs Possible values:
true - a preview image will appear on hovering each bottom button
false - the preview image will not appear on hovering each bottom button
Next&Prev Buttons Margin Top margin-top for next/previous buttons
Play Movie Margin Top margin-top for play button
Bottom Navigation Margin Bottom margin-bottom for bottom navigation
   
Circle Timer Settings  
Show Circle Timer Possible values:
true - shows the circle timer
false - hides the circle timer
Circle Radius circle radius
Circle Line Width circle line width
Circle Color circle color, in hexa
Circle Alpha circle alpha, in percents. Posible values 0-100
Behind Circle Color behind circle color, in hexa
Behind Circle Alpha behind circle alpha, in percents. Posible values 0-100
Circle Left Position Correction this value will be added to the left position of the circle timer
Circle Top Position Correction this value will be added to the top position of the circle timer
   

 

 

B. CLASSIC TYPE

   
General settings
Carousel Name  
Skin Possible values:
- black
- white
Carousel Width carousel width
Carousel Height carousel height
Width 100% Possible values:
true - the carousel width will be 100%
false - the carousel width will be what you've set for 'width' parameter
Image Width item top image width
Image Height item top image height
Responsive
Possible values:
true - the carousel will responsive
false - the carousel will not be responsive
Responsive Relative To Browser Possible values:
true - the carousel will be responisve relatively to browser dimensions
false - the carousel will be responisve relatively to parent div
Auto Play (in seconds) You can define the time (in seconds) until the next photo will play. If you set it 0 the carousel will not autoplay
Number Of Thumbs Per Screen The number of thumbs per screen. If you set it to 0, it will be calculated automatically. You can set a fixed number, for example 3
Item Padding item padding
Item Background Color OFF State

item background color, OFF state, in hexa

Item Background Color ON State

item background color, ON state, in hexa

Title Color OFF item title color, OFF state, in hexa
Title Color ON item title color, ON state, in hexa
Title Font Size item title font size
Title Margin Top item title top margin
Description Color OFF item description color, OFF state, in hexa
Description Color ON item description color, ON state, in hexa
Description Font Size item description font size
Description Margin Top item description top margin
Target Window For Link Possible values:
'_blank' - the link associated to the primary photo will open in a new window
'_slef'- the link associated to the primary photo will open in the same window
Enable Touch Screen Possible values:
true - mobile touch screen support enabled
false - mobile touch screen support disabled
LightBox Window Width Divider The LightBox window width divider. The Lightbox window with will be equal to browser width / LightBox Window Width Divider
LightBox Window Height Divider The LightBox window height divider. The Lightbox window with will be equal to browser height / LightBox Window Height Divider
   
Controllers Settings
Show Navigation Arrows Possible values:
true - next, previous buttons will appear
false - next, previous buttons will not appear
Show Navigation Arrows On Init Possible values:
true - next, previous buttons will appear on first carousel init
false - next, previous buttons will not appear on first carousel init
Auto Hide Navigation Arrows Possible values:
true - next, previous buttons will hide when mouse out
false - next, previous buttons will not hide when mouse out
Show Bottom Navigation Possible values:
true - bottom navigation buttons will appear
false -bottom navigation buttons will not appear
Show Bottom Navigation On Init Possible values:
true - bottom navigation buttons will appear on first carousel init
false - bottom navigations buttons will not appear on first carousel init
Auto Hide Bottom Navigation Possible values:
true -bottom navigations buttons will hide when mouse out
false - bottom navigations buttons will not hide when mouse out
Bottom Navigation Margin Bottom Bottom navigation bottom margin
Bottom Navigation Position Bottom navigation position. Possible values: 'left', middle', 'right'
   

 

 

5. Playlist

Image Main image
Image Title The current content title
Image description
- Only for 'Classic' carousel version -
The current content description
Preview Thumb

A preview image will appear on hovering the corresponding bottom button

Link For The Image You can specify a link associated to the primary photo
Link Target

Possible values:
'_blank' - the link associated to the primary photo will open in a new window
'_slef'- the link associated to the primary photo will open in the same window

*** If all your links will behave the same, you can ignore this parameter and use target from JS options

Large Image The path to the large image
Vimeo Video ID

The VIMEO video ID

YouTube Video ID

The YOUTUBE video ID

Audio File

The path to the audio file. You need to have both extensions (.mp3 and .ogg) in order to work on all browsers and Operating Systems. The files should have the same name, the only difference would be the extension:

the_audio_file.mp3
the_audio_file.ogg

Self Hosted/Third Party Hosted Video

The path to the video file. You need to have both extensions (.mp4 and .webm) in order to work on all browsers and Operating Systems. The files should have the same name, the only difference would be the extension

the_video_file.mp3
the_video_file.webm

   

 

6. ShortCode

The shortcode is:
[multimedia_carousel settings_id='1']
where
settings_id is the slider ID defined in "Manage Carousels" section