Jak ukryć / usunąć przycisk Dodaj do koszyka w WooCommerce (krok po kroku)

Jak ukryć i usunąć przycisk Dodaj do koszyka w WooCommerce?

Zacznijmy od ustalenia, dlaczego możesz chcieć ukryć przycisk Dodaj do koszyka. Jednym z najskuteczniejszych sposobów wyłączenia procesu zakupu określonego produktu lub sklepu jest usunięcie przycisku Dodaj do koszyka. Nawet jeśli może się to wydawać dziwne, usunięcie przycisku Dodaj do koszyka może być w niektórych okolicznościach niezwykle przydatne.

Istnieje wiele powodów, dla których możesz chcieć usunąć przycisk Dodaj do koszyka z niektórych stron swojego sklepu, oprócz zapewnienia większej liczby opcji dostosowywania:

  1. Gdy produkt jest niedostępny lub nie jest już dostępny
  2. Aby dezaktywować przycisk w oparciu o logikę (tj. dla określonych ról użytkownika lub produktów, niezalogowanych użytkowników itp.)
  3. Produkt nie jest jeszcze dostępny w sprzedaży.
  4. Gdy chcesz, aby klienci używali tego przycisku zamiast standardowego procesu zakupowego WooCommerce, aby wysłać wiadomość lub umówić się na rozmowę kwalifikacyjną.

To tylko kilka przykładów, kiedy możesz chcieć ukryć lub usunąć przycisk Dodaj do koszyka ze swojego sklepu. Zacznijmy od usunięcia przycisku dodawania do koszyka WooCommerce z Twojego sklepu.

 

Jak usunąć przycisk Dodaj do koszyka w WooCommerce?

W tym artykule dowiesz się, jak ukryć przycisk dodawania do koszyka na różne sposoby. Pokażemy Ci, jak wykonać następujące czynności, aby uzyskać więcej opcji:

  1. Usuń lub ukryj przycisk Dodaj do koszyka w całej witrynie.
  2. Ukryj przycisk Dodaj do koszyka dla użytkowników, którzy nie są zalogowani.
  3. Usuń przycisk Dodaj do koszyka na podstawie ról użytkownika.
  4. Ukryj przycisk Dodaj do koszyka na niektórych produktach.
  5. Wyłącz przycisk Dodaj do koszyka tylko dla niektórych kategorii
  6. Usuń tymczasowo przycisk, a pojawi się ponownie po dacie.
  7. Przyjrzyjmy się każdemu z nich w różnych sekcjach.

Uwaga: ponieważ będziemy edytować podstawowe pliki WordPress, zalecamy wykonanie pełnej kopii zapasowej witryny na wypadek, gdyby coś poszło nie tak. Możesz także wykorzystać motyw potomny. Jeśli jeszcze go nie masz, możesz zrobić go samodzielnie lub użyć wtyczki motywu potomnego.

1. Usuń lub ukryj przycisk Dodaj do koszyka w całej witrynie

Istnieje kilka opcji całkowitego usunięcia przycisku Dodaj do koszyka ze sklepu. Jednym z najprostszych jest umieszczenie następującego skryptu w swoim motyw potomny plik functions.php:

remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart');

remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );

Usuwamy przycisk Dodaj do koszyka na stronie produktu za pomocą pierwszego haczyka usuwania akcji() i robimy to samo na stronie koszyka za pomocą drugiego. Z drugiej strony wyłączenie opcji kupowania produktów jest schludniejszym i bardziej niezawodnym rozwiązaniem. Będziesz mógł uniemożliwić zakup produktów i uniemożliwić użytkownikom dodawanie ich do koszyka w ten sposób.

Za pomocą poniższego skryptu możesz to zrobić i uniemożliwić zakup wszystkich produktów w Twoim sklepie:

add_filter( 'woocommerce_is_purchasable', '__return_false');

Spowoduje to wyłączenie przycisku Dodaj do koszyka WooCommerce, ale nie samego przycisku. Zostanie on po prostu zastąpiony przyciskiem Czytaj więcej, przekierowującym użytkowników na stronę produktu, która będzie pozbawiona jakichkolwiek przycisków.

Jeśli chcesz ukryć przycisk Czytaj więcej oprócz przycisku Dodaj do koszyka, powinieneś użyć reguły CSS. Z drugiej strony klienci nie będą mogli nic kupić, ponieważ nie będą mogli dodawać produktów do koszyka, nawet jeśli nauczą się korzystać z narzędzia programistycznego przeglądarki, aby to odkryć. Używaj haka add filter() zamiast haka remove action(), gdy tylko jest to możliwe.

