NexGen Gallery Tutorial

The NextGen Gallery is a WordPress Photo Gallery that allows Pop-Up pictures and a photo slideshow with easy management from the back end of the Dashboard. When the gallery is installed, you will see a section in the left-hand sidebar entitled Gallery. If you click on the word Gallery, it will expand the sidebar section to show the following:

If you click on Overview it will show you how many galleries you have and how many images. This is the place that you can also go to add new galleries and images.

If you click on Add Gallery/Images, it will take you directly to the add image or add gallery screen.

Clicking on Manage Gallery allows you to organize and edit the images in your gallery, and update the gallery settings.

The Album section allows you to add different categories within your current gallery, or different albums.

Clicking on Tags allows you to add tags to your photos for SEO purposes.

The Options section is somewhat technical. The only thing you will probably need to edit here is how many images are shown in the gallery at one time. Setting it to “0” will show all image thumbnails.

The last sections – Style, Roles, About, and Reset/Uninstall are all technically related and probably not something that you will need to edit. If you are familiar with CSS, you can change the customization and appearance of the gallery in the Style section.

The Overview link will take you to a page with a lot of boxes that you honestly won’t ever use.

The important part is what is shown here: This gives you details on how many Galleries you have, how many Albums you’ve created, and how many Images are in your galleries.

Clicking on the number beside Images takes you to the Add Gallery/Images screen.

Clicking on the number beside Galleries takes you to the Manage Gallery screen.

Clicking on the number beside Albums takes you to the Manage Albums screen.

Clicking on the Upload pictures button takes you to the Add Gallery/Images screen.

The Add Gallery/Images screen will, by default, go to the Add new gallery tab. If you do not have any galleries, or want to add new ones to put on other pages, this is the place to do it. Name your gallery something that will make sense to you, and press the Add gallery button.

In this example, our gallery is called nextgen-gallery. Once you create your gallery, you will get a confirmation box appear above the gallery tabs showing you the code you will need to have to place the gallery on your page. Since this is the first gallery we have, the gallery code to place on the page is: [nggallery id=1]

You can go to the page that you want this gallery to appear in and place the code within the content as you see below. Remember that the id number may be different depending on how many galleries you have. If there are no photos in the gallery, your page will show that it is an invalid gallery until you add content to it. You can add the code to your page before adding pictures to your gallery, just don’t forget to add pictures at some point in time.

To add images to your gallery, you will go to the same Add Gallery/Images link. This time, click on the Upload Images tab. You will see a screen like this:

You can use the Browse button to find the location on your computer for where your image files are stored. The larger the image size, the longer it will take for the file to upload, and the more space you will use on your server.

Once you’ve chosen your image, be certain to select the gallery that the image is going to be added to, and press the Upload images button. Repeat for all images you want to add.

Clicking on the Manage Gallery screen gives you two options: Editing the gallery and contents therein, or deleting the gallery. The Delete button will delete the entire gallery, so only press this if you are certain you no longer want the gallery.

You can see the ID number for your gallery at this screen. In case you ever forget what the ID number is to add the gallery code to a page, this is where you will find it. [nggallery id=1]

Clicking on the Title of the gallery will take you to the Gallery Settings page.

You can see how many images are in your gallery under the Quantity column.

And pressing the Delete link will permanently delete the gallery.

The Gallery Settings screen has two sections to it: Gallery Properties and Image Properties.

The majority of these options are page-specific. You can add a Title and Description for the gallery here, and link the gallery to a currently existing page. If you do not have a page that you want the gallery to go on, you can do this under the Create New Page drop-down menu.

Be sure to press the blue Save Changes button when you have added/edited all applicable settings.

The bottom of the Gallery Settings page will give you all sorts of customization options for the Images within your gallery:

Most of these are self-explanatory. The text that you type in the Description box will appear below the photo when you are looking at the gallery on your site. Think of it as a Photo Caption section. Be certain to press the blue Save Changes section before navigating away from this page.

If you press the Sort Gallery button at the top of this section beside the Actions drop-down box, this will allow you to drag and drop your images to re-arrange them accordingly:

When you are done re-organizing your photos, press the blue Update Sort Order button and it will be saved.

That’s it! This is a very simple gallery without too much of a learning curve. The more practice you have with it, the better your galleries will be.

 

Share and Enjoy:
  • email
  • Facebook
  • Twitter
  • LinkedIn
  • MySpace
  • Google Bookmarks
  • Google Buzz
  • Tumblr
  • del.icio.us
  • StumbleUpon
  • Digg
  • Reddit
  • Yahoo! Buzz
  • Add to favorites
  • RSS
This entry was posted in Uncategorized by Jackie. Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

*


*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>