LayerSlider

https://layerslider.com/documentation/
Admin
LayerSlider is a comprehensive WordPress plugin for creating responsive animated sliders, popups,...
Tokens:22,876
Snippets:418
Trust Score:9.6
Update:5 months ago
Show doc for...
Tokens:
Raw
### Get Default Init Options

Source: https://layerslider.com/documentation

Returns the full list of the default slider options.

```APIDOC
## Get Default Init Options

### Description
Returns the full list of the default slider options.

### Method
`layerSlider('defaultInitOptions')`

### Endpoint
`defaultInitOptions`

### Request Example
```javascript
var data = $('#slider').layerSlider('defaultInitOptions');
```
```

--------------------------------

### Control Smart Operations Starting Value

Source: https://layerslider.com/documentation

Ensure consistent results in Smart Operations by defining a specific starting value for calculations. Using `0 ++500` forces all operations to begin from the number 0, regardless of the layers' initial values.

```plaintext
0 ++500
```

--------------------------------

### Get User Init Options

Source: https://layerslider.com/documentation

Returns the slider options that were provided by the user in the initialization code.

```APIDOC
## Get User Init Options

### Description
Returns the slider options provided by the user in the init code.

### Method
`layerSlider('userInitOptions')`

### Endpoint
`userInitOptions`

### Request Example
```javascript
var data = $('#slider').layerSlider('userInitOptions');
```
```

--------------------------------

### Play Media

Source: https://layerslider.com/documentation

Starts playback of any visible media element on the current slide.

```APIDOC
## Play Media

### Description
Start playback of any visible media element on the current slide.

### Method
`layerSlider('playMedia')`

### Endpoint
`playMedia`

### Request Example
```javascript
$('#slider').layerSlider('playMedia');
```
```

--------------------------------

### Get Original Markup

Source: https://layerslider.com/documentation

Returns the original HTML markup that the slider was initialized on.

```APIDOC
## Get Original Markup

### Description
Returns the original HTML markup that the slider was initialized on.

### Method
`layerSlider('originalMarkup')`

### Endpoint
`originalMarkup`

### Request Example
```javascript
var data = $('#slider').layerSlider('originalMarkup');
```
```

--------------------------------

### Get Slider Init Options

Source: https://layerslider.com/documentation

Returns the parsed slider options, including user-provided data, used for initialization.

```APIDOC
## Get Slider Init Options

### Description
Returns the parsed slider options (extended by user data) used to initialize the slider.

### Method
`layerSlider('sliderInitOptions')`

### Endpoint
`sliderInitOptions`

### Request Example
```javascript
var data = $('#slider').layerSlider('sliderInitOptions');
```
```

--------------------------------

### Embed LayerSlider Project Starting on a Specific Slide

Source: https://layerslider.com/documentation

Embed a LayerSlider project and force it to start on a specific slide using the 'firstslide' parameter. This is useful for embedding the same project multiple times with different starting points.

```html
[layerslider id="1" firstslide="2"]
```

--------------------------------

### Start Slideshow

Source: https://layerslider.com/documentation

Resumes the slideshow, allowing the slider to change slides at the end of the animation timeline.

```APIDOC
## Start Slideshow

### Description
Resumes the slideshow and re-enables the slider to change slides when reaching the end of animation timeline. Since transitions may occur even in a paused state depending on the `pauseLayers` setting, it possible that the timeline has already reached its end point when calling this command.

### Method
`layerSlider('start')` or `layerSlider('startSlideshow')`

### Endpoint
`start` or `startSlideshow`

### Request Example
```javascript
$('#slider').layerSlider('start');
```
```

--------------------------------

### Get User Initialization Options

Source: https://layerslider.com/documentation

Returns the slider options that were provided by the user in the initialization code. This helps in understanding the custom configuration applied.

```javascript
var data = $('#slider').layerSlider('userInitOptions');
```

--------------------------------

### Override LayerSlider Starting Slide with PHP

Source: https://layerslider.com/documentation

Specify a different starting slide for a LayerSlider project when embedding it using the `layerslider()` PHP function. The third argument is an array of settings to override, such as 'firstslide'.

```php
<?php layerslider( 1, '', array( 'firstslide' => 3 ) ); ?>
```

--------------------------------

### Reset Slide

Source: https://layerslider.com/documentation

