NextGEN gallery & videos checklist

Setting up NextGEN on a new site

- Install plugin: NextGEN Gallery by Photocrati. Activate it.

- If video gallery is desired, also install plugin (exact name): NextGEN Custom Fields. Activate it.

- (folder should be in the theme already) Copy the folder nggallery from the primary theme of a site that already has NextGEN set up (should be in git eventually). The more recent, the better. Place it in sitefolder/web/wp-content/themes/themename/ and make sure it is called "nggallery".

- As of this writing, the GLM gallery templates in existence in that folder are: album-glmalbums, gallery-glmphotos-8, gallery-glmphotos-narrow, gallery-glmphotos, and gallery-glmvideos.

- Head into the Admin side. Gaslightify causes the plugin to be called "Gallery" on the menu, but it will still be NextGEN if you don't have that plugin installed (you should ASAP).

- Go into Gallery > Settings > NextGEN Basic Thumbnails

Override thumbnail settings No
images per page 20
number of columns to display 0
Enable AJAX pagination Yes
Add Hidden Images No
Use imagebrowser effec No
Show slideshow link No
Template gallery-glmphotos.php

- Go into Gallery > Settings > NextGEN Basic Compact Album

Display galleries as NextGEN Basic Thumbnails
Items per page 0
Enable breadcrumbs Yes
Template Parent Theme: album-glmalbums.php

- Go into Gallery > Other Options > Thumbnail Options : dimensions to 220x190. "Set fix dimension": No

- Gallery > Other Options > Lightbox Effects : effect to Fancybox, only apply to Nextgen images (change if otherwise desired of course).

- Gallery > Other Options > Roles & Capabilities : these can all be set to Editor except "Change style" and "Change options"

- Gallery > Gallery Settings > NextGEN Basic Thumbnails (usually the only one we use, change the others as needed)
-- show slideshow link: no
-- template: pick one of the glmphotos-#. Default glmphotos if in doubt. The number at the end will reflect how many images are on a single row.

To add images:

Gallery > Add Gallery / Images

- Enter desired gallery name in the box next to "Create a new gallery"

- Click add files, add some images, press start upload. Wait for them to completely finish (box will refresh).

To edit image order and thumbnails:

Gallery > Manage Galleries > Select gallery.

Images can be dragged and dropped.

To create an album:

Gallery > Manage Albums > Add New Album (or select one)

Drag and drop desired galleries into the album. An album is a gallery of galleries.

To add a gallery to a page:

Go into the page editor.

Click the green Nextgen button in the ribbon. If this was set up correctly as outlined above the only changes to make here are in "What would you like to display?" where you select one or more galleries or albums, and in "Customize the display settings" where you'd select the desired template (glmvideos for videos!).

Press save.

To make video galleries:

Make sure you've created a gallery as above and have set the template to gallery-glmvideos.

In the admin side, go to NGG Custom Fields: Image Custom Fields

Add a field with the name "video_url". Select which galleries are to be video galleries.

Manage Galleries > [galleryname] > scroll down to where the video_url box is and add the following type of link in case of a youtube link: https://www.youtube.com/embed/d7ELpMaJGnw

The following script placed after the_content() in the markup allows this to work, and is currently part of the glm-videos template. You should not need to add this anymore!

            <script>
                jQuery(document).ready(function(){
                    jQuery(".ngg-fancybox").each(function (){
                        jQuery(this).addClass("various iframe");
                        jQuery(this).attr("href",jQuery(this).children("img").attr("title"));
                    });
                });
            </script>

Cache-Busting NextGEN

To refresh the gallery cache on a page without having to go into Admin side and re-add the gallery, navigate to the page's URL, and append the following:

?ngg_flush=true

Resulting in something like

http://localhost/wordpress/gaslightmedia/our-work-2/travel-tourism/?ngg_flush=true

The next time you open that page, the nextgen cache will be cleared, and any changes to the template files will be loaded.