Kategoria WooCommerce to zbiór różnych mini-porad oraz wpisów instruktażowych związanych z jednym z najpopularniejszych otwartych e-commerców (obok Magento, PrestaShop), a na pewno najpopularniejszym na WordPressie. Tak będzie i dzisiaj, krótki poradnik jak zmienić tekst w polu “Uwagi do zamówienia“.
Dlaczego, po co?
Na jednym z sklepów, który serwisujemy i obsługujemy jest możliwość wyboru metody wysyłki “Paczkomat”, niestety klient nie posiada jeszcze umowy partnerskiej z InPostem, dlatego nie da się zintegrować sklepu z InPostem. Do czasu uzyskania ID partnera InPost, aby ułatwić obsłudze sklepu ręczne nadawanie paczek do paczkomatów, potrzebujemy uzyskać od klienta informację o adresie lub numerze paczkomatu.
Dlatego już na podstronie koszyka pod metodą wysyłki “Paczkomat 24/7 InPost” widnieje dodatkowa informacja: “Prosimy po wyborze w “dodatkowych uwagach” podać adres lub nr paczkomatu.”

Taki opis bez problemu, bez dodatkowego kodowania ustawiamy w kokpicie WordPress. Po zalogowaniu wybieramy WooCommerce > Ustawienia > Wysyłka, a następnie wybieramy konkretną metodę wysyłki i dodajemy opis.

Jak zmienić tekst “Uwagi do zamówienia” na podstronie Zamówienie?
Aby ponownie przypomnieć klientowi o podaniu tej informacji wykorzystujemy do tego pole “Uwagi do zamówienia” na kolejnej podstronie po Koszyku, czyli “Zamówienie”. Standardowo druga kolumna na tej podstronie wygląda następująco:

Za pomocą poniższego kodu możemy dostać się do pól label oraz placeholder w “woocommerce_checkout_fields“. Odpowiednio zmodyfikuj tekst i wklej poniższy kod w pliku functions.php w motywie potomnym.
/* Change order comments on checkout */
function wplab_change_order_comments( $fields )
{
$fields['order']['order_comments']['placeholder'] = 'Podaj informacje niezbędne dla kuriera, adres lub nr paczkomatu (jeśli wybrałeś wysyłkę do paczkomatu) itp.';
$fields['order']['order_comments']['label'] = 'Uwagi do zamówienia';
return $fields;
}
add_filter( 'woocommerce_checkout_fields', 'wplab_change_order_comments' );
Po wgraniu pliku na serwer, na podstronie Zamówienie “Uwagi do zamówienia” będą wyglądać następująco:

Dodatkowo możemy jeszcze ostylować pole tekstowe np. zmienić kolor tła, dodać kolorowe obramowanie, większy font itd. Dostosuj wedle uznania poniższy kod i wklej go do pliku z stylami (pewnie będzie to style.css lub theme.css) w motywie potomnym.
body.woocommerce-checkout p#order_comments_field textarea {
min-height: 70px;
padding: 1rem;
}
Po nadpisaniu style.css pole wygląda już o wiele lepiej!

To by było na tyle! Jeśli masz jakiś problem z powyższym kodem daj znać bezpośrednio na hello@wp-lab.pl.