Czytaj więcej: Jak zmienić tekst przycisku Dodaj do koszyka

2. Ukryj przycisk Dodaj do koszyka dla użytkowników, którzy nie są zalogowani

Załóżmy, że prowadzisz ograniczoną czasowo promocję dla zarejestrowanych użytkowników. Możesz stworzyć unikalną stronę docelową i wysłać e-mail tylko do zarejestrowanych użytkowników z linkiem, ale co, jeśli udostępnią go innym? Możesz usunąć przycisk Dodaj do koszyka ze swojego sklepu WooCommerce tylko dla niezalogowanych użytkowników, aby tego uniknąć i upewnić się, że udzielasz rabatów tylko docelowemu klientowi. Aby to zrobić, wklej następujący skrypt do pliku functions.php motywu potomnego:

jeśli (!is_user_logged_in()) {
// na stronie produktu
add_filter('woocommerce_is_purchasable', '__return_false');

}

Wyłączymy przycisk Dodaj do koszyka tylko dla niezalogowanych użytkowników, stosując natywną funkcję WordPress is user zalogowany().

3. Usuń przycisk Dodaj do koszyka na podstawie ról użytkownika

Inną genialną opcją jest wyłączenie przycisku Dodaj do koszyka w zależności od roli użytkownika. Rzućmy okiem na to, jak sprawić, by przycisk był niewidoczny dla każdego administratora:

add_action('wp_loaded','get_user_role');

funkcja get_user_role(){

$bieżący_użytkownik = wp_get_bieżący_użytkownik();

  if(count($current_user->role)!==0){

  if($current_user->roles[0]=='administrator'){

add_filter('woocommerce_is_purchasable', '__return_false');

}

}

}

