NextGEN Gallery: Adding drop-down menu widget to gallery view without modifying plugin code

Question

In NextGEN Gallery, I am able to add a dropdown menu that lets users filter a gallery to only show images that are tagged with a specific ngg_tag, simply by adding this to view/gallery.php in the NextGEN Gallery code:

the_widget('Taxonomy_Drill_Down_Widget', array(
    'title' => '',
    'mode' => 'dropdowns',
    'taxonomies' => array( 'ngg_tag')
));

However I want to be able to achieve this without modifying any of the the actual NextGEN gallery code.

Adding this in my functions.php:

            add_action('ngg_render_template' , 'add_dropdown_widget' );

            function add_dropdown_widget(){
            the_widget('Taxonomy_Drill_Down_Widget', array(
                    'title' => '',
                    'mode' => 'dropdowns',
                    'taxonomies' => array( 'ngg_tag')
            ));
            }

Almost gets me there but it renders the dropdown above the gallery itself. I actually want the dropdown to appear below the title of the gallery, but at that point the gallery has already started rendering.

Answer 1

There aren't really any good filters/hooks that are going to allow you to place the custom drop down control where you'd like. What you should do instead is create a new template from an existing one, then add your widget code in. I'm going to edit "gallery.php", but you must edit album.php or whichever gallery types you're going to be using.

Note: I've created this post with NextGEN Gallery v 1.1.x in mind.

1. Find the template you want to copy from your NextGEN folder- for the purposes of this answer we will assume you are using plugins/nextgen-gallery/view/gallery.php.

2. Edit gallery.php so that your widget call is where you'd like your dropdown to appear. For our purposes we are putting it right below the "ngg-galleryoverview" div:

   <div class="ngg-galleryoverview" id="ngg-gallery-<?php echo $gallery->ID ?>">
   
   <!-- Add our widget to the top of the gallery -->
   <?php
   the_widget('Taxonomy_Drill_Down_Widget', array(
   'title' => '',
   'mode' => 'dropdowns',
   'taxonomies' => array( 'ngg_tag')
   ));
   ?>
   

3. Rename your "gallery.php" to something like "gallery-yourtemplate.php".

4. Upload "gallery-yourtemplate.php" to your server in the directory ( you may have to create the folder ) wp-content/themes/your-current-theme/nggallery.

5. Add the template=yourtemplate parameter to whatever shortcode you are using. An example would be:

   [nggallery id=1 template=yourtemplate]
   

Note the correlation between the filename gallery-yourtemplate.php and template=yourtemplate.

P.S. If you are using a child theme you will want to place the nggallery folder & files inside the parent theme, not your child theme.