Link - Lightbox / modal / popup, event triggering, smooth scrolling

There are more options under the link buttons than you would first think. You will find here a framework specific linking option, lightbox and actions to trigger animation events.

In this documentation

You can find link buttons at your layers, and at the slide settings.

Framework specific links

How to use it?


In WordPress you can search and select your posts or pages to link to them.


In Joomla you can search and select your articles to link to them.

This feature is available in the PRO version only. See the demos.

Create a lightbox automatically from your slider's background images at the Slider settings → Slides tab.
There are no customization options for the lightbox! If you want more specific behaviour or display, use a lightbox plugin or extension!

Content list - One per line

You can insert either images, YouTube videos, Vimeo videos or iframes in here to make them popup in a lightbox. If you want to show more contents, put one link into one line, and you will be able to switch between them with arrows.

If you use the WordPress version, writing the ID of another slider can open that slider in the lightbox, too.

Add title to the lightbox

You can add a title to your lightbox in the second input area:

Autoplay duration

If you have chosen to show more contents, you can add autoplay to them, and they will automatically switch from one to the other after the given time.


These features are available in the PRO version only.

How to add actions?

There are six actions available:

Scroll to

Smooth scrolling to either one of these options:

  • top - to the top of the page
  • bottom - to the bottom of the page
  • beforeSlider - right before the slider
  • afterSlider - right after the slider
  • previousSlider - to the previous slider
  • nextSlider - to the next slider
  • jQuery selector - to any element in your website, just give the jQuery selector of that element for example: #header
    You can use a slider's unique ID to scroll to it (when both sliders are on the same page). The id has the following syntax: n2-ss-[sliderid], and you can get the slider id  like this.
    Example: if the slider ID is 5, the slider's HTML id is: n2-ss-5 so the jQuery selector is #n2-ss-5.
  • Slider ID - Write down the ID number of your slider
Scroll to alias 3.3.16

Scrolls to a slider alias within the current page.

Go to slide

You can switch to another slide of the current slider, just give it's index number here. If you want to switch another slider's slide, check out this documentation.

Previous slide

The same as the Go to slide option, but this will switch to the previous slide, and you don't need to give an index number.

Next slide

Same as the Previous slide, just it will go to the next slide.

Slide event

At your layers' animations you can choose not to automatically show them, but to trigger them with events. If you put some event's name in here, the clicking of this layer will trigger the animation. Check out this documentation for more information about events.

Go to slide ID

You can switch to another slide of the current slider, just give it's ID here. You can find out the slide id from the url of the page, when you are in your slide's editor. For example here: slideid=23

23 is the slide's ID.

You can use this action to switch to a slide in a different slider which is on the same page as the slider with the Go to Slide ID action.