Jak zmienić komunikaty o błędach w kasie WooCommerce?

Szukasz sposobów na zaktualizowanie powiadomień o błędach przy kasie? Jesteśmy z Tobą. W tym przewodniku pokażemy różne metody zmiany komunikatów o błędach w kasie WooCommerce.

Prowadząc sklep internetowy, w pewnym momencie napotkasz konflikty i błędy. Widzieliśmy już, jak rozwiązać ogólne problemy z kasą, co zrobić, gdy przycisk Dodaj do koszyka nie działa, a także kilka rozwiązań, gdy strona sklepu jest pusta. W tym samouczku pokażemy różne sposoby zmiany komunikatów o błędach w kasie WooCommerce i tworzenia niestandardowych.

Zanim przyjrzymy się różnym sposobom, aby to zrobić, lepiej zrozummy korzyści płynące z dostosowywania komunikatów o błędach na stronie kasy.

Po co zmieniać komunikaty o błędach realizacji transakcji?

Domyślnie WooCommerce zawiera podstawowe i dość ogólne komunikaty o błędach w kasie. Większość właścicieli sklepów pozostawia je takimi, jakie są, więc zmieniając te wiadomości, możesz łatwo wyróżnić się z tłumu.

Pozostawienie powiadomień o kasie bez zmian to świetna stracona okazja. Kasa jest najważniejszym momentem, ponieważ decyduje o tym, czy sfinalizujesz sprzedaż, czy nie. Jeśli podczas realizacji transakcji wystąpi błąd, kupujący mogą się wycofać, a Ty możesz stracić sprzedaż. Dostosowując te komunikaty o błędach przy kasie, możesz w pełni je wykorzystać i wyjaśnić, co się stało, aby zapewnić klientom bezpieczeństwo.

Domyślnie WooCommerce wyświetla komunikaty o błędach, gdy brakuje wymaganych pól lub gdy wprowadzona przez klienta metoda płatności jest nieprawidłowa. Oto typowe komunikaty o błędach, które widzisz przy kasie:

Jak widać, są jasne, ale można z nimi zrobić o wiele więcej. Na przykład możesz dodać elementy, które odzwierciedlają Twoją markę, dodać więcej tekstu i tak dalej.

Teraz, gdy wiesz, dlaczego powinieneś zmienić komunikaty o błędach kasy w WooCommerce, zobaczmy, jak możesz wykonać zadanie.

Jak zmienić komunikaty o błędach w kasie WooCommerce?

Istnieją dwa sposoby edytowania komunikatów o błędach w kasie WooCommerce :

1. Z wtyczkami
2. Programowo

Przyjrzyjmy się obu metodom, abyś mógł wybrać odpowiednią zgodnie ze swoimi umiejętnościami i potrzebami.

1) Dostosuj komunikaty o błędach kasy za pomocą wtyczek

Jeśli nie masz umiejętności kodowania lub wolisz używać wtyczek do edycji komunikatów o błędach WooCommerce, możesz użyć wtyczki Powiedz co. To narzędzie pomaga modyfikować ciągi stron internetowych bez pisania ani jednej linii kodu lub edytowania plików szablonów.

Darmowa wersja zawiera podstawowe funkcje, a wersja premium zaczyna się od 39 USD rocznie i odblokowuje bardziej zaawansowane możliwości dostosowywania.

Po zainstalowaniu i aktywacji wtyczki, po lewej stronie zobaczysz opcje konfiguracji. Stamtąd możesz wybrać ciąg, który chcesz zastąpić, i wprowadzić treść docelową. Gdy to zrobisz, naciśnij Zapisz , i to wszystko.

Jeśli potrzebujesz pomocy z wtyczką, możesz zgłosić zgłoszenie do pomocy technicznej lub wysłać e-mail do zespołu pomocy technicznej za pomocą formularza kontaktowego.

2) Programowo edytuj komunikaty o błędach kasy

