Licznik zapasów na stronie produktu WooCommerce – jak go dodać?
Objaśnienie
Aby wyświetlić licznik zapasów na stronie produktu WooCommerce, ten kod działa doskonale. Pokazuje, ile przedmiotów jest dostępnych w magazynie bezpośrednio na stronie produktu, co ułatwia klientom sprawdzenie dostępności.
- Sprawdzenie zapasów: Kod najpierw sprawdza, czy produkt jest dostępny w magazynie. Jeśli nie, nic nie jest wyświetlane.
- Wyświetlanie ilości: Jeśli są dostępne przedmioty, wyświetla komunikat, na przykład "Dostępne: 5". Jeśli nie ma już przedmiotów, pokazuje "Brak w magazynie".
- Gdzie się pojawia: Informacja ta jest dodawana do sekcji podsumowania produktu na stronie produktu.
- Ładowanie skryptu: Skrypt jest ładowany tylko na stronach pojedynczych produktów, aby zapewnić płynne działanie.
- Sprawdzenie WooCommerce: Kod sprawdza, czy WooCommerce jest aktywne przed uruchomieniem, co zapewnia, że nie spowoduje błędów, jeśli WooCommerce nie jest zainstalowane.
Dzięki temu ustawieniu możesz łatwo informować swoich klientów o dostępności produktów, co poprawia ich doświadczenia zakupowe na Twojej stronie.
Kod
// Add inventory counter to WooCommerce product page
function wp_dudecom_display_stock_quantity() {
global $product;
if ( ! $product->is_in_stock() ) {
return;
}
$stock_quantity = $product->get_stock_quantity();
if ( $stock_quantity > 0 ) {
echo '<p class="stock in-stock">' . sprintf( __( 'In stock: %s', 'woocommerce' ), $stock_quantity ) . '</p>';
} else {
echo '<p class="stock out-of-stock">' . __( 'Out of stock', 'woocommerce' ) . '</p>';
}
}
add_action( 'woocommerce_single_product_summary', 'wp_dudecom_display_stock_quantity', 20 );
// Ensure the function is only executed on single product pages
function wp_dudecom_enqueue_stock_quantity_script() {
if ( is_product() ) {
wp_enqueue_script( 'wp-dudecom-stock-quantity', get_template_directory_uri() . '/js/stock-quantity.js', array( 'jquery' ), null, true );
}
}
add_action( 'wp_enqueue_scripts', 'wp_dudecom_enqueue_stock_quantity_script' );
// Security best practices: Ensure the function is only executed in the WooCommerce context
function wp_dudecom_check_woocommerce_active() {
if ( ! class_exists( 'WooCommerce' ) ) {
return;
}
add_action( 'woocommerce_single_product_summary', 'wp_dudecom_display_stock_quantity', 20 );
}
add_action( 'init', 'wp_dudecom_check_woocommerce_active' );
Instrukcja
Aby dodać licznik zapasów do strony produktu WooCommerce, wykonaj następujące kroki:
Lokalizacja pliku: Musisz dodać kod do pliku functions.php
swojego motywu lub do pliku własnej wtyczki.
Wymagania wstępne:
- Upewnij się, że WooCommerce jest zainstalowane i aktywne na Twojej stronie WordPress.
Kroki implementacji:
- Uzyskaj dostęp do panelu administracyjnego WordPress.
- Przejdź do Wygląd > Edytor motywu, jeśli edytujesz plik
functions.php
, lub przejdź do Wtyczki > Edytor, jeśli korzystasz z własnej wtyczki. - Znajdź i otwórz plik
functions.php
aktywnego motywu lub plik własnej wtyczki. - Skopiuj i wklej podany kod do pliku.
- Zapisz zmiany w pliku.
- Upewnij się, że plik
stock-quantity.js
jest dostępny w katalogujs
Twojego motywu. Jeśli nie, utwórz plik zastępczy lub dostosuj kolejność ładowania skryptu w razie potrzeby. - Odwiedź stronę produktu na swojej stronie, aby zweryfikować, że licznik zapasów jest wyświetlany poprawnie.
Postępując zgodnie z tymi krokami, pomyślnie wyświetlisz licznik zapasów na stronach produktów WooCommerce, co poprawi doświadczenia zakupowe Twoich klientów.
Jeśli potrzebujesz dalszej pomocy lub chcesz wdrożyć bardziej zaawansowane funkcje, rozważ skontaktowanie się z wp-dude.com w celu uzyskania fachowej pomocy.