{"id":8483,"date":"2021-04-30T15:04:40","date_gmt":"2021-04-30T13:04:40","guid":{"rendered":"https:\/\/www.welaunch.io\/en\/?post_type=faq&#038;p=8483"},"modified":"2021-04-30T15:06:32","modified_gmt":"2021-04-30T13:06:32","slug":"single-product-variation-images-are-missing","status":"publish","type":"faq","link":"https:\/\/www.welaunch.io\/en\/knowledge-base\/faq\/single-product-variation-images-are-missing\/","title":{"rendered":"Single Product Variation images are missing"},"content":{"rendered":"<p>When using our single variations plugin for WooCommerce you may see missing images in your category or product listing pages. The main root cause of this issue is that themes often just try to list the main product image in categories. A variation however most of the times does not have an explicit main image assigned. Furthermore variations by default have no way to assign gallery images to them, which most themes use to display a nice hover effect. There are two ways to solve this.<\/p>\n<h2>Manually assign Variation Images<\/h2>\n<p>The first solution would be to assign a main variation image for every single variation manually. To do this:<\/p>\n<ol>\n<li>Edit a Variable product in Backend<\/li>\n<li>Go to Variations Section<\/li>\n<li>Open one Variation<\/li>\n<li>Click on the image icon to assign a variation image<\/li>\n<li>Save<\/li>\n<\/ol>\n\t<div class=\"img has-hover x md-x lg-x y md-y lg-y\" id=\"image_1358088948\">\n\t\t\t\t\t\t\t\t<div class=\"img-inner box-shadow-2 box-shadow-2-hover dark\" >\n\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1020\" height=\"441\" src=\"https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce-1024x443.png\" class=\"attachment-large size-large\" alt=\"assign variation image in WooCommerce\" srcset=\"https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce-1024x443.png 1024w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce-247x107.png 247w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce-510x221.png 510w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce-300x130.png 300w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce-768x332.png 768w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce-1536x665.png 1536w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/assign-variation-image-in-WooCommerce.png 1812w\" sizes=\"auto, (max-width: 1020px) 100vw, 1020px\" \/>\t\t\t\t\t\t\n\t\t\t\t\t\t\t<div class=\"caption\">assign variation image in WooCommerce<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\n<style>\n#image_1358088948 {\n  width: 100%;\n}\n<\/style>\n\t<\/div>\n\t\n\t<div id=\"gap-1620481848\" class=\"gap-element clearfix\" style=\"display:block; height:auto;\">\n\t\t\n<style>\n#gap-1620481848 {\n  padding-top: 30px;\n}\n<\/style>\n\t<\/div>\n\t\n<p>In some cases the solution is not acceptable or it would require too much work to assign an image to every variation. Also this does not solve that there are no gallery images \/ hover image swap effects displayed in your listing. That is where solution two comes in.<\/p>\n<h2>Use our Product Variation Gallery Images Plugin<\/h2>\n<p>Our WooCommerce variation gallery images plugin solves two issues:<\/p>\n<ol>\n<li>It creates a fallback for variation images to the main product image<\/li>\n<li>It allows assigning gallery images for variations<\/li>\n<\/ol>\n<p>Just enable both settings. Then in your category listings your variation products will show the main parent product image when empty. And in addition it will show gallery images of the variation itself or the main parent product image gallery.<\/p>\n\t<div class=\"img has-hover x md-x lg-x y md-y lg-y\" id=\"image_1650188536\">\n\t\t\t\t\t\t\t\t<div class=\"img-inner box-shadow-2 box-shadow-2-hover dark\" >\n\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1020\" height=\"324\" src=\"https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images-1024x325.png\" class=\"attachment-large size-large\" alt=\"Variation image fallback &amp; gallery images\" srcset=\"https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images-1024x325.png 1024w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images-247x78.png 247w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images-510x162.png 510w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images-300x95.png 300w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images-768x244.png 768w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images-1536x488.png 1536w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/Variation-image-fallback-gallery-images.png 1814w\" sizes=\"auto, (max-width: 1020px) 100vw, 1020px\" \/>\t\t\t\t\t\t\n\t\t\t\t\t\t\t<div class=\"caption\">Variation image fallback &amp; gallery images<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\n<style>\n#image_1650188536 {\n  width: 100%;\n}\n<\/style>\n\t<\/div>\n\t\n\t<div id=\"gap-548596248\" class=\"gap-element clearfix\" style=\"display:block; height:auto;\">\n\t\t\n<style>\n#gap-548596248 {\n  padding-top: 30px;\n}\n<\/style>\n\t<\/div>\n\t\n<p>Furthermore you are now also able to set gallery images for each single variation product as you can see in the image below.<\/p>\n\t<div class=\"img has-hover x md-x lg-x y md-y lg-y\" id=\"image_2067784665\">\n\t\t\t\t\t\t\t\t<div class=\"img-inner box-shadow-2 box-shadow-2-hover dark\" >\n\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1020\" height=\"639\" src=\"https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/set-custom-variation-gallery-images-in-WooCommerce-1024x642.png\" class=\"attachment-large size-large\" alt=\"set custom variation gallery images in WooCommerce\" srcset=\"https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/set-custom-variation-gallery-images-in-WooCommerce-1024x642.png 1024w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/set-custom-variation-gallery-images-in-WooCommerce-247x155.png 247w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/set-custom-variation-gallery-images-in-WooCommerce-510x320.png 510w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/set-custom-variation-gallery-images-in-WooCommerce-300x188.png 300w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/set-custom-variation-gallery-images-in-WooCommerce-768x482.png 768w, https:\/\/www.welaunch.io\/en\/wp-content\/uploads\/sites\/8\/2021\/04\/set-custom-variation-gallery-images-in-WooCommerce.png 1154w\" sizes=\"auto, (max-width: 1020px) 100vw, 1020px\" \/>\t\t\t\t\t\t\n\t\t\t\t\t\t\t<div class=\"caption\">set custom variation gallery images in WooCommerce<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\n<style>\n#image_2067784665 {\n  width: 100%;\n}\n<\/style>\n\t<\/div>\n\t\n\t<div id=\"gap-211182729\" class=\"gap-element clearfix\" style=\"display:block; height:auto;\">\n\t\t\n<style>\n#gap-211182729 {\n  padding-top: 60px;\n}\n<\/style>\n\t<\/div>\n\t\n<a href=\"https:\/\/www.welaunch.io\/en\/product\/woocommerce-gallery-images\/\" class=\"button primary\" rel=\"Get our WooCommerce Gallery Images plugin\" >\n\t\t<span>Get our WooCommerce Gallery Images plugin<\/span>\n\t<\/a>\n\n","protected":false},"author":1,"featured_media":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","product_cat":[],"class_list":["post-8483","faq","type-faq","status-publish","hentry","faq_topics-gallery-images","faq_topics-show-single-variations","faq_topics-single-variations-faq"],"_links":{"self":[{"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/faq\/8483","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/faq"}],"about":[{"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/types\/faq"}],"author":[{"embeddable":true,"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/comments?post=8483"}],"version-history":[{"count":8,"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/faq\/8483\/revisions"}],"predecessor-version":[{"id":8494,"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/faq\/8483\/revisions\/8494"}],"wp:attachment":[{"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/media?parent=8483"}],"wp:term":[{"taxonomy":"product_cat","embeddable":true,"href":"https:\/\/www.welaunch.io\/en\/wp-json\/wp\/v2\/product_cat?post=8483"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}