WooCommerce Product Image Flipper

Plugin Banner

WooCommerce Product Image Flipper

by James Koster

Download
Description

A very simple plugin that adds a secondary product thumbnail on product archives that is revealed when you hover over the main product image.

This plugin is ideal if you’d like to display more than one image on product archives, and perfect if you want to display front and back images of clothing for example.

Please feel free to contribute on github.

  1. Upload woocommerce-product-image-flipper to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress
  3. Done!
  1. A flipped image.

    A flipped image.

How do I control which image is displayed on hover?

Whichever image is first in the order of product gallery images will appear on hover.

My secondary image is taller than the main product image and overlaps content when it fades in

This is due to the secondary image being positioned absolutely. This is the cleanest way I can think to do this with CSS alone. You may want to consider hard cropping your product catalog thumbnails to ensure all images are the same dimensions in product archives.

It doesn’t work. Nothing happens when I hover over images?

First of all check that the product you’re checking has a gallery attached to it.

still working

By aeminium01 on October 15, 2022

This plugin is still working with WP 6.0.2. and Woocommerce 7.0. Please update this great plugin. It's imperative! Best regards

It Works However,

By furkan2665 on October 5, 2019

it works I hope you will continue improving this amazing plugin : ) However, the second image in the product gallery should be 800x800.

Worked as advertised 👍🏼

By sumeetchawla on August 9, 2019

Works perfectly out of the box. Kudos on such an amazing plugin. Saved so much of my time.

Sadly doesn't work anymore

By vm_design (valeriemanne) on April 26, 2019

Loved the feature, but as another recent commenter mentioned - it does not work anymore.

plugin doesn't work with latest version of WooCommerce

By stoicattempt (stoicflo) on April 17, 2019

WordPress 5.1.1 WooCommerce 3.6.0 Images are simply printed below each other. It used to work fine, until today.

Works

By Kousekmusic on February 8, 2019

Nice, works well.

Perfect!

By Arne (arneb) on September 27, 2018

I am using it with the genesis framework. Thank you James.

Does not work!

By monzu02 on March 15, 2018

this plugin Does not work!

Does not work

By htown on February 16, 2018

Says it works up to version 4.9.4 but it does not. There also seems to be no support. This is the second plugin that I have tried that flips the image on rollover and and I am 0 for 2. Very disappointing.

Plugin not working

By rkkhan on January 3, 2018

Its really disappointed there is nothing work in this plugin.I already read all the support forum but I didn't get any solution.

0.4.2 – 26.11.2018

  • Fix – Moved initilisation function to pif class. Fixes compatibility with other plugins.

0.4.1 – 12.12.2017

  • Fix – Flipper effect is now applied to shortcodes and product loops on single product pages.

0.4.0 – 21.07.2017

  • Enhancement – This plugin does not use CSS 3d anymore.
  • Tweak – Secondary images now include alt / title tags

0.3.0

  • Fix – WooCommerce 2.7 compatibility.
  • Tweak – Simpler image transition.

0.2.0

  • Fix – WooCommerce 2.2 compatibility

0.1

Initial release.

Back to top