{"id":4631,"date":"2022-02-13T06:51:41","date_gmt":"2022-02-13T06:51:41","guid":{"rendered":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/?p=4631"},"modified":"2024-11-07T01:46:40","modified_gmt":"2024-11-07T01:46:40","slug":"product-attribute-guide","status":"publish","type":"post","link":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/2022\/02\/13\/product-attribute-guide\/","title":{"rendered":"Product Attribute Guide"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><strong>Product Attribute Guide<\/strong> is one of useful features that UDesign offers.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can show product attribute information like size and color by using product attribute guide.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can use this in single product page. Then let&#8217;s see together how to use size attribute guide.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">First of all, you have to add size attribute.  <\/p>\n\n\n\n<figure class=\"wp-block-image size-full mt-0\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"401\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-5-1-1024x401-1.jpg\" alt=\"\" class=\"wp-image-5448\" srcset=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-5-1-1024x401-1.jpg 1024w, https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-5-1-1024x401-1-768x301.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Ahead of choosing guide block, you have to make size guide block. Please go to <code class=\"code-grey\">UDesign &gt; Templates<\/code> and create new block with block builder. And make size guide block like this.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full mt-0\"><img decoding=\"async\" width=\"1024\" height=\"395\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1024x395-1.jpg\" alt=\"\" class=\"wp-image-5449\" srcset=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1024x395-1.jpg 1024w, https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1024x395-1-768x296.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">After you finish your size guide block, then please choose guide block and type guide link text.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full mt-0\"><img decoding=\"async\" width=\"1024\" height=\"409\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-4-1-1024x409-1.jpg\" alt=\"\" class=\"wp-image-5450\" srcset=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-4-1-1024x409-1.jpg 1024w, https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-4-1-1024x409-1-768x307.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">You can build size guide block as below.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Next, you have to add attribute values. You can set L, M, S as size attribute values.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full mt-0\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"454\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-6-1024x454-1.jpg\" alt=\"\" class=\"wp-image-5451\" srcset=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-6-1024x454-1.jpg 1024w, https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-6-1024x454-1-768x341.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">When you add variable product, please add size attribute you already have made.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full mt-0\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"342\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1-2-1024x342-1.jpg\" alt=\"\" class=\"wp-image-5453\" srcset=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1-2-1024x342-1.jpg 1024w, https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1-2-1024x342-1-768x257.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"> <\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">As a result, you can see size guide tab is added in Custom Tabs.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full mt-0\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"357\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1-1-1024x357-1.jpg\" alt=\"\" class=\"wp-image-5454\" srcset=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1-1-1024x357-1.jpg 1024w, https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/size-1-1-1024x357-1-768x268.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"alert alert-warning d-block wp-block-paragraph\">Note: <strong>Attribute Guide as Lightbox<\/strong><br>You can show guide content as a lightbox not in product data tabs.<br>Go to <code>Theme Options &gt; Features &gt; Attribute Guide<\/code> and set <code>Guide Layout<\/code> as <code>Lightbox<\/code>.<\/p>\n\n\n\n<p class=\"mt-5 wp-block-paragraph\"><strong>In Single Product Builder<\/strong>, this widget displays attribute guide link.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full mt-0\"><img loading=\"lazy\" decoding=\"async\" width=\"308\" height=\"774\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/attribute-guide-widget.jpg\" alt=\"attribute guide\" class=\"wp-image-10987\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Product Attribute Guide is one of useful features that UDesign offers. You can show product attribute information like size and color by using product attribute guide. You can use this in single product page. Then let&#8217;s see together how to use size attribute guide. First of all, you have to add size attribute. Ahead of [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[17],"tags":[],"class_list":["post-4631","post","type-post","status-publish","format-standard","hentry","category-add-ons"],"_links":{"self":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/4631","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/comments?post=4631"}],"version-history":[{"count":2,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/4631\/revisions"}],"predecessor-version":[{"id":10996,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/4631\/revisions\/10996"}],"wp:attachment":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/media?parent=4631"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/categories?post=4631"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/tags?post=4631"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}