Thank you

At first we would like to say thank you for choosing Master Slider WordPress Plugin. In this documentation you will find everything you need to use Master Slider WordPress (free version).
If you have any questions which are not covered in this documentation, please take a look at support section.


About the Master Slider WordPress

Master Slider WordPress is a powerful and yet easy to use image and content slider for WordPress, with super smooth hardware accelerated transitions. It supports touch navigation with pure swipe gesture that you have never experienced before. It’s a truly responsive and device friendly slider which works perfect in all major devices.

Automatic installation (easiest way)

To do an automatic install of Master Slider, log in to your WordPress dashboard, navigate to the Plugins menu and click Add New.
In the search field type Master Slider and click Search Plugins. Once you have found it you can install it by simply clicking "Install Now".


Manual Installation

Installing using WordPress Dashboard
  1. Download master-slider.zip from Master Slider plugin page on WordPress.org
  2. Navigate to the Add New in the plugins dashboard
  3. Navigate to the Upload area
  4. Select master-slider.zip from your computer
  5. Click Install Now
  6. Activate the plugin in the Plugin dashboard

Note In this method the server that hosts your website should allow upload limits greater than 6 MB. Most hosting providers have only up to 2MB file upload limit.
In this case you need to upload the theme by FTP or contact your host provider to increase upload limit.


Installibg by FTP

First, you need a tool for uploading plugin files to your site, you can use filemanager from cPanel or any FTP clients. Some good FTP clients :

  1. Download master-slider.zip from Master Slider plugin page on WordPress.org
  2. Extract the master-slider directory to your computer
  3. Upload the master-slider directory to the /wp-content/plugins/ directory
  4. Activate the plugin in the Plugin dashboard
Also WordPress codex contains instructions on how to do this here.


Server Minimum Requirements

  • WordPress 3.6 or greater
  • PHP version 5.2.4 or greater
  • MySQL version 5.0 or greater

Updating

You can use automatic update to update the plugin safely.

Creating New Slider

  • Login to your wordpress admin panel and click on MasterSlider link in admin sidebar menu.
  • In Masterslider page click on Create New Slider button.

Master Slider Create New Slider

  • Now a popup window will be open as shown in screenshot.
  • Select slider type and press CREATE button.
  • Your request will be proceed and you will be redirected to MasterSlider's panel page.

Master Slider WP plugin-free-create new

General Settings

Slider name
Specifies a name for your slider. It only used in admin area.
Slider width
Base width of slider in pixels, slider will resize layers and other elements under this value.
Slider height
Base height of slider in pixels.
Note Automatically crop and resize slider images based on above size if it is on.
Slider sizing method
The sizing method of slider, with this you can make slider boxed or fullwidth
Auto-height Slider
Whether the slider adapts its height to each slide height.
Slider wrapper width
It will set the wrapper width of slider (slider parent) if it leaves empty slider will set it automaticly (Slider uses this to align slider controls).
Master Slider General Settings

Slider Template and Transition

Transition
Specifies the transition of changing slides in slider.
Transition speed
The speed amount of changing transition. Higher 50 values are not recommended.
Direction
Specifies slide changing direction, It may not supported by some templates.
Slide space
The spacing value between slides in pixels.
Master Slider Templates Settings

Slider Navigation and Preloading

Slide show
Enables the autoplay slideshow.
Loop navigation
Enables the continuous sliding mode.
Pause at the end slide
Whether the slider pauses slideshow when it reaches to last slide.
Pause on hover
Whether the slider temporary pause slideshow on mouse cursor moves over slider.
Random order
Whether using random slide ordering.
Start with slide
Specifies the fist slide in slider.

Touch swipe navigation
Whether the drag/swipe navigation is enabled.
Mouse swipe navigation
Whether the user can use mouse drag navigation.
Use grab cursor
Whether the slider uses grab mouse cursor while swiping with mouse.
Mouse wheel
Enables mouse scroll wheel navigation.
Slide preloading
Here you can specify that how slider loads images, it supports three different methods: Load slides in sequence, Load all slides before init and Load nearby slides which takes the number of current slide's nearby slides that should loads at a same time.
Master Slider Navigation Settings

