How to Link Images in a NextGen Gallery Album to a Post or Page
Three years ago I wrote a couple of article about how an images in a NextGen Gallery could be linked to a post or a page using the NextGen Custom Fields plugin. And last week I provided instructions about how moving the NextGen files that you have modified to your theme directory would allow you to upgrade NextGen Gallery without losing any of your customizations.
Recently, I was asked to link images in a NextGen album to a post or page. An album is a collection of galleries. As the instructions are slightly different, I decided to add another NextGen Gallery tutorial.
If the NextGen Custom Fields plugin has not been installed, that is the first thing that you need to do. NextGen Gallery must already be installed and you must already have galleries set-up. Since we are using albums in this tutorial, you should have an album set up as well.
Instructions
- Install and activate NextGen Custom Fields.
- Put the following URL in the address bar in your web browser. http://www.example.com/wp-admin/admin.php?page=nextgen-gallery-custom-fields/ngg-custom-fields.php&mode=upgrade Make sure you change www.example.com to your own domain name. This seems to be a 2nd level of activation for the plugin.
- You will now have a NGG Custom Fields menu in the left navigation in the WordPress Admin below settings. Click on it.
- You can choose to create a custom field for individual images or for an entire gallery. Since we want to link images in an album select the 2nd choice – Gallery Custom Fields.
- On the next screen you will want to name the custom field, which I will call Link, select the Gallery in which you will be using it and chose the type of field. Text will almost always be fine for the type of field.
- Go to the Gallery that you added the new field to under Gallery > Manage Gallery > Click on the name of the Gallery.
- There will be a new field area called Custom Columns before the list of images in the Gallery and it will have the name of the field next to the input area. The URL added to this field will be where the gallery image in an album will link to. Using my earlier instructions, each image in a gallery can also link to a specific location.
- Once you have filled in the URL in the new field, you will need to modify a NextGen Gallery template so that the new link works. Go to Plugins > Editor > Select Plugin to Edit Dropdown Box > NextGen Gallery > nextgen-gallery/view/album-extend.php
- Look for the following block of code.
<div class=”ngg-album”>
<div class=”ngg-albumtitle”><a href=”<?php echo $gallery->pagelink ?>”><?php echo $gallery->title ?></a></div>
<div class=”ngg-albumcontent”>
<div class=”ngg-thumbnail”>
<a href=”<?php echo $gallery->pagelink ?>”><img class=”Thumb” alt=”<?php echo $gallery->title ?>” src=”<?php echo $gallery->previewurl ?>”/></a>
</div>
<div class=”ngg-description”>
<p><?php echo $gallery->galdesc ?></p>
<?php if ($gallery->counter > 0) : ?>
<p><strong><?php echo $gallery->counter ?></strong> <?php _e(‘Photos’, ‘nggallery’) ?></p>
<?php endif; ?>
</div>
</div>
</div> - Replace it with
<div class=”ngg-album”>
<div class=”ngg-albumtitle”><a href=”<?php echo nggcf_get_gallery_field($gallery->gid, “Link”); ?>”><?php echo $gallery->title ?></a></div><div class=”ngg-albumcontent”>
<div class=”ngg-thumbnail”>
<a href=”<?php echo nggcf_get_gallery_field($gallery->gid, “Link”); ?>”><img class=”Thumb” alt=”<?php echo $gallery->title ?>” src=”<?php echo $gallery->previewurl ?>”/></a>
</div>
<div class=”ngg-description”>
<p><?php echo $gallery->galdesc ?></p>
<?php if ($gallery->counter > 0) : ?>
<p><strong><?php echo $gallery->counter ?></strong> <?php _e(‘Photos’, ‘nggallery’) ?></p>
<?php endif; ?></div>
</div>
</div> - If you called the new field that you create in NextGen Custom Fields something other than link change “Link” in the above code to the name of your field. There are two locations that it needs to be changed.
- In order to update NextGen Gallery in the future and not lose these customizations, please follow the instructions in my article, How to Upgrade NextGen Gallery for WordPress Without Losing Customizations.
If you would like to hire me to assist with your NextGen Gallery customizations, please contact me for a quote.
photo credit: chanceprojects
Keep Reading:
Did you enjoy this article? I can assist you with your WordPress or Facebook project. Contact me and I will provide you with an estimate. You can also connect with me on Facebook or follow me on Twitter. If you are looking for Hosting, WordPress Theme, Newsletter or other recommendations, please view my detailed list.
October 24, 2012 at 12:09 pm
Wow.. Amazing information! I would like to share this post to facebook and twitter also.
December 18, 2012 at 1:03 am
Amazing!!!!!! Clear narration. Great point. Interesting .Some excellent advice . I like your tips. Thank you .Nice post
December 20, 2012 at 12:14 am
Hi Kim!
I am hitting a wall!! I am using the next gen gallery plugin and I am trying to make the captions on the lightbox image link to a specific post (every image has a different post). I was told that this was do-able however I cannot get it to work.
Here is my site: http://www.americasfinestmailbox.com/gallery/
It seems when I try to link the caption the lightbox times out or doesnt open. When I use this custom fields plugin it disables the lightbox functionality. Is there any way to add a link and still have lightbox functionality?
Thank you so much for your help!
-Will
March 7, 2013 at 12:49 am
Hi Kim
Its just interesting to hear how to link images from the NextGen. Thank you for your post..