{"id":234006,"date":"2023-02-27T15:59:00","date_gmt":"2023-02-27T12:59:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=234006"},"modified":"2022-11-11T13:47:15","modified_gmt":"2022-11-11T10:47:15","slug":"kodowanie-dla-woocommerce-wprowadzenie","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pl\/kodowanie-dla-woocommerce-wprowadzenie\/","title":{"rendered":"Kodowanie dla WooCommerce: wprowadzenie"},"content":{"rendered":"\n

To jest wprowadzenie dla pocz\u0105tkuj\u0105cych programist\u00f3w do wtyczki WordPress WooCommerce<\/a>. W tym po\u015bcie przyjrzymy si\u0119 podstawom dzia\u0142ania WooCommerce i mo\u017cliwo\u015bci dostosowania go w naszym motywie lub wtyczce za pomoc\u0105 hak\u00f3w i szablon\u00f3w.<\/p>\n

Po pierwsze, WooCommerce oferuje du\u017c\u0105 elastyczno\u015b\u0107 dla tw\u00f3rc\u00f3w motyw\u00f3w i wtyczek, aby dostosowa\u0107 ich funkcjonalno\u015b\u0107. W przypadku prostych modyfikacji zwykle masz co najmniej dwie alternatywy. Wyb\u00f3r sposobu modyfikacji zale\u017cy od tego, jak wolisz pracowa\u0107, jak elastyczny i czytelny powinien by\u0107 Tw\u00f3j kod oraz od tego, jak wolisz kontynuowa\u0107 konserwacj\u0119 witryny w przysz\u0142o\u015bci, je\u015bli chodzi o aktualizacje wtyczek (i WordPress).<\/p>\n

Zanim zaczniesz zajmowa\u0107 si\u0119 modyfikacj\u0105 funkcjonalno\u015bci WooCommerce za pomoc\u0105 kodu, powiniene\u015b sprawdzi\u0107, czy to, co chcesz osi\u0105gn\u0105\u0107, jest mo\u017cliwe poprzez zmian\u0119 ustawie\u0144. WooCommerce zawiera ogromn\u0105 stron\u0119 ustawie\u0144, kt\u00f3ra pozwala na wiele zmian. W nowszych wersjach WooCommerce doda\u0142 r\u00f3wnie\u017c i przeni\u00f3s\u0142 dodatkowe ustawienia do WordPress Customizer. Tutaj b\u0119dziesz m\u00f3g\u0142 na przyk\u0142ad dostosowa\u0107 liczb\u0119 kolumn i dostosowa\u0107 niekt\u00f3re pola kasy.<\/p>\n

Szablony WooCommerce<\/h2>\n

WooCommerce oferuje szerok\u0105 gam\u0119 plik\u00f3w szablon\u00f3w, kt\u00f3re jako programista motyw\u00f3w mo\u017cesz zast\u0105pi\u0107. Spos\u00f3b, w jaki to robisz, polega na utworzeniu kopii oryginalnego szablonu WooCommerce do folderu motywu. Nast\u0119pnie wprowadzasz zmiany w pliku w swoim motywie.<\/p>\n

Przejd\u017a do folderu wtyczki WooCommerce w \/wp-content\/plugins\/woocommerce\/<\/code>. Tutaj znajdziesz podfolder templates<\/code>. Ca\u0142a zawarto\u015b\u0107 plik\u00f3w (jest ich du\u017co!) \/wp-content\/plugins\/woocommerce\/templates\/<\/code>zawieraj\u0105ca podfoldery to wszystkie pliki szablon\u00f3w, kt\u00f3re mo\u017cesz nadpisa\u0107 w swoim motywie.<\/p>\n

Aby WooCommerce m\u00f3g\u0142 znale\u017a\u0107 zmodyfikowane szablony, potrzebujesz podfolderu w katalogu g\u0142\u00f3wnym motywu o nazwie woocommerce<\/code>. Je\u015bli slug Twojego motywu to \u201eawhitepixel", Tw\u00f3j folder powinien znajdowa\u0107 si\u0119 pod adresem \/wp-content\/themes\/awhitepixel\/woocommerce\/<\/code>. Wewn\u0105trz tego folderu mo\u017cesz umie\u015bci\u0107 swoje zmodyfikowane kopie plik\u00f3w szablon\u00f3w WooCommerce. Pami\u0119taj, \u017ce pliki szablon\u00f3w znajduj\u0105ce si\u0119 w podfolderach nale\u017cy umie\u015bci\u0107 w odpowiednich podfolderach w folderze woocommerce. Na przyk\u0142ad; nadpisanie WooCommerce \/templates\/single-product\/add-to-cart\/simple.php<\/code>wymaga umieszczenia kopii simple.php<\/code>w \/woocommerce\/single-product\/add-to-cart\/<\/code>folderze w swoim motywie.<\/p>\n

By\u0107 mo\u017ce zauwa\u017cy\u0142e\u015b r\u00f3wnie\u017c, \u017ce w szablonach jest wiele akcji i filtr\u00f3w. Wi\u0119kszo\u015b\u0107 z nich jest wype\u0142niona do_action()<\/code>s. Aby optymalnie wykorzysta\u0107 WooCommerce, nie nale\u017cy usuwa\u0107 \u017cadnych haczyk\u00f3w z szablon\u00f3w. W wi\u0119kszo\u015bci przypadk\u00f3w mo\u017cesz rozwa\u017cy\u0107 zmian\u0119 funkcjonalno\u015bci za pomoc\u0105 akcji i filtr\u00f3w zamiast zast\u0119powania szablon\u00f3w. Wyja\u015bni\u0119 dlaczego!<\/p>\n

Wa\u017cna uwaga na temat nadpisywania szablon\u00f3w i aktualizacji wtyczek<\/h3>\n

Dla pocz\u0105tkuj\u0105cego nadpisanie szablonu mo\u017ce wydawa\u0107 si\u0119 naj\u0142atwiejsz\u0105 i najbardziej intuicyjn\u0105 poprawk\u0105. Po co zadziera\u0107 z haczykami, je\u015bli mo\u017cesz od razu zmieni\u0107 szablon, kt\u00f3ry wy\u015bwietla to, co chcesz zmieni\u0107? Odpowied\u017a: Poniewa\u017c ta strategia generuje wi\u0119cej pracy na utrzymanie Twojego sklepu internetowego.<\/p>\n

WooCommerce cz\u0119sto si\u0119 aktualizuje, a czasami aktualizuje plik szablonu. Aby Tw\u00f3j sklep internetowy by\u0142 aktualny, musisz r\u00f3wnie\u017c zaktualizowa\u0107 nadpisane pliki szablon\u00f3w w swoim motywie. Zazwyczaj b\u0119dziesz musia\u0142 zast\u0105pi\u0107 ca\u0142y plik szablonu najnowszym zaktualizowanym plikiem, a nast\u0119pnie ponownie doda\u0107 zmiany. To szybko staje si\u0119 du\u017co trudniejsze, je\u015bli nie pami\u0119tasz wszystkich wprowadzonych zmian. We\u017a to ode mnie, kt\u00f3ry ma wieloletnie do\u015bwiadczenie w naprawianiu plik\u00f3w szablon\u00f3w WooCommerce innych programist\u00f3w podczas aktualizacji wtyczek. Zaufaj mi, to nie jest fajna praca!<\/p>\n

Teraz, gdy wiemy, \u017ce haki s\u0105 lepsz\u0105 strategi\u0105, sp\u00f3jrzmy, jak si\u0119 do tego zabra\u0107.<\/p>\n

Haki WooCommerce<\/h2>\n

WooCommerce oferuje ogromn\u0105 ilo\u015b\u0107 hook\u00f3w, zar\u00f3wno akcji, jak i filtr\u00f3w. Korzystanie z hak\u00f3w jest naprawd\u0119 proste!<\/p>\n

Za pomoc\u0105 hak\u00f3w mo\u017cesz r\u00f3wnie\u017c zmieni\u0107 znacznie wi\u0119cej ni\u017c tylko wyj\u015bcie szablon\u00f3w. Mo\u017cesz dostosowa\u0107 ceny produkt\u00f3w, pola kasy lub sprawi\u0107, by Tw\u00f3j sklep internetowy zrobi\u0142 co\u015b, gdy produkt zostanie dodany do koszyka.<\/p>\n

Je\u015bli tworzysz wtyczk\u0119, haki s\u0105 r\u00f3wnie\u017c jedyn\u0105 drog\u0105. Mo\u017cesz zast\u0105pi\u0107 szablony tylko w motywie, a nie wtyczce. (Ok, s\u0105 sposoby na pokonanie tego, ale jest to bardzo rzadkie i nie zalecane).<\/p>\n

Je\u015bli zajrza\u0142e\u015b do niekt\u00f3rych plik\u00f3w szablon\u00f3w WooCommerce, powiniene\u015b zobaczy\u0107 wiele do_action()<\/code>. To s\u0105 haki; punkty kontrolne, do kt\u00f3rych mo\u017cesz si\u0119 pod\u0142\u0105czy\u0107 i doda\u0107 sw\u00f3j kod lub zmodyfikowa\u0107 zmienn\u0105. Je\u015bli nie jeste\u015b pewien, jak dzia\u0142aj\u0105 hooki, mam post, kt\u00f3ry szczeg\u00f3\u0142owo to wyja\u015bnia<\/a>.<\/p>\n

Je\u015bli chcesz co\u015b wypisa\u0107, na przyk\u0142ad tekst lub co\u015b podobnego, poszukaj akcji (do_action()<\/code>). Na przyk\u0142ad wyprowadzaj\u0105c co\u015b w szablonie koszyka, mo\u017cesz podpi\u0105\u0107 si\u0119 pod woocommerce_before_cart<\/code>, woocommerce_before_cart_table<\/code>, woocommerce_before_cart_contents<\/code>, woocommerce_cart_contents<\/code>, woocommerce_cart_actions<\/code>, woocommerce_after_cart_contents<\/code>, woocommerce_after_cart_table<\/code>, woocommerce_cart_collaterals<\/code>, lub woocommerce_after_cart<\/code>. Po prostu wybierz ten, kt\u00f3ry znajduje si\u0119 w miejscu, w kt\u00f3rym chcesz uzyska\u0107 wydruk. Oto przyk\u0142ad wy\u015bwietlania tekstu przed tabel\u0105 i formularzem na stronie koszyka:<\/p>\n

add_action('woocommerce_before_cart', function() {\n    _e('Here are the products you have added in the cart so far', 'textdomain');\n});<\/code><\/pre>\n
Filtry (szukaj apply_filters()<\/code>) s\u0142u\u017c\u0105 do modyfikowania wyj\u015bcia lub zmiennej. Cz\u0119stym zastosowaniem filtr\u00f3w w WooCommerce jest modyfikacja tekstu \u201eDodaj do koszyka” na przyciskach kupowania. WooCommerce oferuje w tym celu wiele filtr\u00f3w, co pozwala kontrolowa\u0107 tekst na r\u00f3\u017cnych stronach. Na przyk\u0142ad mo\u017cesz dostosowa\u0107 tekst w p\u0119tli sklepu lub w widoku pojedynczego produktu. Filtry cz\u0119sto dostarczaj\u0105 wielu argument\u00f3w do dalszej kontroli, na przyk\u0142ad obiekt produktu. Oto prosty przyk\u0142ad, jak zmieni\u0107 tekst \u201eDodaj do koszyka” w widoku pojedynczego produktu:<\/p>\n
add_filter('woocommerce_product_single_add_to_cart_text', function($original_text, $product) {\n    return __('Buy this', 'textdomain');\n}, 10, 2);<\/code><\/pre>\n
Maj\u0105c pewn\u0105 wiedz\u0119 na temat dzia\u0142ania hook\u00f3w i po prostu zagl\u0105daj\u0105c do plik\u00f3w szablon\u00f3w, mo\u017cna znale\u017a\u0107 ca\u0142kiem sporo \u0142atwo zmieniaj\u0105cych si\u0119 funkcji. Oczywi\u015bcie WooCommerce oferuje znacznie bardziej zaawansowan\u0105 modyfikacj\u0119, zmian\u0119 cen, metod p\u0142atno\u015bci, modyfikacje produkt\u00f3w czy importy, a wszystko to mo\u017cliwe za pomoc\u0105 hook\u00f3w.<\/p>\n
Wniosek<\/h2>\n
Celem tego postu jest przekazanie pocz\u0105tkuj\u0105cym podstaw, jak wprowadza\u0107 modyfikacje w WooCommerce i konsekwencje tego, jak wprowadzasz zmiany. Zawsze zalecam u\u017cywanie hook\u00f3w nad nadpisywaniem plik\u00f3w szablon\u00f3w, chyba \u017ce jest to absolutnie konieczne.<\/p>\n
Nast\u0119pnym krokiem jest zag\u0142\u0119bienie si\u0119 w zaawansowane modyfikacje poprzez poznanie hook\u00f3w, proces\u00f3w i obiekt\u00f3w w WooCommerce. Poniewa\u017c WooCommerce<\/a> jest najpopularniejsz\u0105 platform\u0105 eCommerce, w Internecie dost\u0119pnych jest wiele zasob\u00f3w i przyk\u0142ad\u00f3w kodu. Zajrzyj r\u00f3wnie\u017c do kategorii Woocommerce<\/a> na tej stronie, aby uzyska\u0107 wi\u0119cej informacji.<\/p>\n
\u0179r\u00f3d\u0142o nagrywania:  awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Wprowadzenie programisty do podstaw WordPress WooCommerce; jak to dzia\u0142a i jak mo\u017cesz dostosowa\u0107 jego funkcjonalno\u015b\u0107 w swoim motywie lub wtyczce.<\/p>\n","protected":false},"author":1,"featured_media":239407,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[897,897,1110,815,845,845,856,856,866,866,815],"tags":[1169],"class_list":["post-234006","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-kod","category-n-a","category-wtyczki","category-samouczki","category-woocommerce-7","category-wordpress-7","tag-affiai-pl"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/234006","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/comments?post=234006"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/234006\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media\/239407"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media?parent=234006"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/categories?post=234006"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/tags?post=234006"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}