Jeśli nie chcesz używać wtyczki i masz umiejętności programistyczne, możesz edytować komunikaty o błędach za pomocą odrobiny kodu. W tej sekcji pokażemy, jak używać PHP do zmiany komunikatów o błędach w WooCommerce.

Tutaj możesz zrobić wiele. W tej demonstracji skupimy się na wyświetlaniu jednego komunikatu o błędzie zamiast domyślnych wielu ostrzeżeń na stronie kasy.

W tym celu zmodyfikujemy plik functions.php motywu, więc przed rozpoczęciem zalecamy utworzenie kopii zapasowej witryny i utworzenie motywu potomnego, jeśli jeszcze go nie masz.

Następnie możesz dodać poniższy kod do pliku funtions.php motywu potomnego. Jak wspomniano wcześniej, wyświetli pojedynczy komunikat o błędzie na stronie kasy zamiast kilku powiadomień.

 add_action( 'woocommerce_after_checkout_validation', 'quadlayers', 9999, 2);
 cztery warstwy funkcji( $pola, $błędy){
 // w przypadku jakichkolwiek błędów walidacji
 if( !empty( $errors->get_error_codes() ) ) {

 // pomiń wszystkie istniejące komunikaty o błędach
 foreach( $errors->get_error_codes() jako $kod ) {
 $errors->remove( $kod );
 }
 // wyświetl niestandardowy pojedynczy komunikat o błędzie
 $errors->add( 'validation', 'Twoja niestandardowa wiadomość jest tutaj!!!' );
 }
 }

Jeśli przyjrzysz się bliżej kodowi, zobaczysz, że ustawiliśmy quadlayers jako funkcję, a Twoja niestandardowa wiadomość idzie tutaj!!! jako pojedyncza wiadomość. Możesz wziąć ten fragment jako podstawę i dostosować go do swoich wymagań.

W tej demonstracji używamy wtyczki specyficznej dla witryny, aby wkleić kod, jak widać poniżej.

Teraz sprawdź front end, dodaj dowolny produkt do koszyka i przejdź do strony kasy. Jeśli spróbujesz sfinalizować zakup bez wypełnienia żadnych wymaganych pól, zobaczysz następujący błąd:

W ten sposób możesz zmienić komunikaty o błędach w kasie WooCommerce za pomocą odrobiny kodu.

Jak widać, to prosty przykład. Zalecamy połączenie tego podejścia z warunkami warunkowymi, aby poprawić wrażenia zakupowe klientów. Aby dowiedzieć się więcej na ten temat, zapoznaj się z naszym przewodnikiem, jak dodać pola warunkowe do kasy WooCommerce.

Do tej pory widzieliśmy kilka sposobów na dostosowanie komunikatów o błędach przy kasie. Ale możesz zrobić więcej, aby ulepszyć swój sklep internetowy. Zobaczmy, jak możesz dodać niestandardowe wiadomości.

Jak dodać niestandardową wiadomość kasy?

W tej sekcji dowiesz się, jak wyświetlać niestandardowy komunikat na stronie kasy. Najpierw w panelu przejdź do Strony > Kasa .

Tutaj możesz modyfikować zawartość strony i wyświetlać niestandardowe komunikaty, dodawać multimedia i wiele więcej. Domyślnie strona kasy zawiera krótki kod kasy WooCommerce.

Jeśli chcesz wyświetlić niestandardową wiadomość przed i po polach kasy, możesz użyć bloku akapitu. W tej demonstracji dodamy jeden blok akapitu przed i kolejny po shortcode kasy. Po prostu nazwiemy je „przed treścią” i „po treści”.

Po zaktualizowaniu strony spójrz na stronę kasy z interfejsu, a zobaczysz niestandardowe wiadomości, które właśnie dodaliśmy.

Podobnie możesz dodać dowolny rodzaj treści, taki jak obrazy, niestandardowe wiadomości, kody kuponów i inne do strony kasy.

Jak zmienić pozycję komunikatu o błędzie?

