Use the Native WordPress Gallery with a Lightbox Effect
Right before we jump into this tutorial, we’d like to mention an alternative method that you might find both faster and easier. As you know WordPress as a CMS relies on plugins to extend its core functionality, and one such plugin for this use case is Modula. Modula is an easy-to-use WordPress gallery plugin that makes adding flexible photo and video galleries to your website easier than ever. You can learn more about Modula by clicking here or get started right away by downloading the free plugin from the WordPress plugin repository by clicking here.
There are tens of thousands of plugins on WordPress.org, but it’s amazing how much you can get done with the WordPress core and just a plugin or two.
In this tutorial we’re going to show you how to create a sleek photo gallery with elegant pop-ups, all using just a default WordPress site plus only one plugin.
Step 1. Add a new post or new page
- Click Add New for either a post or a page.
- Click the Upload/Insert icon.
Step 2. Add a list of images to that page or post
- Open your file explorer and drag and drop a group of photos to the ” Drop files here” Box.
- If you are successful, the image files will be listed and you will see progress bars to show you they’re uploading.
- When every one is uploaded, click Save all changes at the bottom of the list. Scroll down to see it if it’s not visible.
- There will now be gallery tab at the top of the window. This tab is specific to this page or post. If you add a new page or post, you won’t see this tab until you have uploaded pictures.
Step 3. Adjust settings and add the gallery
- Scroll to the bottom of the window.
- Choose your Gallery Settings.
- Click Insert gallery.
Step 4. Customize the page
- Now you will see a gallery icon in the center of the area where you inserted your gallery.
- You can insert text or images above or below this section to customize the page.
Step 5. View the page to see the gallery
- The thumbnails will show based on the settings you chose.
So far so good. However, if you click on the individual images, all you see are the images flat on the page. To get a really nice pop-up effect, we’ll need to add a plugin.
Step 6. Add the lightbox effect
- Go to Plugins > Add New.
- Search for “jQuery Lightbox For Native Galleries”.
- Install Now.
- Activate the Plugin.
- Go to Settings > jQuery Lightbox.
- Choose your theme.
- View your gallery and click a thumbnail. Your images will pop up on a light box with navigation control and image count.
You now have a photo gallery with a lightbox effect installed. You can make further enhancements with additional plugins. For example you can create Multiple Galleries with this extension http://wordpress.org/extend/plugins/multiple-galleries/.
This is so cool! I have no clue that I could create a photo gallery so easily.
Nice one…….
Hi Ed Andrea, could you post article to create gallery such “view as one” similar to mashable post using nextgen. Or another plugin gallery to create those feature. thanks
Excellent. Simple and does just what I want – everything else is too overloaded with features, this is perfect.
Oh, and it actually works!
I need help with this.. the Lightbox does not pop up —
thanks so much!
thanks so much, actually works great!