Addition Variation Image Gallery For WooCommerce

AUTOMATIC INSTALL FROM WORDPRESS DASHBOARD

1. Login to your the admin panel
2. Navigate to Plugins -> Add New
3. Search for WooCommerce Variation Image Gallery in the search field.
4. Install and Activate WooCommerce Variation Image Gallery  Plugin by Emran Ahmed
5. Click install and activate

MANUAL INSTALL FROM WORDPRESS DASHBOARD

If your server is not connected to the Internet, then you can use this method-

1. Download the plugin by clicking on the red button above. A ZIP file will be downloaded.
2. Login to your site’s admin panel and navigate to Plugins -> Add New -> Upload.
3. Click choose file, select the plugin file and click install

INSTALL USING FTP

1. Download the plugin by clicking on the big download button.
2. A ZIP file will be downloaded.
3. Unzip the file.
4. Launch your favorite FTP client. Such as FileZilla, FireFTP, CyberDuck etc. If you are a more advanced user, then you can use SSH too.
5. Upload the folder to wp-content/plugins/
6. Log in to your WordPress dashboard.
7. Navigate to Plugins -> Installed
8. Activate the plugin

Desktop Width Adjustment

Tablet Width Adjustment

Mobile Width Adjustment

Video Tutorial

The advanced feature of WooCommerce Variation Image Gallery has been packed in an extension. To enable advanced version of this plugin on your site, you need to enable premium extension besides the Free Version.

=> 01.  Login to GetWooPlugins.com website.

=> 02. Head to the My Downloads from My Account.

=>03. Press Download button to download WooCommerce Variation Image Gallery Pro plugin.

=> 04. Navigate to Plugins >> Add New and Press Upload Plugin to Install and Activate download woocommerce-variation-gallery-pro plugin.

=>05, After Installing Premium version of WooCommerce Variation Gallery plugin. It would appear after free version

=>06.  To receive automatic update from premium version of WooCommerce Variation Gallery plugin. Click on GetWooPlugins Updater from top notice bar to activate updater plugin

=>07. After successfully GetWooPlugins Updater activation, it would appear in the activated plugin list.

=> 01. Navigate to My Account >> My Downloads from GetWooPlugins.com.

=> 02. Register your domain where automatic update for WooCommerce Additional Variation Image Pro plugin needs to be activated. Enter your domain name in the domain area and press the Add Domain button.

=> 03. Each purchase of an item comes with a license key. Copy the License Key from the Downloads section.

=> 04. After copying the License Key, head to the site backend.

=> 05. Navigate to Gallery Settings >> License Key. Paste the copied License Keycode in the License Key field. Press the Save Changes button once done.

=> 06. The following update notice will appear in the Plugins section when any update is available.

Please Note: If you don't get an update notice after adding purchase, press the Check Update button

Sometimes, you may not receive the latest update notice in the Additional WooCommerce Variation Image Gallery plugin. In this case, you have to update the plugin manually.  Navigate to Plugins >> Add New and upload the latest version of WooCommerce Variation Gallery plugin.

To upload variation images, head into your desired variable product and get into Variations tab from Product data sidebar settings. Open your desired variation where you insert extra / additional variation images. Select Add Gallery Images button to upload images from computer or WordPress Media Library.

Settings Preview

Frontend Preview

Live Preview

Settings Preview

Video Tutorial

If you want to show a video instead of a featured image, you can either embed videos to the gallery via YouTube / Vimeo links or upload any video.

=> 01. Navigate to WooCommerce ->> All Products
=> 02. Click Edit for your desired Simple product.
=> 03. Scroll down to the Product Image section from the right side and click on the Set product image link.

=> 04. You’ll need to upload a featured image or select an image from the media library of the video you want to show as a featured image.

=> 05. Try to add YouTube / Vimeo / Self-hosted video URL to the Variation Gallery Video section.

Check the following screenshot. it shows how the backend featured image area will look like after adding featured video

Now save the changes and head to the frontend. Your product page featured video would look like the following screenshot.

How To add Self-Hosted Video in Simple Product Featured Image

How To add YouTube Video in Simple Product Featured Image