Slider Appearance

Skin
Here you can specify the skin of your slider.
you can take a look at all skins here..
Align center slider controls
Whether the slider aligns UI controls to center. This option is only effective in full width mode.
Background image
Here you can choose a background image for the slider.
Background color
Specifies the background color of slider
Class name
Here you can add custom class names to the slider main element. Multiple class names must be separated by white space.
Inline style
Here you can add custom CSS style to slider main element. For example border:solid 1px red;
Master Slider Appearance Settings

Slides

Here you can see already added slides to the slider, you can add a new slide to slider by clicking on Add Slide
Also you can change the sort of slides by drag and drop each one in this list.

Remove slide
You can remove the slide by clicking on remove icon.
Duplicate slide
For creating a duplicate from a slide you can click on duplicate icon.
Show or hide slide
You can show or hide each slide by clicking on show/hide icon. Slider doesn't show hidden slides in front end.
Master Slider Slides

Slide background and thumbnail

Background
Specifies current slide background.
Fillmode
Specifies the slide background scaling method.
Thumbnail
Here you can add a thumbnail for the slide. Please make sure that you have added Thumblist control to the slider or the selected template supports thumbs.
Master Slider Slide Background Settings

Slide video and link

Here you can add Youtube or Vimeo video as a video slide and also you can make link each slide of your slider.

URL
You can set a URL when user click on this slide it links to URL.
Video embed src
You can add Youtube and Vimeo src to create an slide for that video.

Note To find YouTube/Viemo Embed URL you can Open the video in YouTube/Vimeo, play video and right-click on it, select "Copy embed code" then paste the embed code in a text editor, now you can see video embed URL in embed code which specified as iframe src.
Master Slider Slide Video Background Settings

Slide Info

Here you can add caption or any html content as slider info. The content will be appear on each slider base on your configurations in Slide Info control (located under Slider controls tab)

Note You should add "slide info" control in order to see slider info on slider. To do that, click on Slider controls tab, select and add slide info control

Master Slider WordPress Slide Info

Slide misc

Here you can add custom CSS class or id to each slide and also add alt attribute to slide background image.

Class name
you can add a CSS class to slide.
CSS id
you can add a CSS id to slide.
Background color
It will be used to add color to slide background.
Alt text
you can add an alt text attribute to the image in your background of slide.
Master Slider Slide Video Background Settings

Adding Slider Controls

You can select one type of controller from the dropdown menu and by clicking on Master Slider layer timeline it will add to "Used control" list. You can customize each control type by clicking on that.

Master Slider layer timeline

Arrows Control Options

You have the abilities of hiding arrows while mouse is out of slider, showing arrows over videoplayer and hiding arrows in specific size of windows and less than that.

Master Slider layer timeline

Line Timer Control Options

You have the abilities of hiding line timer while mouse is out of slider, showing line timer over videoplayer and hiding line timer in specific size of windows and less than that.

Align control
Specifies the place of line timer.
Line timer color
Specifies the color of line timer.
Line timer width
Set the width of line timer.
Master Slider layer timeline

Slide Info Control Options

You have the abilities of hiding slide info while mouse is out of slider, showing slide info over videoplayer and hiding slide info in specific size of windows and less than that. Also you can insert the slide info inside of slider.

Align control
Specifies the place of slide info.
slide info margin
Specifies the margin for slide info.
slide info width
Specifies the width for slide info in pixel.
slide info height
Specifies the height for slide info in pixel.
Master Slider layer timeline

Bullets Control Options

You have the abilities of hiding bullets while mouse is out of slider, showing bullets over videoplayer and hiding bullets in specific size of windows and less than that.

Align control
Specifies the place of bullets.
slide info margin
Specifies the margin for bullets.
Master Slider layer timeline

Circle Timer Control Options

