NextGEN Gallery - The Most Popular WordPress Photo Plugin

August 17, 2012 | Written by Ed Andrea

NextGEN Gallery is the most popular photo gallery plugin for WordPress, and with over 5 million downloads it is one of the most popular WordPress plugins of any kind.

NextGEN allows you to create beautiful galleries but also comes with powerful features such as bulk image uploads, grouping galleries into albums, and more.

We're going to show you how to get started with this popular and powerful plugin. We'll show you how to uset NextGEN to create a gallery and place it inside a post or page.

Step 1: Install the NextGen Gallery plugin

Installation is WordPress simple:

Go to Plugins > Add New.
Search for NextGEN gallery. If you just search for nextgen, you will get so many additional plugins you'll be extremely confused as to what to download.

Step 2: Set the options

After installation you can access everything from the Gallery link on the dashboard.
Click the Options tab to get started:

These are the most important items here that need your attention:

The gallery path - This is where you will store the images and each of your albums will have a folder here.
Delete Files - If you're going to be rearranging and changing your mind, you probably don't want to delete the images if you delete a gallery. But if users are creating the gallery you might.
Activate Permalinks - This activates friendly URLs for your galleries.
Create URL friendly image slugs - this is related to your permalinks option above. To update the structure you click the Proceed now button. You only need to do this one time.

On the rest of the tabs you can specify display details. Choose your default thumbnail sizes and what size your ultimate display will be. When you are done with making all your decisions you can start creating your first gallery.

Step 3: Add a new gallery

On the Dashboard Menu go to Gallery > Add new Gallery/Images.
Choose the Add new gallery tab.
Give the gallery a name.
Click Add gallery.

After you create the gallery, you get a notice with the shortcode for displaying the gallery on a post or page. It's always the same format [nggallery id=n] So the important part to remember here is the gallery id. All the galleries will be displayed based on their id number.

Step 4: Upload images

After you've added the images to the list, choose the gallery they will belong to.
Click Upload images and wait for the upload.
Thumbnails will be automatically created and pictures resized based on the options you chose during set up.

Go to the Upload Images tab.
There is a new feature that allows you to send up resized images if you don't want to send up your originals. You set the size for this in the Options section on the Image tab.

You can drag and drop multiple images on to the page to upload them. You can also just choose them from the list, click Open, and add them that way.

Step 5: Edit the gallery photos

After the pictures are uploaded you can immediately edit the gallery from the link, or use the side menu and click on Manage Galleries at any time.

The top of the editing screen will show you the options and the bottom will show the images you just uploaded. Interesting to note here is that one of the images I uploaded was a copyrighted clip art image that had information and tags associated with it. (Downloaded from Microsoft ClipArt Gallery) The data was imported with the photo.

The top part of the page has some advanced settings that will aid in the placement and linking of your galleries. That's more than we need for this discussion. Just accepting the defaults will still result in a successful gallery display.

This gives you a good example of the types of things you will want to put in these fields for your own pictures.

At the top of the column is a dropdown that gives you actions you can apply to each pictures.

Click one or more checkboxes next to the photos to include them in the mass action.
Use the individual picture menu for creating meta tags, changing the thumbnail, rotating sideways images, publishing or deleting one image.
The ID number is important for including pictures into articles. You may need to know this when writing shortcode later. This is where you will get the picture ID if you need it.

On the right side of the image table you find the fields for entering details about the image. The checkboxes allow you to exclude or include images in this gallery. Place a check mark in the box next to the ones don't want to appear on the website.

There are a variety of templates available for showing your photos. If you have one that will display titles and descriptions, it will get the information to from here. The tags are handy because you can actually create a short code with tags that will grab all the photos with the same tags. You'll learn more about this when you explore the shortcodes.

Step 6: Create an album to organize galleries

Go to the Dashboard side menu.
Go to Gallery >Album.
Enter a name.
Click Add.

What is the difference between a gallery and an album? Simply, Galleries contain your images and Albums contain your Galleries. Albums act as links and placeholders to quickly and easily navigate your galleries but Galleries will actually display your images.

If you don't have a large number of galleries, you won't need to put them into an album, but if you do decide to use albums, this will help you get organized.

Fill this out, and link it to a page.

Select an album from the dropdown.
Drag a gallery into the album.
Click Update or the changes won't be saved.
I'm going to drag both of my test galleries into Album ONE and then let's put the album on a page.

This is how you arrange your albums and galleries. It might make it easier if you thought of albums as categories and galleries as subcategories. For some reason I find the nomenclature more confusing. To me it seems more logical that an album would be inside a gallery. The column arrangement is also not logical to me.

The far right column has the list of albums.
The center column has the list of galleries that are not assigned to albums.
The left column will show the galleries that are assigned to the album you chose in the dropdown menu

Step 7. Add the gallery to a page

Type the shortcode into the editing window with the number of the gallery.
Save your page and preview it.

Now and go and see your gallery live on your site:

The product does come with several built in display templates for different effects. You can change the layout with various shortcodes. Here's a sample. No need to look for another extension for a slide show, that is built in as well.

[nggallery id=2 template=carousel images=7]

The image below is the same gallery, using the carousel template. There are other shortcodes and you can add additional arguments to them to control different things. You can get a list of shortcodes from this page. http://www.nextgen-gallery.com/nextgen-gallery-features/

That should get you started with the NextGen Gallery. You now know how to create a gallery, upload photos, and create different displays in pages and posts. If you want more power and variety, be sure to explore the extensions that will enhance it.

Comments

#1 Guest 2012-10-22 19:21

I have a horizontal navigation bar that includes “Gallery” as a dropdown menu. It currently contains four items when clicked (Landscape, Black & White, etc). I used NextGen Gallery plugin to create the galleries.

Using Word Press and Thesis, I can’t remember how to add two more items (Fine Art and Vintage) under the “Gallery” dropdown menu in the navigation bar /-:

Thank you for any help.

#2 Jack Stark 2013-01-24 03:59

Your guidance was great, but after the album was installed in the extended mode, it only showed one image on each gallery. When I clicked on the image or the title, it just reverted to the album again. No other photos showed.
My company: wwww.autoreviewblog.net
The album contains 3 galleeries. Any ideas?

Add comment

Start Online Training

Members get access to all our video training. That's 1,142 training sessions in Joomla, Drupal, WordPress and Coding.

Latest Blog Posts and Tutorials

Blog Categories

Latest Comments

Content Versioning - A Sneak Peek at Joomla's Newest Proposed Feature
Comment by vickiwatson
Oh, wow! I've been waiting for this for years. This will make Joomla practically ...
Content Versioning - A Sneak Peek at Joomla's Newest Proposed Feature
Comment by andy567
Looks very nice :) Can we get it to autosave though? Like wordpress does?
Content Versioning - A Sneak Peek at Joomla's Newest Proposed Feature
Comment by steve
Thanks Dave, Andrew, Jon. It's great to hear there's a lot of enthusiasm for this ...
Content Versioning - A Sneak Peek at Joomla's Newest Proposed Feature
Comment by Jon Lackey
Very nice! Features like this will really set Joomla apart in the eyes of "enterprise" ...
How to Solve Error #1045 in phpMyAdmin
Comment by Ugo
Done! Thank you very much. You solve this problem

The License for Our Tutorials

All of our tutorials are published under the Creative Commons Attribution-NonCommercial license. This means:

You can re-use these tutorials.
You can modify these tutorials.
You must link back to our original tutorial.
You can't use these tutorials commercially.

Click here to read the full license.

WordPress Tutorials and Blog Posts