{"id":5300,"date":"2019-09-10T03:58:02","date_gmt":"2019-09-10T03:58:02","guid":{"rendered":"https:\/\/musilda.cz\/?p=5300"},"modified":"2019-09-10T03:58:02","modified_gmt":"2019-09-10T03:58:02","slug":"jak-ve-woocommerce-zobrazovat-sku-varianty","status":"publish","type":"post","link":"https:\/\/affinite.io\/cs\/jak-ve-woocommerce-zobrazovat-sku-varianty\/","title":{"rendered":"Jak ve WooCommerce zobrazovat sku varianty"},"content":{"rendered":"\n<p>Varianta produktu se ve WooCommerce zobrazuje jako sou\u010d\u00e1st variantn\u00edho produktu. Uk\u00e1\u017eeme si, jak roz\u0161\u00ed\u0159it data, kter\u00e1 se m\u011bn\u00ed p\u0159i v\u00fdb\u011bru varianty. <\/p>\n\n\n\n<p>Varianta produktu m\u00e1 data, kter\u00e1 se mezi sebou li\u0161\u00ed. Viditeln\u00e9 to je u ceny a vlastnost\u00ed varianty, jen\u017e se p\u0159i v\u00fdb\u011bru v\u011bt\u0161inou m\u011bn\u00ed. <\/p>\n\n\n\n<p>Oblast, kter\u00fd se na detailu produktu dynamicky m\u011bn\u00ed, je um\u00edst\u011bn\u00e1 kolem tla\u010d\u00edtka p\u0159idat do ko\u0161\u00edku.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"593\" height=\"219\" src=\"https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2019\/09\/variation-sku.jpg\" alt=\"\" class=\"wp-image-5301\" srcset=\"https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2019\/09\/variation-sku.jpg 593w, https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2019\/09\/variation-sku-300x111.jpg 300w\" sizes=\"(max-width: 593px) 100vw, 593px\" \/><\/figure>\n\n\n\n<p>V p\u0159\u00edpad\u011b, \u017ee chceme do tohoto prostoru zobrazit dal\u0161\u00ed data, kter\u00e1 varianta obsahuje, mus\u00edme otev\u0159\u00edt soubor \u0161ablony \/woocommerce\/single-product\/add-to-cart\/variation.php. <\/p>\n\n\n\n<p>Pokud jej v aktivn\u00ed \u0161ablon\u011b nem\u00e1te, vemte soubor z pluginu a do \u0161ablony si jej p\u0159eulo\u017ete. O <a href=\"https:\/\/musilda.cz\/vlastni-woocommerce-sablony-jak-je-pouzivat\/\" target=\"_blank\" rel=\"noopener\">um\u00edst\u011bn\u00ed soubor\u016f \u0161ablony WooCommerce<\/a> jsem ji\u017e psal. <\/p>\n\n\n\n<p>Po otev\u0159en\u00ed souboru najdete z\u00e1pisy, jen\u017e vypadaj\u00ed takto:<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>{{{ data.variation.price_html}}}<\/p><\/blockquote>\n\n\n\n<p>Jedn\u00e1 se o sou\u010d\u00e1st javascriptov\u00e9ho \u0161ablonovac\u00edho syst\u00e9mu a zjednodu\u0161en\u011b lze \u0159\u00edct, \u017ee script vezme hodnotu, kterou m\u00e1 na\u010dtenou v poli data &#8211; variation a dopln\u00ed do html k\u00f3du cenu varianty &#8211; price_html.<\/p>\n\n\n\n<p>M\u011bn\u00ed se to p\u0159i v\u00fdb\u011bru varianty:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"604\" height=\"290\" src=\"https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2019\/09\/variation-sku-2.jpg\" alt=\"\" class=\"wp-image-5302\" srcset=\"https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2019\/09\/variation-sku-2.jpg 604w, https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2019\/09\/variation-sku-2-300x144.jpg 300w\" sizes=\"(max-width: 604px) 100vw, 604px\" \/><\/figure>\n\n\n\n<p>V p\u0159\u00edpad\u011b, \u017ee chcete roz\u0161\u00ed\u0159it data, jen\u017e se u varianty zobrazuj\u00ed ( my si p\u0159id\u00e1me katalogov\u00e9 \u010d\u00edslo ), mus\u00edte zas\u00e1hnout do k\u00f3du \u0161ablony. <\/p>\n\n\n\n<p><\/p>\n\n\n\n<p>Pole hodnot toti\u017e obsahuje i polo\u017eku sku, pomoc\u00ed kter\u00e9 vyp\u00ed\u0161ete i katalogov\u00e9 \u010d\u00edslo. V\u00fdsledek si m\u016f\u017eete prohl\u00e9dnout na e-shopu nutily.cz z kter\u00e9ho jsou i screeny v \u010dl\u00e1nku, konkr\u00e9tn\u011b z detailu produktu <a href=\"https:\/\/nutily.cz\/para-orechy\/\" target=\"_blank\" rel=\"noopener\">para o\u0159echy<\/a>, kde se sku m\u011bn\u00ed podle zvolen\u00e9 varianty.<\/p>\n\n\n\n<p>Je tak\u00e9 mo\u017en\u00e9 data roz\u0161i\u0159ovat o vlastn\u00ed hodnoty, ale to u\u017e je na jin\u00fd \u010dl\u00e1nek. <\/p>\n\n\n\n<p> Dal\u0161\u00ed u\u017eite\u010dn\u00e9 snippety najdete na str\u00e1nce <strong><a href=\"https:\/\/musilda.cz\/uzitecne-snippety-pro-woocommerce\/\" target=\"_blank\" rel=\"noreferrer noopener\">U\u017eite\u010dn\u00e9 snippety pro WooCommerce<\/a><\/strong> <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Varianta produktu se ve WooCommerce zobrazuje jako sou\u010d\u00e1st variantn\u00edho produktu. Uk\u00e1\u017eeme si, jak roz\u0161\u00ed\u0159it data, kter\u00e1 se m\u011bn\u00ed p\u0159i v\u00fdb\u011bru varianty. Varianta produktu m\u00e1 data, kter\u00e1 se mezi sebou li\u0161\u00ed. Viditeln\u00e9 to je u ceny a vlastnost\u00ed varianty, jen\u017e se p\u0159i v\u00fdb\u011bru v\u011bt\u0161inou m\u011bn\u00ed. Oblast, kter\u00fd se na detailu produktu dynamicky m\u011bn\u00ed, je um\u00edst\u011bn\u00e1 kolem<\/p>\n","protected":false},"author":1,"featured_media":8732,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19,25,29],"tags":[],"class_list":["post-5300","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-snippety","category-woocommerce","category-woocommerce-snippety"],"_links":{"self":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/5300"}],"collection":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/comments?post=5300"}],"version-history":[{"count":0,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/5300\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media\/8732"}],"wp:attachment":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media?parent=5300"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/categories?post=5300"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/tags?post=5300"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}