You have the abilities of hiding circle timer while mouse is out of slider, showing circle timer over videoplayer and hiding circle timer in specific size of windows and less than that.

Circle stroke
Specifies the stroke of circle in pixel.
Circle radius
Specifies the radius of circle in pixel.
Circle color
Specifies the fill color of circle.
Master Slider layer timeline

Scrollbar Control Options

You have the abilities of hiding Scrollbar while mouse is out of slider, showing Scrollbar over videoplayer and hiding Scrollbar in specific size of windows and less than that. Also you can insert the Scrollbar inside of slider.

Scrollbar handle color
Specifies the color for Scrollbar handle.
Align control
Specifies the place of Scrollbar.
Scrollbar width
Specifies the width for Scrollbar.
Scrollbar margin
Specifies the margin for Scrollbar.
Master Slider layer timeline

Thumblist/Tabs Control Options

You have the abilities of hiding thumblist/tabs while mouse is out of slider, showing thumblist/tabs over videoplayer and hiding thumblist/tabs in specific size of windows and less than that. Also you can insert the thumblist/tabs inside of slider.

Thumb background fill mode
Specifies the background fill mode of thumblist/tabs.
Align control
Specifies the place of thumblist/tabs.
Thumblist/Tabs margin
Specifies the margin for thumblist/tabs.
Appearance
Choose thumblist or tabs.
Thumblist/Tabs info width
Specifies the width for thumblist/tabs in pixel.
Thumblist/Tabs info height
Specifies the height for thumblist/tabs in pixel.
Space between thumbs/tabs
Specifies the the space among thumbs in thumblist mode or tabs in tab mode.
Master Slider layer timeline

Inserting the slider with shortcode

You can place your sliders into pages and posts with their shortcodes. You can find the shortcode for each slider in Master Slider admin page next to their names in the list view. To insert the slider, edit a page or post and insert its shortcode into the WordPress text editor.

Master Slider use shortcode

Inserting the slider with the Master Slider WP widget

MasterSlider WP supports widgets, so you can place your slider in your front-end page just by a drag n' drop. To do that, navigate to the Appearance menu on your left sidebar and select "Widgets". Grab the MasterSlider WP Widget and drop it into one of your widget area. Please note that some themes may not support a widget area what you need. In this case, you can create a new widget area by editing your theme files.

Master Slider WP Widget

Calling the slider from your theme files

Because a slider can be an integral part of your site, you may want to place it into your theme files. There are some PHP function which you can call for example from the header.php file of your theme and it inserts your slider into your home page or certail other pages. Here they are :


Description

Displays MasterSlider based on the slider id passed to.

Usage :

<?php masterslider ( $slider_id ); ?>

OR

<?php echo get_masterslider ( $slider_id ); ?>


Example :

<?php echo get_masterslider ( 2 ); ?>


Parameters :
$slider_id
(int) The slider ID that can be found on the plugin page in the slider list view at the first table column.
Default: Null

It is important when you want to insert a slider to check its ID on the MasterSlider WP slider list page. When you removes some sliders, their IDs won't be re-indexed and the sequence may broke up. This is important to keep persistent your sliders preventing unwanted changes on the already inserted ones.

Using Slider API and Callbacks

Here you can add or remove callback functions to the slider, first select one type of callback function from the dropdown menu and clicking on Master Slider layer timeline to add it to slider. Each callback function is kind of event handler you can add your custom script in the function then slider will execute that when the event dispatches.

Also you can access to the slider api by using "api" variable.

Methods
								var api = event.target;
								
								api.index(); 		// returns current slide index.
								api.count(); 		// returns total number of slides.
								
								api.next();			// next slide.
								api.previous();  	// previous slide.
								api.gotoSlide(4);	// moves to 4th slide.
								
								api.pause();	 	// pauses the slider timer.
								api.resume(); 		// resumes the slider timer.
								api.currentTime(); 	// returns the percentage of elapsed time.
								
								api.destroy(); 		// removes the slider. 
							
