Woocommerce: Jak przenieść pole e-mail na górę formularza zamówienia

Wstęp

Jeśli korzystasz z WooCommerce, być może zastanawiałeś się, jak przenieść pole e-mail na samą górę formularza zamówienia. Dlaczego? Pole e-mail jest kluczowe – pozwala na szybki kontakt z klientem i przesyłanie informacji o zamówieniu. Przeniesienie go na górę formularza może poprawić UX (user experience) i zwiększyć prawdopodobieństwo, że klient poprawnie je wypełni. Sposób, który pokaże będzie kilkoma linijkami kodu i nie będzie polegał na zainstalowaniu kolejnej wtyczki ;D

W tym wpisie pokażę Ci, jak w kilku prostych krokach wprowadzić tę zmianę, nawet jeśli nie jesteś WordPress deweloperem.

Fragment kodu PHP – Przeniesienie pola e-mail

add_filter( 'woocommerce_billing_fields', 'so_move_checkout_email_field' );
function so_move_checkout_email_field( $address_fields ) {
    $address_fields['billing_email']['priority'] = 1;
    return $address_fields;
}

Gdzie dodać kod PHP?

Najlepszym i najbezpieczniejszym miejscem na dodanie kodu PHP jest plik functions.php w motywie potomnym. Dlaczego motyw potomny? Dzięki temu Twoje zmiany nie zostaną nadpisane podczas aktualizacji motywu głównego. Aby to zrobić:

1. Utwórz motyw potomny, jeśli jeszcze go nie masz (poradnik już niedługo).

2. Otwórz plik functions.php motywu potomnego i wklej kod na jego końcu.

3. Zapisz zmiany i gotowe!

Jeśli jednak nie chcesz tworzyć motywu potomnego lub obawiasz się, że coś może pójść nie tak, możesz skorzystać z dedykowanych wtyczek, takich jak Code Snippets. Wtyczka ta pozwala na bezpieczne dodawanie kodu PHP bez konieczności ingerowania w pliki motywu.

Jak to zrobić za pomocą Code Snippets?

1. Zainstaluj i aktywuj wtyczkę Code Snippets.

2. Przejdź do sekcji Snippets w panelu WordPress i kliknij „Dodaj nowy”.

3. Wklej kod PHP, nadaj snippetowi nazwę, a następnie zapisz i aktywuj.

Oba rozwiązania będą tak samo skuteczne – wybierz to, które będzie dla Ciebie wygodniejsze! ?

Podsumowanie

Przeniesienie pola e-mail na górę formularza zamówienia to mała zmiana, która może znacząco poprawić proces zakupowy w Twoim sklepie WooCommerce. Wystarczy kilka linijek kodu, a Twoi klienci będą mieli łatwiejszy dostęp do kluczowego dla zamówienia pola.

Jeśli masz pytania lub problemy – daj znać w komentarzu lub napisz bezpośrednio do mnie na instagramie lub pocztę!