Immediately sets the current slide back to its starting state and pauses it.

```APIDOC
## Reset Slide

### Description
Immediately sets the current slide back to its starting state and pauses it.

### Method
`layerSlider('resetSlide')`

### Endpoint
`resetSlide`

### Request Example
```javascript
$('#slider').layerSlider('resetSlide');
```
```

--------------------------------

### Get Default Initialization Options

Source: https://layerslider.com/documentation

Returns the full list of the default slider options. This is useful for reference or when needing to reset to defaults.

```javascript
var data = $('#slider').layerSlider('defaultInitOptions');
```

--------------------------------

### Initiate Slide Change

Source: https://layerslider.com/documentation

Initiates a slide change to a specified slide number. Slide numbering starts from 1.

```APIDOC
## Initiate Slide Change

### Description
Initiate a slide change to the specified slide number. The count starts from 1.

### Method
`layerSlider(slideNumber)`

### Parameters
#### Path Parameters
- **slideNumber** (integer) - Required - The number of the slide to switch to (1-based index).

### Request Example
```javascript
$('#slider').layerSlider(3);
```
```

--------------------------------

### Get Slider Data

Source: https://layerslider.com/documentation

Returns the entire data object that the slider uses.

```APIDOC
## Get Slider Data

### Description
Returns the entire data object that the slider uses.

### Method
`layerSlider('data')`

### Endpoint
`data`

### Request Example
```javascript
var data = $('#slider').layerSlider('data');
```
```

--------------------------------

### Initiate Slide Change by Number

Source: https://layerslider.com/documentation

Use this method to change to a specific slide by its number. Counting starts from 1.

```javascript
$('#slider').layerSlider(3);
```

--------------------------------

### Get Parsed Slider Initialization Options

Source: https://layerslider.com/documentation

Returns the parsed slider options, including any user-defined overrides. This shows the final configuration used to initialize the slider.

```javascript
var data = $('#slider').layerSlider('sliderInitOptions');
```

--------------------------------

### Get Event Data

Source: https://layerslider.com/documentation

Returns the Event Data object with relevant values at the time of execution.

```APIDOC
## Get Event Data

### Description
Returns the Event Data object filled with the relevant values at the time of execution.

### Method
`layerSlider('eventData')`

### Endpoint
`eventData`

### Request Example
```javascript
var data = $('#slider').layerSlider('eventData');
```
```

--------------------------------

### Play Media on Current Slide

Source: https://layerslider.com/documentation

Starts playback of any visible media element (e.g., video, audio) on the current slide. This is useful for auto-playing media when a slide becomes active.

```javascript
$('#slider').layerSlider('playMedia');
```

--------------------------------

### Get Original HTML Markup

Source: https://layerslider.com/documentation

Returns the original HTML markup that the slider was initialized on. This can be useful for auditing or reconstructing the initial state.

```javascript
var data = $('#slider').layerSlider('originalMarkup');
```

--------------------------------

### Accessing LayerSlider Event Data

Source: https://layerslider.com/documentation

This example shows how to retrieve and log the event data object for a LayerSlider instance. Ensure you use the correct selector for your slider container.

```javascript
var data = jQuery('#slider').layerSlider('eventData');
console.log( data );
```

--------------------------------

### Triple Addition Operator

Source: https://layerslider.com/documentation

Adds incrementally to all layer values, starting from the first layer. Affects all items.

```LayerSlider
+++10
```

--------------------------------

### Double Addition Operator

Source: https://layerslider.com/documentation

Adds incrementally to layer values, starting from the second layer. Skips the first item.

```LayerSlider
++10
```

--------------------------------

### Start Slideshow

Source: https://layerslider.com/documentation

Resumes the slideshow, allowing the slider to change slides automatically. It's possible the timeline has already reached its end if animations continued during a paused state.

```javascript
$('#slider').layerSlider('start');
```

--------------------------------

### Reset Current Slide

Source: https://layerslider.com/documentation

Immediately sets the current slide back to its starting state and pauses it. This is useful for resetting animations or interactive states.

```javascript
$('#slider').layerSlider('resetSlide');
```

--------------------------------

### Get Event Data Object

Source: https://layerslider.com/documentation

Returns the Event Data object, which contains relevant values at the time of execution. This is useful for debugging or reacting to specific events.

