fbpx
Want To Add Extra Images Per Product Variation For Free? Download Now

Swatches not showing on shop page

Natasha Matthee

Hi Guys

My swatches are not showing on my shop page. I have deactivated plugins and still the issue persits.  I am using a child theme.  Parent theme link is here

Happy to give you access to my staging site so someone can have a look please.  I logged a ticket few days back and the gentleman asked for the theme file which I sent but I havent heard anything back again.

Hakik Zaman

Hello Natasha Matthee,

I have sent you (from [email protected]) a access request. Please accept it, so that I can download the file.

Looking forward to hearing from you soon.

Thanks

Hakik Zaman

Hello Natasha,

Thanks for sharing your theme.

Please check this screencast and follow all the steps carefully to get swatch on archive/shop page.

Note: I have copied the woocommerce folder from parent theme and paste it inside the child theme folder.

I have added the below code inside the screencast–

<?php do_action('wvs_pro_variation_show_archive_variation'); ?>

The settings will be like this. Please let me know, if it resolves your issue or not.

Looking forward to hearing from you soon.

Thanks

Natasha Matthee

Hi Guys

 

Thank you but the loom videos linked to both ‘screencast’ is not working so can’t view it….

Tells me this…..””””An error occurred on the page: ReferenceError: Can’t find variable: ResizeObserver

Hakik Zaman

Hello Natasha,

Sorry for the inconvenience. The screencast (you can try it again) is working from my side, please check this screenshot.

I have uploaded the video guideline to WeTransfer. Please download it from here.

Please let me know, if you face any difficulties to download.

Thanks

Natasha Matthee

Hi Guys

 

Thank you very much, this did the trick.  Last question, what will happen when I update woocommerce plugin, is this something I will need to change every time with the update?

Hakik Zaman

Hi Natasha,

Great to know, screencast was helpful for you and resolved the issue.

Last question, what will happen when I update woocommerce plugin, is this something I will need to change every time with the update?

No you have no need to change anything.

We really get excited & honored when you use our plugin in your site.

If you found my support helpful, could you leave your valuable review here: https://wordpress.org/support/plugin/woo-variation-swatches/reviews/?filter=5

Your rating keeps us inspired.

Thank You

Natasha Matthee

Hi Team

Another question.

Please see my video here.  My swatches are loaded nicely to the front shop page but the following is happening.  You will see in the video when I switch in between the bag swatches the colours change along with the image.  This is great, but view the second ‘racer’ item and you will see I need to choose a size first before the swatches change colour.  Any way we can fix this so that the swatches change without having to choose a size first?  It is confusing to the customer and almost looks like it’s broken and can’t interchange between swatches.  I played with the settings to see if I can change it but nothing happens.

Many Thanks

Hakik Zaman

Hello Natasha,

Sorry for the inconvenience. I have sent you a request from [email protected].

Hope to hear from you soon.

Thanks

Hakik Zaman

Hello Natasha,

Thanks for sharing the video with me. Could you please give some time on this?

If you are still confused, you can give me temporary admin access to your site.

Looking forward to hearing from you soon.

Thanks

Natasha Matthee

Hi Guys

So when I installed the above php changes on my staging site it worked perfectly fine.  Now I am at a stage where I want to go live on my main site.  I did exactly the above again but this time around it is not working and the swatches are not showing up on my shop page.  Can someone please assist me with this? Happy to give you temporary access to the site

Hakik Zaman

Hi Natasha,

Can you please give us temporary admin access to your site? We’ll try to investigate the issue for you.

You can add new users by going to Users > Add New set the user and password for us, set the role to admin, and set the info here.

And add your site URL, login username, and password in the site login area. Follow this guideline: https://www.useloom.com/share/27c1f2ac633c4060b2da883d946107d7

Hope to hear from you soon!

Natasha Matthee

Thanks Guys!  Find the login details here

Once done please deactivate the plugin again, I am still loading patterns

Hakik Zaman

Hello Natasha,

I have sent a request from [email protected]. Please accept my request to get login details.

Hope to hear from you soon!

Thanks

Hakik Zaman

Hello Natasha,

Your file name was wrong. Check this screenshot. Please check now by activating our plugins.

I have deactivated our plugin as you asked. 🙂

I have added also the below code to your child theme’s functions.php.

function wvs_micra_theme_support() {
   remove_action( 'woocommerce_after_shop_loop_item', 'wvs_pro_archive_variation_template', 30 );
}
add_action('init', 'wvs_micra_theme_support');

The above snippet is for removing duplicate swatches on the shop page. Actually, swatches were there but hidden for your theme design.

If you found my support helpful, my humble request to you to write a beautiful thought here: https://wordpress.org/support/plugin/woo-variation-swatches/reviews/?filter=5

Your rating keeps us inspired.

Thank You

Natasha Matthee

Hi

 

Thank you this worked but now I have the same issue as before when I click through to the product I have to click on a size first before I can click on different color blocks and my tooltips look like it is cut in half on the product page

Hakik Zaman

Hello Natasha,

Glad to know, your issue is resolved. Could you please give some time on this documentation?

I hope documentation will resolve your issue.

Thanks

Natasha Matthee

Please have a look here what I mean with tooltips being cut off and having to choose a size before I can choose a color. The previous admin access I gave is still valid if you want to log in and look

Natasha Matthee

Thank Hakik but the documentation is not working.  I have the settings on the shop page perfect, it is showing what I want but on the product page I have an issue with the images not changing when changing different colors.  If you see my documentation above

Hakik Zaman

Hello Natasha,

Sorry for the inconvenience.

what I mean with tooltips being cut off and having to choose a size before I can choose a color.

I have fixed the tooltip cut-off issue. From my side, images are changing based on color. Here is a screencast for you.

Still, you can check this documentation to get images based on the only color swatches.

Please grant access, so that I can check your documentation. I have sent a request from [email protected]

Hope to hear from you soon.

Thanks

Natasha Matthee

Thank you for the speedy response today appreciate it.  I figured out the images changing based on color etc I didn’t read the documentation properly so my fault apologies.  Thank you for fixing the tooltip issue, may I ask how you fixed this?

Hakik Zaman

Hello Natasha,

Glad to know, you have figured out the solution.

I have added the below CSS to Appearance > Customize > Additional CSS and pressed Publish button.

.product-view .product-shop .variations_form.cart {
   overflow: visible;
}

Thanks