Home Forums WoodMart support forum Variation Gallery Images for only some variations

Variation Gallery Images for only some variations

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #142287

    digitalwiz
    Participant

    This is based on

    Post
    #119400

    I can not figure out how to respond to that post.
    Elise Noromit said

    Hello,

    You need to add at least one image to variation gallery of each variation not to see the images from other variations.

    If one variation has the gallery and others do not, images from the first one are uploaded in all the rest.

    Just duplicate main variation image into the gallery as here http://prntscr.com/nd62cq

    Best Regards

    I have some variations with additional gallery images and some without. I found if I don’t put in gallery images in some variations, the variations without gallery images get gallery images that have nothing to do with the variation. Elise suggested duplicating the main image as the gallery image. I found a cleaner approach that allows me to have gallery images in some variations and none in others without getting the random images showing up in the variations without gallery images.

    I used a 1px transparent gif. Transparent gifs were used with tables before CSS to do layout. That method is no longer recommended.
    You can download one here.

    You can also use a small transparent PNG. Add the transparent gif to your media gallery. Give it Alternate Text = ‘transparent-gif’. Use the transparent image as the gallery image on variations that have no gallery images.

    I am using $(“.single_variation_wrap”).on(“show_variation”,function(){}). This triggers whenever the variation changes. If we have an image with alt = ‘transparent-gif’, I remove the image from both Owl Carousel (used for the image gallery) and Photo Swipe (used for the lightbox gallery). See woodmart functions.js. I had to use the setTimeout to get this to work. It works even with timeout 0. It does not work without the timeout, not sure why.

    In your javascript file place the following:

    jQuery(document).ready(function($) {
    
        // Fires whenever variation selects are changed
        $(".single_variation_wrap").on("show_variation", function(event, variation) {
            // Wait till gallery is created   
            setTimeout(function() {
                // hide transparent gif in gallery
    
                $('.product-image-thumbnail.slick-slide:has(img[alt="transparent-gif"])').remove();
                $('.woocommerce-product-gallery__wrapper div.owl-item:has(img[alt="transparent-gif"])').remove();
            }, 0);
        });
    });

    Please tell me if you find this useful.

    Attachments:
    You must be logged in to view attached files.
    #142318

    digitalwiz
    Participant

    Found this interesting discussion about SetTimeout 0

    #142357

    Hello,

    Please describe YOUR problem in details I will provide the solution. Include please page URL with the problem and site admin access to the private area.

    Best Regards

    #142420

    digitalwiz
    Participant

    It’s not a problem. It’s a followup to #119400.

    It’s a way to have additional product images for variations for some variations and on other variations have no additional product images and not have to duplicate an image and not have random images from other variations appear in the variation.

    #142583

    Eric Watson
    Participant

    Hello,

    We apologize for the delay in answering, but unfortunately, our option Additional Variation Gallery Images works this way and there is no way to change its behavior. We will consider adding this behavior in the future.

    Kind Regards
    XTemos Studio

    #143258

    digitalwiz
    Participant

    Please read my post. I am explaining how to change the behavior.

    #143315

    Artem Temos
    Keymaster

    Thank you. We will consider your suggestion in the future. At the moment, we can’t change the way it works.

    #143333

    digitalwiz
    Participant

    This is something users can use now without changing the theme at all. I am using it.

Viewing 8 posts - 1 through 8 (of 8 total)