How to customize Nivo Lightbox?

On the Gallery Bank Navigation Panel, select Lightboxes – Nivo Lightbox.

Once you click on “Nivo Lightbox”, you will be redirected to the following page as mentioned below.

Once you would reach the page as seen above, you would be able to manage different Nivo Lightbox settings. For this, you would need to click on particular tabs which you would like to modify from top of the page.

How to customize Settings for Nivo Lightbox?

In order to manage settings for Nivo Lightbox, you would need to click on “Settings” tab from top of the page.

Once you click on “Settings”, you will be redirected to following page as mentioned below.

Here is the description of each control on this page.

Choose Open Effects : In this field, you would need to choose Effect which is to be applied on opening of Nivo Lightbox.

Keyboard Navigation : If you would like to navigate images from keyboard arrow keys, then you would need to choose “Enable” from dropdown or vice-versa.

Click Image To Close : If you would like to close lightbox by clicking on image, then you would need to choose “Enable” from dropdown or vice-versa.

Click Overlay To Close : If you would like to close lightbox by clicking on overlay, then you would need to choose “Enable” from dropdown or vice-versa.

Overlay Color : In this field, you would need to choose Color for Overlay.

Overlay Opacity : In this field, you would need to provide Opacity for Overlay. It should be from 0 to 100.

Border Style : In this field, you would need to provide Width, Style and Color for border of Nivo Lightbox.

Border Radius : In this field, you would need to provide “Border Radius” for Nivo Lightbox.

Once everything is being setup, you would need to click on “Save Changes” button located at bottom of the page to save the settings.

How to customize Image Title for Nivo Lightbox?

In order to manage image title for Nivo Lightbox, you would need to click on “Image Title” tab from top of the page.

Once you click on “Image Title”, you will be redirected to following page as mentioned below.

Here is the description of each control on this page.

Title : In this field, you would need to choose “Show” to display Title for image in Nivo Lightbox.

HTML Tag : In this field, you would need to choose “HTML Tag” for Image Title.

Text Alignment : In this field, you would need to choose “Text Alignment” for Image Title.

Font Style : In this field, you would need to provide “Font Size and Color” for Image Title.

Font Family : In this field, you would need to choose “Font Family” for Image Title.

Margin : In this field, you would need to provide “Margin” for Image Title.

Padding : In this field, you would need to provide “Padding” for Image Title.

Once everything is being setup, you would need to click on “Save Changes” button located at bottom of the page to save the settings.

How to customize Image Description for Nivo Lightbox?

In order to manage image description for Nivo Lightbox, you would need to click on “Image Description” tab from top of the page.

Once you click on “Image Description”, you will be redirected to following page as mentioned below.

Here is the description of each control on this page.

Description : In this field, you would need to choose “Show” to display Description for image in Nivo Lightbox.

HTML Tag : In this field, you would need to choose “HTML Tag” for Image Description.

Text Alignment : In this field, you would need to choose “Text Alignment” for Image Description.

Font Style : In this field, you would need to provide “Font Size and Color” for Image Description.

Font Family : In this field, you would need to choose “Font Family” for Image Description.

Margin : In this field, you would need to provide “Margin” for Image Description.

Padding : In this field, you would need to provide “Padding” for Image Description.

Once everything is being setup, you would need to click on “Save Changes” button located at bottom of the page to save the settings.