```javascript
var data = $('#slider').layerSlider('eventData');
```

--------------------------------

### Get Slider Data Object

Source: https://layerslider.com/documentation

Returns the entire data object that the slider uses. This can be useful for inspecting the slider's internal state.

```javascript
var data = $('#slider').layerSlider('data');
```

--------------------------------

### Open Popup

Source: https://layerslider.com/documentation

Opens initialized Popups that are waiting to be launched.

```APIDOC
## Open Popup

### Description
Opens initialized Popups waiting in the background to be launched.

### Method
`layerSlider('openPopup')`

### Endpoint
`openPopup`

### Request Example
```javascript
$('#slider').layerSlider('openPopup');
```
```

--------------------------------

### Create Multilingual Content with qTranslate

Source: https://layerslider.com/documentation

Use qTranslate's shortcode-like syntax within layer content to display different text based on the visitor's selected language. Ensure 'Use markup caching' is disabled in plugin settings for dynamic content to work correctly.

```html
[:en]English text[:de]German text
```

--------------------------------

### Open Popup

Source: https://layerslider.com/documentation

Opens any initialized Popups that are waiting to be launched. This is used to trigger popups programmatically.

```javascript
$('#slider').layerSlider('openPopup');
```

--------------------------------

### Insert LayerSlider Project with PHP

Source: https://layerslider.com/documentation

Use the `layerslider()` function to dynamically insert a LayerSlider project. The first argument is the project ID. Optional arguments include filters for page targeting and an array of settings to override.

```php
<?php layerslider(1); ?>
```

```php
<?php layerslider(1, 'homepage'); ?>
```

```php
<?php layerslider(1, 'my-custom-post-title'); ?>
```

```php
<?php layerslider(2, '1369'); ?>
```

```php
<?php layerslider('homefullwidth', 'category-name'); ?>
```

```php
<?php layerslider(3, 'homepage,about-us,1234'); ?>
```

--------------------------------

### Triple Subtraction Operator

Source: https://layerslider.com/documentation

Subtracts incrementally from all layer values, starting from the first layer. Affects all items.

```LayerSlider
---10
```

--------------------------------

### Incrementally Resize Layers with Smart Operations

Source: https://layerslider.com/documentation

Apply incremental size changes to multiple layers simultaneously using Smart Operations. The `++64` formula increases the size of each selected layer by 64 pixels, with each subsequent layer increasing by another 64 pixels.

```plaintext
++64
```

--------------------------------

### Double Subtraction Operator

Source: https://layerslider.com/documentation

Subtracts incrementally from layer values, starting from the second layer. Skips the first item.

```LayerSlider
--10
```

--------------------------------

### Triple Multiplication Operator

Source: https://layerslider.com/documentation

Multiplies layer values by an increasing factor, starting from the first layer. Affects all items.

```LayerSlider
***2
```

--------------------------------

### Next Slide

Source: https://layerslider.com/documentation

Skips to the next slide in the sequence.

```APIDOC
## Next Slide

### Description
Skips to the next slide in the sequence.

### Method
`layerSlider('next')` or `layerSlider('nextSlide')`

### Endpoint
`next` or `nextSlide`

### Request Example
```javascript
$('#slider').layerSlider('next');
```
```

--------------------------------

### Triple Division Operator

Source: https://layerslider.com/documentation

Divides layer values by an increasing factor, starting from the first layer. Affects all items.

```LayerSlider
///2
```

--------------------------------

### Reverse Slide and Transitions

Source: https://layerslider.com/documentation

Plays the current slide and all its transitions in reverse, then pauses at the beginning. Pass `true` as a second parameter to continue replaying the slider normally afterward.

```javascript
$('#slider').layerSlider('reverse', true);
```

--------------------------------

### Double Division Operator

Source: https://layerslider.com/documentation

Divides layer values by an increasing factor, starting from the second layer. Skips the first item.

```LayerSlider
//2
```

--------------------------------

### Shift Layer Timings with Smart Operations

Source: https://layerslider.com/documentation

Use Smart Operations to shift the timing of selected layers by a specified amount. The `+500` formula shifts all selected layer timings by 500 milliseconds relative to their current values.

```plaintext
+500
```

--------------------------------

### Replay Slide

Source: https://layerslider.com/documentation