Obiekt użytkownika WordPress jest pobierany i skrypt stosuje do niego dwa warunki. Pierwszym z nich jest określenie, czy użytkownik ma rolę, a drugim, aby produkty były niedostępne do zakupu tylko wtedy, gdy rola użytkownika jest zgodna z tą, którą określamy (w tym przypadku administratora). Z pewnością możesz użyć tego kodu i zmienić rolę, której nie chcesz widzieć przycisku Dodaj do koszyka, edytując rolę w if($current_user->roles[0]=='your_role'){.

4. Ukryj przycisk Dodaj do koszyka na niektórych produktach

Załóżmy, że brakuje Ci niektórych produktów i chcesz tymczasowo ukryć przycisk Dodaj do koszyka dla tych produktów.

Skopiuj i wklej następujący skrypt do pliku functions.php motywu potomnego, aby usunąć przycisk dla określonych produktów:

add_filter('woocommerce_is_purchasable', 'filter_is_purchasable', 10, 2);

funkcja filter_is_purchasable($ is_purchasable, $product ) {

globalny produkt $;

if( in_array( $product->get_id(), not_purchasable_ids() )) {

return false;

}

zwróć $jest_do nabycia;

}

funkcja not_purchasable_ids() {

zwróć tablicę( 624,625 );

}

Przycisk Dodaj do koszyka jest wyłączony dla produktów o identyfikatorach 624 i 625 w tym przykładowym skrypcie. Rozważ zastąpienie tych identyfikatorów identyfikatorami produktów WooCommerce, aby dostosować je do swojego sklepu. Jak widać, możesz zezwolić na nieograniczoną liczbę produktów, po prostu używając przecinka do oddzielenia identyfikatorów.

Przejdź do pulpitu WordPress > WooCommerce > Produkty i najedź myszą na produkt na liście, aby zobaczyć jego identyfikator.

5. Wyłącz przycisk Dodaj do koszyka tylko dla niektórych kategorii

Możesz również wyłączyć przycisk Dodaj do koszyka dla poszczególnych kategorii. Na przykład, jeśli chcesz ukryć przycisk z kategorii „Laptopy”, możesz użyć następującego kodu:

add_action('wp', 'QL_remove_add_to_cart_from_category' );   

funkcja QL_remove_add_to_cart_from_category(){ 

  if( is_product_category( 'laptopy' ) ) { 

    remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart'); 

  } 

}

Po prostu skopiuj ten kod i zastąp „laptopy” w wierszu 3 tytułem kategorii, w której przycisk Dodaj do koszyka powinien być ukryty.

6. Usuń tymczasowo przycisk, a pojawi się ponownie po dacie

Przenieśmy sprawy na inny poziom i połączmy razem to, co przeczytaliśmy. Załóżmy, że masz zamiar uruchomić produkt, a już utworzyłeś stronę produktu ze wszystkimi jego funkcjami. Jeśli chcesz użyć tej strony, aby poinformować klientów o wprowadzeniu produktu na rynek i promować produkt przed jego wprowadzeniem na rynek, możesz ukryć przycisk Dodaj do koszyka do oficjalnej premiery, a następnie automatycznie wyświetlić go w dniu premiery.

Załóżmy, że planujesz wprowadzić swój produkt 15 grudnia 2020 r. i do tego czasu chcesz ukryć przycisk Dodaj do koszyka, a następnie ponownie go ujawnić 15 grudnia. Aby to zrobić, po prostu skopiuj i wklej poniższy skrypt:

add_filter( 'woocommerce_is_purchasable', 'hide_add_to_cart_button_until_date', 10, 2 );

funkcja hide_add_to_cart_button_until_date( $ is_purchasable = true, $ product ) {

$bieżąca_data = data('Ym-d');

$release_date = data( 'Ym-d', strtotime('2020-12-15') );

if( strtotime($current_date) < strtotime($release_date) && $product->get_id() == 624 ) {

$is_purchasable = fałsz;

}

zwróć $jest_do nabycia;

}

Przycisk Dodaj do koszyka zostanie zastąpiony przyciskiem Czytaj więcej, który przeniesie użytkowników na stronę produktu do daty premiery. Przyjrzyjmy się bliżej, jak teraz działa skrypt. Kod porównuje aktualną datę z datą premiery, a jeśli bieżąca data jest wcześniejsza, produkt jest niedostępny do zakupu.

Produkt będzie dostępny do zakupu, gdy bieżąca data będzie równa lub przekroczona data premiery, a przycisk Dodaj do koszyka pojawi się automatycznie. Pamiętaj o podaniu daty oraz identyfikatora produktu (w naszym przykładzie 624).

W tym przewodniku poznałeś kilka metod usuwania przycisku Dodaj do koszyka. Widzieliśmy, jak ukryć to w całym sklepie, w przypadku określonych produktów, użytkowników i ról użytkowników, a nawet jak ukryć je na określony dzień, a następnie automatycznie pokazać je ponownie. Daje to trochę więcej swobody, jeśli chodzi o dostosowywanie sklepu do różnych scenariuszy.

Po prostu użyj tych skryptów jako punktu wyjścia i zmodyfikuj je tak, aby pasowały do ​​potrzeb Twojego sklepu.

 

O autorze
Daniel Łukasz
Daniel jest projektantem i programistą stron internetowych. Przez ostatnie 10 lat był programistą pracującym z różnymi motywami WordPress, co pozwala mu porównywać i kontrastować różne motywy, rozumieć mocne i słabe strony, aby tworzyć oparte na faktach recenzje w świecie rzeczywistym. Jest także programistą aplikacji mobilnych i recenzentem technologii. Przez kilka lat rozwijał własne aplikacje mobilne, zarówno na Androida, jak i iPhone'a. Ta praktyczna specjalizacja w tworzeniu rozwiązań mobilnych i internetowych pozwala mu wypowiadać się w sposób autorytatywny w zakresie raportowania technologii.

Jeszcze jedna rzecz... Czy wiesz, że osoby, które udostępniają przydatne rzeczy, takie jak ten post, również wyglądają NIESAMOWITE? ;-)
Proszę zostaw użyteczny skomentuj swoje przemyślenia, a następnie udostępnij to na swoich grupach na Facebooku, które uznają to za przydatne i wspólnie zbierzmy korzyści. Dziękuję za udostępnienie i bycie miłym!

Ujawnienie: Ta strona może zawierać linki do zewnętrznych witryn produktów, które kochamy i gorąco polecamy. Jeśli kupisz sugerowane przez nas produkty, możemy otrzymać opłatę za polecenie. Takie opłaty nie wpływają na nasze rekomendacje i nie przyjmujemy płatności za pozytywne recenzje.

Autorzy promowani w:  Inc Czasopismo Logo .   Logo Sitepoint   Logo CSS Tricks    logo webdesignerdepot   Logo WPMU DEV   i wiele więcej ...