Nadpisywanie fragmentów WooCommerce we własnym motywie – czyli jak działają szablony WooCommerce

Czy szybkie zmiany w wyglądzie i sposobie działania WooCommerce bez dodatkowych wtyczek są możliwe? Oczywiście 🙂. Wykorzystaj szablony WooCommerce – zobacz, jak modyfikować szablony we własnych plikach PHP w motywie. W artykule przeczytasz, jak dopasować szablony WooCommerce w kilka minut!

Spis treści

• Krótko o motywie potomnym w WordPress?
• Jak działa nadpisywanie szablonu w WooCommerce?
• O czym warto pamiętać stosując nadpisania szablonów?

Krótko o motywie potomnym w WordPress?

Jedną z większych zalet WordPressa jest możliwość tworzenia motywów potomnych. Motywy potomne umożliwiają nam zmodyfikowanie motywu bez ryzyka utraty naszych zmian w przypadku aktualizacji pierwotnego motywu 💪!

Sposób działania polega na ładowaniu motywu rodzica dopasowanego dodatkowo przez kod właśnie w motywie potomnym.

Dlaczego warto stosować motyw potomny?

Jak wspomniano, nie utracisz kodu w razie aktualizacji motywu. Kod znajduje się de facto w osobnym motywie, który nie ulega zmianie w przypadku aktualizacji motywu rodzica. „Trzymanie” kodu w functions.php jednego motywu powodowałoby utratę własnych linii kodu przy aktualizacji WooCommerce’a na rzecz domyślnego pliku 😥.

Czy mogę w podobny sposób modyfikować wtyczki?

Niestety w przypadku wtyczek musimy polegać głównie na akcjach i filtrach stworzonych przez twórcę danego rozwiązania. Na szczęście w przypadku WooCommerce stworzono mechanizm podobny w działaniu do motywów potomnych – możemy nadpisać poszczególne fragmenty wyświetlane przez WooCommerce w naszym motywie – dzięki temu nie musimy się martwić o to, co się stanie po aktualizacji wtyczki (a jest ona aktualizowana dość często) 🙂.

Sprawdź wtyczki dla WordPress i WooCommerce od WP Desk →

Jak działa nadpisywanie szablonu w WooCommerce?

W plikach wtyczki WooCommerce znajduje się specjalny katalog templates, który zawiera pliki (szablony WooCommerce), które można nadpisać we własnym motywie. Dokładniej chodzi o katalog wp-content/plugins/woocommerce/templates.

Stworzenie nadpisania jest bardzo proste – wystarczy (1) skopiować interesujący nas plik do katalogu woocommerce w naszym motywie, a następnie (2) zmodyfikować go według potrzeb.

Przykład nadpisania szablonu WooCommerce

Jeżeli chcemy na przykład nadpisać strukturę wyszukiwarki produktów używanej m.in. w dedykowanym widżecie WooCommerce wystarczy, że przeniesiemy plik:

wp-content/plugins/woocommerce/templates/product-searchform.php

do katalogu:

wp-content/themes/my-theme/woocommerce/product-searchform.php

Od tego momentu wszystkie modyfikacje naniesione w przeniesionym pliku będą widoczne w wyszukiwarce produktów WooCommerce.

O czym warto pamiętać stosując nadpisania szablonów?

Nadpisywanie plików nie jest oczywiście rozwiązaniem pozbawionym wad. Musimy pamiętać o tym, że kod WooCommerce cały czas podlega zmianom. Dlatego jeżeli stosujemy nadpisania, powinniśmy raz na jakiś czas sprawdzić, czy są aktualne ✅.

Dlaczego?

Ponieważ nieaktualne pliki grożą nam:

• Niedziałającymi skryptami JavaScript (brak elementów, które są wymagane przez skrypty),
• Brakiem nowych funkcji i elementów interfejsu,
• Błędami bezpieczeństwa – czasem zdarza się, że aktualizacje niosą poprawki bezpieczeństwa związane także z plikami, które można nadpisać,

Dodatkowo czasem może okazać się, że na potrzeby naszej modyfikacji wystarczą filtry lub akcje dostępne w szablonach wykorzystywanych przez WooCommerce, dlatego warto skorzystać właśnie z nich (hooków) 💪.

Podsumowanie

Nadpisywane fragmentów kodu generowanych przez WooCommerce jest bardzo proste dzięki wbudowanemu mechanizmowi nadpisywania. Przed każdym nadpisaniem należy jednak upewnić się, że rzeczywiście jest ono konieczne oraz należy pamiętać o stałym aktualizowaniu raz nadpisanych plików ⬆️.

Szablony WooCommerce i ich nadpisywanie mogą okazać się bardzo pomocne przy dopasowaniu stron sklepu WooCommerce ⭐.

Jeśli masz jakieś pytania, napisz do nas!

Sprawdź wtyczki i usługi dla WordPress i WooCommerce od WP Desk →