Properties
								api.so					// returns the object of slider options.
								
								api.view				// returns the slider transition object.
								api.view.slideList 		// returns a array of all slides.
								api.viwe.currentSlide 	// returns the current slide object.
							
Master Slider layer timeline

Exporting Sliders:

  • Navigate to MasterSlider admin page and click on Import & Export button.

Master Slider Export Import Button

  • Now a popup window will be open as shown in screenshot.
  • You can select specific sliders to export or select them all in one step and finally press export button.
  • Your browser will download an export file containing your sliders once you hit the "Export" button.
  • Keep this file at a secure location.

Master Slider Export Import Dialog



Importing Sliders:

  • Use Choose file button to select the export file you previously downloaded and click the "Import" button. This will bring back your previously exported sliders immediately.



Note MasterSlider won't export the images used in your sliders. Moving sites to different servers should not affect the plugin in any way. However, if you only want to move sliders between sites you need to copy the used images from your /wp-content/uploads/ folder into the same folder on your new installation.

Master Slider Export Import Dialog

Slider Skins

Name Class Name
skin default ms-skin-default
skin Light 2 ms-skin-light-2
skin Light 3 ms-skin-light-3
skin Light 4 ms-skin-light-4
skin Light 5 ms-skin-light-5
skin Light 6 ms-skin-light-6
skin Light 6 Round ms-skin-light-6 ms-skin-round
skin Contrast ms-skin-contrast
skin Black 1 ms-skin-black-1
skin Black 2 ms-skin-black-2
skin Black 2 Round ms-skin-black-2 ms-skin-round
skin Metro ms-skin-metro

Finding YouTube/Viemo Embed URL

Open the video in YouTube/Vimeo, play video and right-click on it, select Copy embed code then paste the embed code in a text editor


Get YouTube/Viemo Embed Code

Now you can see video embed URL in embed code which specified as iframe src.


Get YouTube/Viemo Embed URL

Finally in this example your embed url is : //www.youtube.com/embed/lEdC-oDYTVD



How to translate Master Slider in different languages?

There is two ways of translating Master Slider. Here they are :


1 - Using our online translation service (Recommended way)

You can start translating Master Slider by using our online translation service



2 - Using Poedit app

  1. Download Poedit

    There are several apps available to help you with translating .PO files. PoEdit is a popular one, and it's available on every major platform. You can download it from here.

  2. Start translating

    Open the default masterslider.po file from your /wp-content/plugins/master-slider/languages/ folder. When you save your work PoEdit will generate you a .MO file which will be needed to apply your work.

  3. Name your files properly

    WordPress recognizes your localization by a special formatting of file names. You will need to include the right language and country codes so it can identify what language is your work made for.

    For example, a French localization would have the file names: master-slider-fr_FR.po and master-slider-fr_FR.mo. You must follow this syntax, including the dash, underscore, and lower- or uppercase letters.

  4. Apply your localization

    Copy your newly created .PO and .MO files into the /wp-content/plugins/master-slider/languages/ folder. WordPress should use them immediately if you named your files properly.


  5. Also checkout More detailed article on translating WordPress plugins

Support


If you have any questions please follow these steps:

  1. Please read item's Documentation
  2. Take a look in our FAQ page
  3. Search plugin's support forum using this link for finding already asked or similar questions.
  4. If you did not find your answer, please post new topic in support forum

Why support forum?
  • It is organized and searchable (that makes support easier and faster)

Supporting our Items INCLUDES:
  • Responding to questions or problems regarding our item and its features
  • Fixing bugs and reported issues
  • Providing updates to ensure compatibility with new software versions

Item support does NOT include:
  • Customization and installation services
  • Support for third party software and plug-ins

Note We CANNOT provide support via email, Please ask your support related questions only in support forum.


Important Note For the fast troubleshooting, please send us detailed informations about the issue and make sure that you don't forget to send us your site url where you are using or want to use the item. Please note, that we cannot troubleshoot from screencast videos or screenshots.