Best WordPress Theme & Plugin For Photographers

Imagely Blog

Digital Photography Tips, Tutorials and Resources

Monochrome Thumbnails On Hover

Written By: author avatar Chris Christoff
author avatar Chris Christoff
    

The CSS in this article is pre-NextGEN Gallery 2.0.  If you are using the latest version of NextGEN Gallery then the CSS might be slightly different than what’s in this example.  Also, custom CSS will not work for NextGEN Pro iframe based galleries.

Have you been wanting to spruce up your gallery thumbnails a bit? Below is a snippet of CSS that you can customize.  The purpose of this small CSS snippet is to convert your NextGEN Gallery thumbnails to monochrome when your mouse hovers over them. (as you see in the gallery below)

Here is the snippet of CSS that will handle this task. It is important to note that this CSS script will work flawlessly in Google Chrome and will not work in all browsers.

In the demo, the hover converts 100% to monochrome, but you can desaturate the thumbnails as per your liking.

Thanks and enjoy,

Scott

As a reminder, to see the gallery, you must be viewing this in the browser and not through email or in RSS software. The post must be viewed from its own URL and not from the main blog page. Also If you are not familiar with CSS and/or do not feel comfortable making changes like this to your website, please do not attempt it.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how NextGEN Gallery is funded, why it matters, and how you can support us.

author avatar
Chris Christoff

Experience the Imagely Difference

Best WordPress Theme & Plugin For Photographers

Enter the URL of your WordPress website to install

Upgrade to Imagely Pro

Imagely is perfect for photographers, designers, bloggers, and creative professionals who want more than just a gallery.

Built in eCommerce and print fulfillment

90+ themes and designs

Tons of customizations and options

14 day money back guarantee

Popular on Imagely Right Now!

How to Start a Photography Business: Step-by-Step Guide

How to Start a Photography Business: Step-by-Step Guide

Share this with other photographers Share on Facebook Share on X (Twitter) Share on LinkedIn…
25 of the Best WordPress Plugins for Photographers

25 of the Best WordPress Plugins for Photographers (2025 Guide)

Share this with other photographers Share on Facebook Share on X (Twitter) Share on LinkedIn…

Comments

Add A Comment