How To add Vimeo Video in Simple Product Featured Image

If you want to show a video instead of the featured image, you can either embed videos to the gallery via YouTube / Vimeo links or upload any video.

=> 01. Navigate to WooCommerce ->> All Products
=> 02. Click Edit for your desired Variable product.
=> 03. Scroll down to the Product Image section from the right side and click on the Set product image link.

=> 04. You’ll need to upload a featured image or select an image from the media library of the video, you want to show as a featured image.

=> 05. Try to add YouTube / Vimeo / Self-hosted video URL to the Variation Gallery Video section.

How the following image shows how the Simple product feature image area looks after adding the video.

Now save the changes and head to the frontend. Your product page featured video would look like the following screenshot.

How To add Self-Hosted Video in Variable Product Featured Image

How To add YouTube Video in Variable Product Featured Image

How To add Vimeo Video in Variable Product Featured Image

If you want to show a video instead of a featured image, you can either embed videos to the gallery via YouTube / Vimeo links or upload any video.

=> 01. Navigate to WooCommerce ->> All Products
=> 02. Click Edit for your desired Grouped product.
=> 03. Scroll down to the Product Image section from the right side and click on the Set product image link.

=> 04. You’ll need to upload a featured image or select an image from the media library of the video you want to show as a featured image.

=> 05. Try to add YouTube / Vimeo / Self-hosted video URL to the Variation Gallery Video section.

Check the following screenshot. it shows how the backend featured image area will look like after adding featured video

Now save the changes and head to the frontend. Your product page featured video would look like the following screenshot.

How To add Self-Hosted Video in Grouped Product Featured Image

How To add YouTube Video in Grouped Product Featured Image

How To add Vimeo Video in Grouped Product Featured Image

If you want to show a video instead of a featured image, you can either embed videos to the gallery via YouTube / Vimeo links or upload any video.

=> 01. Navigate to WooCommerce ->> All Products
=> 02. Click Edit for your desired Grouped product.
=> 03. Scroll down to the Product Image section from the right side and click on the Set product image link.

=> 04. You’ll need to upload a featured image or select an image from the media library of the video you want to show as a featured image.

=> 05. Try to add YouTube / Vimeo / Self-hosted video URL to the Variation Gallery Video section.

Check the following screenshot. it shows how the backend featured image area will look like after adding featured video

Now save the changes and head to the frontend. Your product page featured video would look like the following screenshot.

How To add Self-Hosted Video in External/Affiliate Product Featured Image

How To add YouTube Video in External/Affiliate Product Featured Image

How To add Vimeo Video in External/Affiliate Product Featured Image

How to Enable Fade for Product Featured Image

How to Set Image Fade Speed

How To Adjust the Thumbnail Item

How To Adjust the Thumbnail Item Gap

How to Enable/Disable Preloader for the Gallery

How to Select Preloader Style

With the help of this Additional Variation Image Gallery plugin, you can insert YouTube, Vimeo, and self-host in the Simple Product.

Upload YouTube Video In The Product Simple Gallery

=> 01. Navigate to Products->> All Products and select your desired Simple product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your YouTube video URL to the Variation Gallery Video section. You have the option to change the height and width of the video. The YouTube Video Link format should be like this: https://www.youtube.com/watch?v=wopbjNkJNEc

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Upload Vimeo Video In The Product Simple Gallery

=> 01. Navigate to Products->> All Products and select your desired Simple product to add videos with ease.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you need to select your desired thumbnail image where you want to add Viemo Video as a featured video.

=> 04. Add your Vimeo video URL to the Variation Gallery Video section.
=> 05. You have the option to change the height and width of the video.

=> 06. Add your Vimeo video URL to the Variation Gallery Video section.
=> 07. After that, click on the Add to gallery button.

=> 08. Scroll to the top of the page and click the Update button.

With the help of this Additional Variation Image Gallery plugin, you can insert YouTube, Vimeo, and self-host in the Simple Product.