Domyślnie WooCommerce wyświetla komunikaty o błędach po lewej stronie. Dobrą wiadomością jest to, że możesz to zmienić za pomocą odrobiny CSS. W tej sekcji pokażemy, jak zmienić pozycję komunikatu o błędzie za pomocą fragmentu kodu CSS.

Najpierw zaloguj się do pulpitu administracyjnego WordPress i przejdź do Wygląd > Dostosuj .

Otwórz Customizer i przejdź do sekcji Dodatkowy CSS .

Tutaj możesz dodać swoje fragmenty kodu CSS. Konfigurator WordPress wyświetli zmiany w sekcji podglądu na żywo, dzięki czemu możesz zobaczyć każdą aktualizację w czasie rzeczywistym.

Po prostu skopiuj ten fragment kodu i wklej go do kreatora.

 formularz.zamówienie {
 -ms-flex-wrap: zawijaj;
 flex-wrap: owijka;
 }

 .woocommerce-NoticeGroup-do kasy {
 -webkit-box-flex: 1;
 -ms-flex: 1 1 100%;
 elastyczność: 1 1 100%;
 maksymalna szerokość: 100%;
 szerokość: 100%;
 margines-dolny: 40px;
 margines górny:20px;
 }

 .woocommerce-NoticeGroup-checkout ul.woocommerce-error {
 pozycja: względna;
 góra:auto;
 dół: auto;
 lewo:auto;
 prawo:auto;
 dopełnienie-prawo: 30px;
 indeks z: auto;
 kursor: domyślny;
 -ms-transformacja: brak;
 transformacja: brak;
 -transformacja webkit: brak;
 animacja: brak;
 -webkit-animacja: brak;
 }

 .woocommerce-NoticeGroup-checkout ul.woocommerce-error:after {
 zawartość: brak;
 }

 .woocommerce-NoticeGroup-checkout ul.woocommerce-error.hidden-notice {
 animacja: brak;
 -webkit-animacja: brak;
 }

W tym przypadku dajemy wiadomości margines 40 pikseli na dole, 20 pikseli na górze, 30 pikseli dopełnienia po prawej i 100% szerokości. Dostosuj te wartości zgodnie ze swoimi preferencjami i pamiętaj o zapisaniu zmian.

Bonus: Jak ukryć błędy WooCommerce

Zanim zakończymy ten przewodnik, spójrzmy na inną alternatywę. Co jeśli zamiast zmieniać komunikaty o błędach w kasie WooCommerce, chcesz ukryć komunikaty o błędach? Jeśli tak jest w Twoim przypadku, ta sekcja jest dla Ciebie. Pokażemy Ci, jak usunąć błędy za pomocą odrobiny kodu.

Ponieważ będziemy edytować niektóre podstawowe pliki, utwórz pełną kopię zapasową witryny i użyj motywu podrzędnego, jeśli jeszcze go nie masz.

Aby ukryć błędy, dostosowujemy plik wp-config.php . Najpierw zalecamy pobranie kopii pliku wp-config.php na komputer lokalny, aby mieć kopię zapasową, którą można przywrócić w razie potrzeby.

Istnieje kilka sposobów na dostęp do podstawowych plików WordPress. W tym demo użyjemy dedykowanej wtyczki o nazwie Menedżer plików. Najpierw na pulpicie przejdź do Wtyczki> Dodaj nowy i wyszukaj Menedżera plików. Po znalezieniu wtyczki zainstaluj ją i aktywuj w swojej witrynie.

Po aktywacji zobaczysz konfigurację wtyczki po lewej stronie. Poszukaj pliku wp-config.php .

Kliknij plik prawym przyciskiem myszy i wybierz opcję Edytor kodu .

W środku pliku zobaczysz jeden z następujących wierszy:

 define('WP_DEBUG', prawda);

lub

 define('WP_DEBUG', fałsz); 

Gdy go znajdziesz, zastąp ten wiersz następującym kodem i zapisz plik:

 ini_set('display_errors','Off');
 ini_set('raportowanie_błędów', E_ALL );
 define('WP_DEBUG', fałsz);
 define('WP_DEBUG_DISPLAY', fałsz);

