PHPMatters Help You Better Hosting Your PHP-based Sites
How to Add a WordPress Gallery Lightbox Using Lightbox Plus Colorbox

How to Add a WordPress Gallery Lightbox Using Lightbox Plus Colorbox

As is often the case, a gallery lightbox works to showcase large images/pictures in the form of modal dialogs on the basis of a JavaScript technique. More than that, it empowers website owners to take a view of any image/picture without having to leave the current screenshot. Due to its elegant style, this kind of image effect has been prevailing among the general public.

At this place, we would like to give a concise and intelligible explanation on how to add a WordPress gallery lightbox for those people who are new to the blogging world. Taking convenience into account, we will introduce a fast way to achieve this goal with the support of the WordPress plugin – Lightbox Plus Colorbox.

What Is Lightbox Plus Colorbox?

Lightbox Plus Colorbox, as one of the most robust lightbox plugins, was originally created by a developer named Jack Moore and licensed under the MIT License. In the further, this lightweight plugin helps to insert a lightbox into WordPress gallery images. In the meantime, it also displays some slideshows, forms, video and other external content in overlays.

Aside from mighty features, Lightbox Plus Colorbox has gained overwhelming popularity and recognitions with hundreds of thousands of downloads. According to regular users’ votes, this plugin has acquired a satisfying rating of 4.2 out of 5 stars. As for system requirement, it requires 3.6 or higher WordPress version and is compatible up to 3.9 edition. Most important of all, this Lightbox Plus Colorbox plugin is available to anyone at no charge.

WordPress Gallery Lightbox

How to Set Up a WordPress Gallery Lightbox Through this Plugin?

Objectively speaking, to set up a WordPress gallery lightbox has been much simpler and easier than ever by using this Lightbox Plus Colorbox plugin. For a start, you should firstly log into the WordPress dashboard in order to go to “Plugins” > “Add New.” If done, click “Install Now” button and you will be prompted to “Activate” this plugin. To be frank, the entire process is very similar to install a WordPress theme, which is elaborately-introduced in this article. If you have done with those necessary and essential steps, you will notice that there are “Edit” and “Deactivate” editing options for you to choose from as is showed in the following screenshot.

WordPress Gallery Lightbox

How to Customize this Lightbox Plus Colorbox?

Once activated, you shall go to “Appearance” > “Lightbox Plus Colorbox” to customize this plugin. As you may notice, in the “Base Settings” bar, you will be encompassed with a series of setting options ranging from “General”, “Styles” to “Advanced” and “Support”. Here, we would like to focus on some important aspects in the following part.

WordPress Gallery Lightbox

Add Selected Links to Pages/Posts
In the “General” section, you will need to make sure this “Use Secondary Lightbox” option has been checked, if you want to insert an external/internal link to your page. As for details, you should firstly copy a short code like:

<a class="IbpModal" href="WebsiteURL">Text Content</a>

For instance, given that you want to add a YouTube video, you will need to insert a line of code as is showed in below.

WordPress Gallery Lightbox

Note: If you have activated the “Secondary Lightbox” option, you will notice that an additional editing bar “Secondary Lightbox Settings” will pop-up at the bottom of this page. More importantly, you are empowered to make personalized settings on image size, position and many other aspects.

WordPress Gallery Lightbox

Adjust Background Style
Also, you are able to customize your lightbox style in the “Styles” bar. In details, you can make a selection from the drop-down menu next to the “Lightbox Plus Colorbox Style” option. More than that, you can decide whether use custom style and disable lightbox CSS or not.

WordPress Gallery Lightbox

Create a New Photo Gallery
Perhaps the most important part is to create a new photo gallery in a page, which is hassle-free. To do this, you shall firstly go to create new pages with a default or custom page template. Having filled in your post title and content, you are required to click “Add Media” button. Beware that you should put post content under the “Text” model.

WordPress Gallery Lightbox

If done, you will need to go to “Create Gallery”” > “Media Library” so as to select those images to display. Next, click the” Create a new gallery” button so as to edit your photo gallery. Pay attention that you should set link to “Attachment Page” so that those added photos can normally show on your website. Having done with those steps, you will need to click the “Insert gallery” option.

WordPress Gallery Lightbox

Note: Once completed, you will get your gallery IDs. In addition to that, you are able to attach those codes to the related content. To add more appealing image effect, you can attach elegant images to some words with a short code like:

<a href=”ImageUrl”>PostContent</a>

In the following screenshot, we make a sample online store by using a newly-added photo gallery.

WordPress Gallery Lightbox

Make More Advanced Settings
In the meantime, there are more advanced settings in the “Primary Lightbox Settings” bar for you to choose from, such as “General”, “Size”, “Position”, “Interface”, “Slideshow”, “Usage”, etc. Note that all those options are optional based on personal needs. Remember to click “Save all Changes” to take effect.

WordPress Gallery Lightbox

Top Lightbox Plugins

If you don’t intend to make use of this Lightbox Plus Colorbox, and instead turn to other easy-to-use options, there is a wide range of lightbox plugins open to you. Here, we figure out those top lightbox plugins for you from Now, drop down and have a quick look at them.

  • WP jQuery Lightbox – You are allowed to make personalized settings on the Scriptaculous Effects Library and Prototype Framework. Also, this plugin has been improved for mobile devices with swipe gestures for changing between images.
  • Lightbox Pop – You can create a clean and non-annoying popup lightbox, and in the meantime, have absolute control over popup content. More than that, this plugin displays dimension and position control in posts/ pages/home page.
  • Simple Lightbox – You are empowered to automatically activate links and resize images to fit your website well. In the further, this simple plugin supports links in widgets and image attachment links with customizable themes.
  • jQuery Colorbox – You are able to get a thumbnail when inserting an image to a page/post. Besides, this plugin can work for both WordPress and NextGEN galleries with plentiful themes.
  • Recommendable WordPress Hosting Solutions

    By all accounts, a user-friendly lightbox plugin will definitely has a magnificent effect on site performance and popularity. Plus, it is recommendable to choose a trustworthy and powerful WordPress hosting solution that is responsible for clearing many obstacles and paving your way to success. At this place, we have the following recommendable web hosting companies for you on the basis of our long-term researches and reviews.