1. Home
  2. LayerSlider Shortcode

LayerSlider Shortcode

Updated on October 24, 2017

The LayerSlider shortcode is one of the most powerful premium WordPress slideshow plugins. For users of the Jupiter WordPress theme, this plugin is bundled in with the theme for free.

In this article, we’ll explain how to import/create a slideshow and display it using the LayerSlider shortcode in the Jupiter WordPress theme.

To see the LayerSlider shortcode in action, check out the demo page.

Importing/Creating a Slideshow

Almost all of the slideshows in our templates are built by the plugin. Based on the template you install, the appropriate slideshow will be imported automatically.

If for any reason the slideshow is missing on your website, you can find the slideshow package in the package you download from ThemeForest.

Layerslider shortcode - template sliders

Importing a Slideshow

In addition to our slideshows, there are lots of free and premium pre-built slideshows for the plugin. You can download them from the Explore sliders page.

To import a slideshow:

1After downloading a pre-built slideshow, from WordPress left menu, go to the LayerSlider WP page.

Layerslider shortcode - menu

2Click on the Import Sliders box, select the downloaded slideshow from your computer, and click on Import Sliders. For this example, we are using the Giovedi slideshow (it belongs to the Giovedi template.).

Layerslider shortcode - import sliders

3Depending on the slideshow size, it may take up to a couple of minutes to be imported. After successfully importing, the slideshow will be listed on the page.
4Follow the next section for displaying the slideshow on a page.

Creating a Slideshow

If you need to create your own slideshow, read the official documentation of the plugin.

Displaying the Slideshow

After creating/importing a slideshow, it is time to display it on a page via the LayerSlider shortcode.

To add the shortcode:

1Add a new page or edit an existing page.
2From the Visual Composer screen, click on the + button.

Layerslider shortcode - add element

3In the Add Element pop-up screen, search for LayerSlider and click on it to be added to the page.

Layerslider shortcode - search

4When the shortcode is added, a new pop-up screen called LayerSlider Settings will open. From the Select Slideshow setting, select your slideshow.

Layerslider shortcode - settings

5Click on the Save Changes button and publish/update the page to check the result.

Adding an Extra Class Name

The Extra Class Name field in the settings pop-up allows you to add an extra class name to the shortcode. It’s useful when you need to target the shortcode in a stylesheet or JavaScript file.

You can read the Adding a custom CSS class to a shortcode article for further explanation.

Did this answer your question?