Kod wyłączy wszystkie komunikaty o błędach.

Otóż ​​to! Od teraz Twój sklep nie będzie wyświetlał żadnych komunikatów o błędach.

Więcej sposobów na dostosowanie kasy

Na koniec zobaczmy inne sposoby dalszego dostosowywania płatności WooCommerce.

Dodaj niestandardowe pola do kasy

W tej sekcji pokażemy, jak dodać niestandardowe pola do strony kasy.

Jak możesz sobie wyobrazić, możesz dodać wiele różnych typów pól. Na potrzeby tej demonstracji dodamy niestandardowe pole wyboru na końcu strony kasy, aby dać kupującym możliwość subskrypcji biuletynu i zbudowania listy e-mailowej.

Po prostu wklej następujący skrypt do pliku functions.php motywu potomnego:

 // pole wyboru
add_action( 'woocommerce_after_order_notes', 'quadlayers_subscribe_checkout' );

function quadlayers_subscribe_checkout( $checkout ) {
woocommerce_form_field( 'subskrybent', tablica(
'typ' => 'pole wyboru',
//'wymagane' => prawda,
'class' => array('custom-field form-row-wide'),
'label' => ' Zapisz się do naszego newslettera.'
), $checkout->get_value( 'subskrybent' ) );
}

Jak widać, obok pola wyboru dodaliśmy etykietę „Zapisz się do naszego newslettera” . Możesz to potraktować jako bazę i dostosować do swojego sklepu.

Ustaw pola opcjonalne

Inną interesującą opcją jest uczynienie obowiązkowych pól opcjonalnymi. W ten sposób zmusisz kupujących do wypełnienia tylko tych pól, które są niezbędne do transakcji. W ten sposób przyspieszasz proces realizacji transakcji i poprawiasz wrażenia klientów.

Jeśli na przykład sprzedajesz produkty wirtualne, możesz uczynić pole Adres w sekcji Płatności opcjonalnym, wklejając następujący kod do pliku functions.php motywu podrzędnego.

 add_filter( 'woocommerce_billing_fields', 'wc_address_field_optional');
funkcja wc_address_field_opcjonalne ( $ pola ) {
$fields['billing']['billing_address_1']['required'] = false; 
zwróć $pola; 
}

Aby uzyskać więcej informacji na ten temat, zapoznaj się z naszym przewodnikiem, aby dostosować kasę WooCommerce.

Wniosek

Podsumowując, edytując powiadomienia o kasie, możesz dodać kolejną warstwę dostosowywania do swojej kasy i wyróżnić się na tle konkurencji.

W tym przewodniku widzieliśmy dwa główne sposoby zmiany komunikatów o błędach w kasie WooCommerce: za pomocą dedykowanej wtyczki i programowo z odrobiną kodu. Korzystanie z wtyczki jest dobrą alternatywą dla tych, którzy nie mają umiejętności kodowania lub wolą dostosowywać swoje sklepy za pomocą kilku kliknięć.

Z drugiej strony, jeśli masz wiedzę programistyczną i nie chcesz instalować więcej wtyczek, możesz zakodować własne rozwiązanie. Daje to znacznie większą elastyczność i pozwala robić wszystko, co chcesz. Pamiętaj, aby wkleić fragment kodu do motywu podrzędnego, aby nie stracić dostosowania po zaktualizowaniu motywu nadrzędnego.

Mamy nadzieję, że ten artykuł okazał się pomocny i dowiedziałeś się, jak zmienić komunikaty o błędach w kasie WooCommerce. Jeśli tak, udostępnij ten post znajomym w mediach społecznościowych.

Więcej interesujących artykułów znajdziesz w tych postach:

• Jak zmienić tekst Przejdź do kasy
• Najlepsze wtyczki do kasy WooCommerce
• Jak tworzyć bezpośrednie linki do kasy w WooCommerce