Restarts the current slide, replaying all layer transitions from the beginning.

```APIDOC
## Replay Slide

### Description
Restarts the slide, replays all layer transitions from the beginning.

### Method
`layerSlider('replay')` or `layerSlider('replaySlide')`

### Endpoint
`replay` or `replaySlide`

### Request Example
```javascript
$('#slider').layerSlider('replay');
```
```

--------------------------------

### Double Multiplication Operator

Source: https://layerslider.com/documentation

Multiplies layer values by an increasing factor, starting from the second layer. Skips the first item.

```LayerSlider
**2
```

--------------------------------

### Navigate to Previous Slide

Source: https://layerslider.com/documentation

Changes to the previous slide in the sequence. Useful for custom navigation.

```javascript
$('#slider').layerSlider('prev');
```

--------------------------------

### Triple Add-Multiply Operator

Source: https://layerslider.com/documentation

Combines addition and multiplication, incrementing the added value for each subsequent layer, starting from the first. Affects all items.

```LayerSlider
++*10
```

--------------------------------

### Triple Subtract-Multiply Operator

Source: https://layerslider.com/documentation

Combines subtraction and multiplication, incrementing the subtracted value for each subsequent layer, starting from the first. Affects all items.

```LayerSlider
--*10
```

--------------------------------

### Reverse Slide

Source: https://layerslider.com/documentation

Plays the current slide and all its transitions backwards, then pauses at the beginning.

```APIDOC
## Reverse Slide

### Description
Play the slide and all transitions backwards, then pause at the beginning of the slide. Pass `true` as a second parameter to continue replaying the slider normally afterward.

### Method
`layerSlider('reverse', [continuePlayback])`

### Endpoint
`reverse`

### Parameters
#### Path Parameters
- **continuePlayback** (boolean) - Optional - If `true`, the slider will continue playing normally after reversing.

### Request Example
```javascript
$('#slider').layerSlider('reverse', true);
```
```

--------------------------------

### Resume Slider

Source: https://layerslider.com/documentation

Resumes the slider and continues playing any frozen animations.

```APIDOC
## Resume Slider

### Description
Resumes the slider and continues playing frozen animations.

### Method
`layerSlider('resume')` or `layerSlider('resumeSlider')`

### Endpoint
`resume` or `resumeSlider`

### Request Example
```javascript
$('#slider').layerSlider('resume');
```
```

--------------------------------

### Navigate to Next Slide

Source: https://layerslider.com/documentation

Skips to the next slide in the sequence. This is useful for creating custom navigation controls.

```javascript
$('#slider').layerSlider('next');
```

--------------------------------

### Triple Divide-Add Operator

Source: https://layerslider.com/documentation

Divides layer values by a fixed factor and then adds an incrementally increasing value, starting from the first layer. Affects all items.

```LayerSlider
//+2
```

--------------------------------

### Triple Multiply-Add Operator

Source: https://layerslider.com/documentation

Multiplies layer values by a fixed factor and then adds an incrementally increasing value, starting from the first layer. Affects all items.

```LayerSlider
**+2
```

--------------------------------

### Previous Slide

Source: https://layerslider.com/documentation

Changes to the previous slide in the sequence.

```APIDOC
## Previous Slide

### Description
Changes to the previous slide.

### Method
`layerSlider('prev')` or `layerSlider('previousSlide')`

### Endpoint
`prev` or `previousSlide`

### Request Example
```javascript
$('#slider').layerSlider('prev');
```
```

--------------------------------

### Double Multiply-Add Operator

Source: https://layerslider.com/documentation

Multiplies layer values by a fixed factor and then adds an incrementally increasing value, starting from the second layer. Skips the first item.

```LayerSlider
*+2
```

--------------------------------

### Switch to a Specific Slide

Source: https://layerslider.com/documentation

Use this method to programmatically change the current slide. Ensure the slider is initialized and the target slide index is valid.

```html
<a href="javascript:void(0);" onclick="$('#slider').layerSlider(2);">Change to slide 2</a>
```

--------------------------------

### Double Divide-Add Operator

Source: https://layerslider.com/documentation

Divides layer values by a fixed factor and then adds an incrementally increasing value, starting from the second layer. Skips the first item.

```LayerSlider
/+2
```
Tokens:
Raw