Dodanie przycisku wyczyść koszyk w WooCommerce

Podczas zakupów w sklepie WooCommerce może wyniknąć potrzeba, aby usunąć dodane do koszyka produkty. Powodów tego może być mnóstwo: został znaleziony lepszej jakości produkt, wybrany nowy produkt z innej kategorii albo zdecydowano się kupić tańszy produkt itp. W każdym z tych przypadków należy usunąć niepotrzebny produkt albo kilka produktów z listy w koszyku.

Standardowa konfiguracja WooCommerce pozwala usunąć tylko jeden produkt jednocześnie (rys. 1).  Takie rozwiązanie jest dobre, gdy chodzi o usunięcie jednej pozycji z listy. W przypadku, usunięcia dwóch i więcej produktów procedura zajmuje więcej czasu. A gdy trzeba wyczyścić cały koszyk – pojedyncze usunięcie produktów staje się czasochłonne i niewygodne dla użytkownika.

Dlatego w dzisiejszym artykule przedstawimy jeden z możliwych sposobów rozwiązania podanego problemu. Dodamy przycisk „Wyczyść koszyk”, który umożliwi za pomocą jednego kliknięcia usunięcie wszystkich dodanych produktów.

Do realizacji opisanego powyżej celu będzie konieczne dodanie kilku linijek kodu. Ten proces można rozdzielić na 2 proste kroki.

Krok 1

Otwórzmy plik functions.php naszego motywu. Zrobić to można w dowolny sposob: przez panel administracyjny WordPress, manager plików albo połączyć się z FTP. W naszym przypadku skorzystamy z Edytora wbudowanego w WordPress.

Przechodzimy do sekcji Wygląd – Edytor i otwieramy plik functions.php. Następnie przechodzimy na koniec pliku, gdzie dodajemy następujący fragment kodu (rys. 2):

add_action('init', 'woocommerce_clear_cart_url');

function woocommerce_clear_cart_url() {

global $woocommerce;

if( isset($_REQUEST['clear-cart']) ) {

$woocommerce->cart->empty_cart();

}

}

Jak widać z powyższego kodu funkcja woocommerce_clear_cart_url() usuwa wszystkie elementy z koszyka przekazując zmiennej „koszyk” znaczenie „pusty”.

Krok 2

Następny krok polega na dodaniu przycisku do koszyka. Żeby to zrobić należy otworzyć plik cart.php, który znajduje się w folderze templates wtyczki WooCommerce na serwerze. Adres do niego jest następujący:

/wp-content/plugins/public_html/nasza_strona_www/woocommerce/tempates/cart/carts.php. W naszym przypadku otworzymy podany plik poprzez połączenie z FTP za pomocą TotalCommander (rys. 3).

Otwieramy plik cart.php i przechodzimy do miejsca, gdzie opisane są inne przyciski koszyka (linia 135 HTML).  Tutaj możemy wybrać potrzebne miejsce dla przycisku. W naszym przypadku dodamy przycisk „Wyczyść koszyk” przed przyciskiem „Zaktualizuj koszyk”. Dlatego w linii 143 HTML dodamy następujący kod (rys. 4):

<input type="submit" class="button" name="clear-cart" value="<?php _e('Wyczyść koszyk', 'woocommerce'); ?>" />

Zapisujemy zmiany w pliku cart.php i odświeżamy stronę z dodanymi do koszyka produktami. W rezultacie pojawi się dołączony przez nas przycisk „Wyczyść koszyk” (rys. 5).

Sprawdźmy jego funkcjonalność. Klikamy na niego i po kilku sekundach otrzymujemy pusty koszyk o czym informuje nas następujący komunikat (rys. 6):

Podsumowanie. Przedstawialiśmy bardzo proste rozwiązanie, rozszerzające standardową opcję WooCommerce. Za pomocą niej twoi klienci będą mogli poprzez jedno kliknięcie usunąć wszystkie produkty z koszyka. Można również zmienić szablon samego koszyka, aby wyglądał on lepiej i odpowiadał projektu strony. Ale jest to kolejny temat, potrzebujący dodatkowego wyświetlenia.

P.S. Mam nadzieję, że dzisiejszy artykuł będzie dla Was użyteczny. Jeśli będziecie mieli pytania albo uwagi, podzielcie się nimi w komentarzach poniżej.