So here is the problem. You have Woocommerce running on your WordPress website. Woocommerce conveniently comes bundled with Fancybox so that the product image thumbnails pop up in a sweet little window. Great!

However…

You also want to use Fancybox on the rest of your site. So you download a sweet Fancybox plugin that automagically makes all your image links open in a Fancy box. NICE!

Not nice…

Now on your Woocommerce single product pages, when you click a product gallery thumbnail, it opens 2 Fancyboxes! NOOOOOOOO. This is obviously bad. But here is a quick solution.

Hook into the Woocommerce image thumbnail class and add the “nofancybox” class.

All you have to do is drop this code into your theme’s functions.php or some other file that executes a lot.


    // add nofancybox class to product thumbs
    add_filter( 'woocommerce_single_product_image_thumbnail_html', 'changeme_remove_fancybox', 15, 4 );
    function changeme_remove_fancybox( $html, $attachment_id, $post_ID, $image_class )
        {
            $newclasses = str_replace( 'class="', 'class="nofancybox ', $html );
            return $newclasses;
        }