Upload YouTube Video In The Variable Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Variable product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your YouTube video URL to the Variation Gallery Video section. You have the option to change the height and width of the video. The YouTube Video Link format should be like this: https://www.youtube.com/watch?v=wopbjNkJNEc

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Upload Vimeo Video In The Variable Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Variable product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your Vimeo video URL to the Variation Gallery Video section. You have the option to change the height and width of the video. The Vimeo Video Link format should be like this: https://vimeo.com/291909148

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Upload Self-hosted Video In The Variable Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Variable product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your self-hosted video to the Variation Gallery Video section. You have the option to change the height and width of the video. To upload the video, press the Play button icon.

And then select your desired video from the panel. Press Add Video button

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

With the help of this Additional Variation Image Gallery plugin, you can insert YouTube, Vimeo, and Self-host in the Simple Product.

Upload YouTube Video In The Grouped Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Grouped product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your YouTube video URL to the Variation Gallery Video section. You have the option to change the height and width of the video. The YouTube Video Link format should be like this: https://www.youtube.com/watch?v=wopbjNkJNEc

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Upload Vimeo Video In The Variable Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Variable product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your Vimeo video URL to the Variation Gallery Video section. You have the option to change the height and width of the video. The Vimeo Video Link format should be like this: https://vimeo.com/291909148

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Upload Self-hosted Video In The Variable Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Variable product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your self-hosted video to the Variation Gallery Video section. You have the option to change the height and width of the video. To upload the video, press the Play button icon.

And then select your desired video from the panel. Press Add Video button

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

With the help of this Additional Variation Image Gallery plugin, you can insert YouTube, Vimeo, and self-host in the Simple Product.

Upload YouTube Video In The External/Affiliate Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired External/Affiliate product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your YouTube video URL to the Variation Gallery Video section. You have the option to change the height and width of the video. The YouTube Video Link format should be like this: https://www.youtube.com/watch?v=wopbjNkJNEc

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Upload Vimeo Video In The Variable Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Variable product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your Vimeo video URL to the Variation Gallery Video section. You have the option to change the height and width of the video. The Vimeo Video Link format should be like this: https://vimeo.com/291909148

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Upload Self-hosted Video In The Variable Product Image Gallery

=> 01. Navigate to Products->> All Products and select your desired Variable product to add a video.
=> 02. Scroll down to the Product Gallery section and click on the Add product gallery images link.

=> 03. Now, you’ll need to select a thumbnail image of the video where you want to show as a featured image.

=> 04. Add your self-hosted video to the Variation Gallery Video section. You have the option to change the height and width of the video. To upload the video, press the Play button icon.

And then select your desired video from the panel. Press Add Video button

Please note: after adding the video link the gallery area looks like the following screenshot.

And the frontend looks like the following screenshot.

Once you have added your additional images, you can drag and drop to reorder them.

Just click on the cross sign to remove any variation image.

To view additional gallery images without manually changing them -
=> 01. Head to Gallery Settings >> Configuration
=> 02. You can enable and control gallery slide autoplay speed and fade speed from here.

The plugin comes with a slider option to enable or disable image sliding slideshow indicating arrow. You will be able to enable or disable the gallery slider arrow, as well as the thumbnail arrow.

=> 01. Navigate to Gallery Settings >> Configuration.
=> 02, Enable / disable Gallery Slider Arrow / Thumbnail Arrow.

How To Hide Product Feature Image Slider Arrow

How To Hide Product Gallery Slider Arrow

How to Set Position For Product Gallery on Desktop & Tablet

How To Change Product Image Gallery Position on Mobile

To control the gallery thumbnail display position to the right, left, or top-

=> 01. Head to Gallery Settings >> Configuration

=> 02. Select your desired thumbnail display position from the dropdown.

To access the zoom option for product variation image -

=> 01. Navigate to Gallery Settings >> Configuration
=> 02. Click on the check mark to enable the gallery image zoom option.
=> 03. Select your desired display position from the dropdown list.

How To Select Zoom For Product Featured Image

How To Set Image Zoom Position

It’s straightforward to migrate from any other Additional Variation Image Gallery plugin to our plugin.

=> 01. Navigate to Gallery Settings >> Migration

=> 02. Click on the Start migration button on the right from which you want to migrate to our plugin.

When you are using this plugin with Flatsome theme, make sure the following settings is checked.