Lightbox Gallery Module


Lightbox Gallery Module is a powerful Dotnetnuke module with jQuery plugin that provides beautiful animated filtering, custom captions. It plays nice with CSS, making it a great choice for dynamic and responsive layouts.



How to install

1. Download and extract file from trial or pruchase module DNNStore. There are two install files one for DNN 7 version and one for DNN 8 and 9 version. Choosing the correct version your DNN website.

Choose file to install extension

2. Login to website with administrator account. Go to Settings -> Extensions. Then choose the correct version for your DNN website.

Install extension

Click Next, and it goes to module information.

Module information

Click Next ... the install show completed.

Installation successfull

3. To add module to page. Click icon "Add module" as the image below.

Add module to page

An dialog will show. Search module and drag and drop module to pane that you want to

Add module to page

When the module added to page. Drag mouse to pencil icon, it will show three options: Manage gallery, Manage category, Manage Module settings

Module options

Manage Module Settings

1. To Manage module settings drag mouse to pencil icon and click on the link "Module Settings". It is redirect to module settings page. There are many options list image below

Manage module settings

2. Options list

Name Values Default Description
Animation type Fade Out, Quick Sand, Bounce Left, Bounce Top, Bounce Bottom, Move Left, Slide Left, Fade Out Top, Sequentially, Skew, Slide Delay, 3D, Rotate Sides, Flip Out Delay, Flip Out, Unfold, Fold Left, Scale Down, Scale Sides, Front Row, Flip Bottom, Rotate Room. Rotate Sides Defines which animation to use for items
Gap Horiziontal 10,11,12,20, ... 1000 10 Horizontal gap among items
Gap Vertical 10,11,12,20, ... 1000 10 Vertical gap among items
Caption Animation Push Top, Push Down, Reveal Bottom, Reveal Top, Move Right, Overlay Bottom Push, Overlay Bottom, Overlay Bottom Reveal, Overlay Bottom Along, Overlay Right Along, Minimal, Fade In, Zoom, Opacity Zoom Caption - the overlay shown when you put the mouse over an item.
Display type Default, Fade In, Lazy Loading, Fade In To Top, Sequentially, Bottom To Top Lazy Loading The plugin will display his content based on the following values.
Display type speed 400,500,600,601.... 10000 400 Defines the speed of displaying the items
Hide category Cheched or Uncheck Uncheck Show or Hide category
Media queries Width[1366,800,600,300] = Items[5,4,3,1] Width[1116,800,500,300] = Items[5,4,2,1] Media queries ( set item for seperate screen)
Filter Align Left, Right, Center Left Set Align for category
Caption Align Left, Center Left Select caption align
Show image name Cheched or Uncheck Uncheck Show or Hide image name grid
Show image description Cheched or Uncheck Uncheck Show or Hide image description grid
Category Order Field Order by Category Name, Category Position Category Position Set order for Category
Category Order Type ASC, DESC DESC Set order type for category
Image Order Field Order by Image Name, Image Position Image Position Set order for Image
Image Order Type ASC, DESC DESC Set order type for Image
Change text All All, Alless,..... All Change text "All" when image popup
Change text Off Off, Offess,..... of Change text "Off" when image popup
Image thumb width 400,450,... 400 Image thumbnail width to resize when uploaded
Image thumb height 300,350,... 400 Image thumbnail height to resize when uploaded
Load original size Checked and uncheck Uncheck Load originail image size
Show count on Category Checked and uncheck Check Show count image on Category
Link target Blank, Self Blank Using when iten has external link

Manage Category

To Manage category drag mouse to pencil icon and click on the link "Manage Category". Then it goes to manage category page as the image below

In the form, you can add new, edit, update, move up, move down category

Manage category

Manage Gallery

To Manage Gallery drag mouse to pencil icon and click on the link "Manage Gallery".

You can manage image on this form. In this form, you can upload, update, deleted selected items. You can manage item properties on each row.

Manage Gallery

1. If you want to load another image for popup image. On this grid, choose file at Popup image column. When the image upload it will show on the grid

Another Popup Image

2. To add external link for image. Enter external link on the column External Link. It will redirect to external link

Add External Link

3. To add video link for image. Enter video link on the column Video Link. When user click on image. It will show video. The video can be Youtube or Vimeo link

Add Video Link


Some of screen shoot

Lightbox Gallery Module

Lightbox Gallery Module

Lightbox Gallery Module

Lightbox Gallery Module

Lightbox Gallery Module

Lightbox Gallery Module


Standard license The standard license allows the activation and use on 1 DNN portal. Not permitted Redistribution. Free update within 90 days
Enterprise license Unlimited DotNetNukeĀ® Installation. Not permitted Redistribution. Free update


If you have any questions that are beyond the scope of this documentation file, please feel free to email via my email

Created by CoolDNN