Wtyczka WooCommerce jest świetnym narzędziem do szybkiego stworzenia własnego sklepu online. Po pierwsze jest ona darmowa i rozwijana na licencji open source. Po drugie jest prosta w instalacji, konfiguracji, a także w późniejszym użytkowaniu. Niestety wtyczka ma też wadę. Wtyczka WooCommerce jest obecnie rozwijana przez Automattic. Ponieważ nie jest to polska firma, we wtyczce nie przewidziano możliwości wprowadzenia numeru NIP podczas składania zamówienia przez Klienta. W poradniku tym pokażę prosty sposób jak dodać pole NIP w WooCommerce. I co najważniejsze bez użycia dodatkowej wtyczki!
Spis treści
Pole NIP jest ważne
Możliwość wpisania numeru NIP jest bardzo ważna i powinna być w każdym sklepie internetowym. Numer NIP jest potrzebny do wystawienia faktury. Klient powinien mieć możliwość otrzymania odpowiedniej faktury za swoje zamówienie, by móc się za nie rozliczyć.
Jak dodać pole NIP w WooCommerce
Przedstawione przeze mnie rozwiązanie nie wymaga użycia wtyczki. Wszystkie zmiany wprowadzimy w pliku functions.php. Plik ten znajdziesz w folderze ze swoim motywem: wp-content -> themes -> functions.php. Skopiuj plik na dysk komputera i otwórz w dowolnym edytorze.
Pole NIP musimy dodać w trzech miejscach:
- na stronie z formularzem zamówienia,
- w panelu administratora,
- w powiadomieniach mailowych.
Dodajemy pole NIP do formularza zamówienia
Dodaj poniższy blok kodu do pliku functions.php. W formularzu zamówienia pojawi się dodatkowe pole typu input na numer NIP.
add_filter( 'woocommerce_checkout_fields' , 'fanka_kodowania_add_NIP_to_checkout_page' );
function fanka_kodowania_add_NIP_to_checkout_page( $fields ) {
$fields['billing']['nip_number'] = array(
'label' => 'Numer NIP',
'placeholder' =>'Jeśli chcesz otrzymać fakturę, podaj swój numer NIP',
'class' => array( 'form-row-wide') ,
'priority' => $fields['billing']['billing_company']['priority'] + 1,
);
return $fields;
}
Powyższy kod możesz dostosować do swoich potrzeb edytując informacje takie jak:
- ’label’ => 'Numer NIP’ (W tym miejscu możesz zmienić etykietę pola.)
- ’placeholder’ =>’Jeśli chcesz otrzymać fakturę, podaj swój numer NIP’ (W tym miejscu możesz zmienić tekst wyświetlający się jako podpowiedź. UWAGA: Jeśli chcesz całkowicie usunąć podpowiedź, skasuj całąlinijkę 'placeholder’ =>’…’)
Zapisujemy dane z formularza
Pole na numer NIP jest już widoczne w formularzu zamówienia, ale wpisane dane nie są jeszcze zapisywane. Dodaj poniższy fragment kodu, żeby numer był zapisywany:
add_action( 'woocommerce_checkout_update_order_meta', 'fanka_kodowania_save_NIP' );
function fanka_kodowania_save_NIP( $order_id ) {
if ( ! empty( $_POST['nip_number'] ) ) {
update_post_meta( $order_id, 'nip_number', sanitize_text_field( $_POST['nip_number'] ) );
}
}
Dodajemy pole NIP do panelu administratora
Numer NIP musi być także widoczny w panelu WooCommerce na podglądzie zamówienia. W tym celu należy dodać poniższy kod do pliku functions.php.
add_action( 'woocommerce_admin_order_data_after_billing_address', 'fanka_kodowania_add_NIP_to_admin_area', 10, 1 );
function fanka_kodowania_add_NIP_to_admin_area( $order ) {
echo '<p><strong>' . __( 'Numer NIP', 'woocommerce' ) . ':</strong> ' . get_post_meta( $order->id, 'nip_number', true ) . '</p>';
}
Dodajemy pole NIP do powiadomień mailowych
Dodaj poniższy kod do pliku functions.php.
add_filter( 'woocommerce_email_order_meta_keys', 'fanka_kodowania_add_NIP_to_emails' );
function fanka_kodowania_add_NIP_to_emails( $keys ) {
$keys['Numer NIP'] = 'nip_number';
return $keys;
}
Cały kod ma postać
/**
* Dodajemy pole NIP do formularza zamówienia
*/
add_filter( 'woocommerce_checkout_fields' , 'fanka_kodowania_add_NIP_to_checkout_page' );
function fanka_kodowania_add_NIP_to_checkout_page( $fields ) {
$fields['billing']['nip_number'] = array(
'label' => 'Numer NIP',
'placeholder' =>'Jeśli chcesz otrzymać fakturę, podaj swój numer NIP',
'class' => array( 'form-row-wide') ,
'priority' => $fields['billing']['billing_company']['priority'] + 1,
);
return $fields;
}
/**
* Zapisujemy dane z formularza
*/
add_action( 'woocommerce_checkout_update_order_meta', 'fanka_kodowania_save_NIP' );
function fanka_kodowania_save_NIP( $order_id ) {
if ( ! empty( $_POST['nip_number'] ) ) {
update_post_meta( $order_id, 'nip_number', sanitize_text_field( $_POST['nip_number'] ) );
}
}
/**
* Dodajemy pole NIP do panelu administratora
*/
add_action( 'woocommerce_admin_order_data_after_billing_address', 'fanka_kodowania_add_NIP_to_admin_area', 10, 1 );
function fanka_kodowania_add_NIP_to_admin_area( $order ) {
echo '<p><strong>' . __( 'Numer NIP', 'woocommerce' ) . ':</strong> ' . get_post_meta( $order->id, 'nip_number', true ) . '</p>';
}
/**
* Dodajemy pole NIP do powiadomień mailowych
*/
add_filter( 'woocommerce_email_order_meta_keys', 'fanka_kodowania_add_NIP_to_emails' );
function fanka_kodowania_add_NIP_to_emails( $keys ) {
$keys['Numer NIP'] = 'nip_number';
return $keys;
}
Jak dodać pole NIP w WooCommerce – podsumowanie
Jak widzisz, dodanie pola NIP do WooCommece nie jest trudną czynnością i można ją wykonać bez użycia dodatkowej wtyczki. Jeśli jednak masz problemy, czy wątpliwości, daj znać w komentarzu 😉
Hej, bardzo fajna instrukcja. Dziękuję 🙂 Chciałabym jeszcze wiedzieć, co zrobić, żeby NIP drukował się na fakturze. Pozdrawiam.
Cieszę się, dziękuję 😉 Jaka wtyczka do faktur jest zainstalowana w sklepie?
Dane wyświetlają się trochę „dziko”, ale całe know-how bardzo pomocne. Bardzo dziękuję!
Cieszę się, że artykuł jest pomocny 🙂
Dzięki za tę instrukcję! 🙂
Cieszę się, że pomogłam 😉
Hej, dzięki wielkie, artykuł bardzo pomocny!
Mam jeszcze tylko pytanie, w jaki sposób mogę dodać NIP na stronie, po opłaceniu zamówienia przez klienta, gdzie prezentują się dane z podsumowaniem całego zamówienia (checkout/order-received)? Tylko tam mi tego brakuje do pełni szczęścia 🙂
W najbliższym czasie planuję zaktualizować artykuł. Pozdrawiam 🙂
Świetny artykuł Moniko! Mam do Ciebie pytanie: Jaką darmową wtyczkę do prostego fakturowania wybrać, aby NIP drukował się również na fakturze?
Nie znam się na kodzie, a mimo to sobie poradziłem. Bardzo dziękuję.
Super, cieszę się 🙂
Hej, chyba wyszło, dzięki 🙂 ale nie mogłam znależć folderu wp-config a jedynie wp-content/themes, mam motyw potomny, więc w niego weszłam i stamtąd skopiowałam plik functions.php. Czy dobrze zrobiłam?
Oczywiście to był mój błąd, chodziło mi o folder wp-content. Już to poprawiłam. Dziękuję! 🙂
A, ok 🙂
Chciałabym zrobić dodatkowe pole, np „Podaj nazwę”. Czy mogę wykorzystać ten kod? Co jeszcze muszę pozmieniać prócz „label” i „placeholder”? Próbowałam zdublować ten kod, zmieniając tylko label i placeholder, ale pojawiały mi się błędy np w wierszu 55
Wszystko poszło dobrze i dzięki wielkie za ten kod ale jest jeszcze jedno miejsce gdzie NIP by się przydał. Chodzi o profil użytkownika po zalogowaniu w adresie rozliczeniowym.
Pole wyświetla się w panelu zamówień, ale nie można go tam edytować tak jak pozostałe pola lub w przypadku gdy ręcznie wprowadzamy zamówienie. Jest sposób by można było ręcznie wpisać NIP z pozycji „dodaj zamówienie”
Niestety w tym rozwiązaniu nie można edytować tego pola, ale na pewno jest to ważna brakująca funkcjonalność. W wolnej chwili postaram się zaktualizować artykuł.
W nowym widoku zamówienia w WooCommerce (zwanym również „Checkout Block” lub „Full Site Editing” w motywach opartych na blokach) powyższe kody nie trybią. Próbowałem:
function dodaj_pole_vat_do_block_checkout() {
?>
<div class=”wc-block-components-address-form”>
<div class=”wc-block-components-text-input wc-block-components-address-form__vat”>
<input type=”text” id=”vat_number” name=”vat_number” autocapitalize=”sentences” autocomplete=”off” aria-label=”<?php _e(’Numer VAT’, 'woocommerce’); ?>” aria-invalid=”false” title=”<?php _e(’Podaj swój numer VAT’, 'woocommerce’); ?>” value=”<?php echo esc_attr(isset($_POST[’vat_number’]) ? $_POST[’vat_number’] : ”); ?>” />
<label for=”vat_number”><?php _e(’Numer VAT’, 'woocommerce’); ?></label>
</div>
</div>
<?php
}
add_action(’woocommerce_blocks_checkout_billing’, 'dodaj_pole_vat_do_block_checkout’);
ale ni chu.a ;/
Ciężko jest mi pomóc bez dostępu do WordPressa, ale można użyć tej wtyczki: https://pl.wordpress.org/plugins/flexible-checkout-fields/
Na pewno to rozwiązanie zadziała 😉
No właśnie chłopaki z WpDesku pracują nad rozwiązaniem aby ich wtyczka również zadziałała dla woocommerce_blocks – póki co ich wtyczka nie jest kompatybilna z tym widokiem (a szkoda, bo robi się top w popularności gotowego schematu formularza).