...

Ten kod dodaje pole wyboru (checkbox) do strony zamówienia w sklepie opartym na WooCommerce (WordPress). Głównym celem tego checkboxa jest wymaganie od klientów zaakceptowania odpowiedniej dyrektywy, z którą chcemy aby klient się zapoznał przed złożeniem zamówienia. Kod składa się z dwóch części: pierwsza tworzy i dodaje pole wyboru, a druga zapewnia walidację checkboxa za pomocą JavaScript.

// Dodaj chackbox do strony z zamówieniem
add_action('woocommerce_after_order_notes', 'custom_checkbox_field');

function custom_checkbox_field($checkout)
{
    // Sprawdź, czy w koszyku są produkty o podanym ID
    $product_ids = array(//Tu wpisujesz ID swoich produktów//);
    $display_checkbox = false;

    foreach (WC()->cart->get_cart() as $cart_item) {
        if (in_array($cart_item['product_id'], $product_ids)) {
            $display_checkbox = true;
            break;
        }
    }

    // Jeśli żaden z produktów nie jest w koszyku, nie wyświetlaj chackboxa
    if (!$display_checkbox) {
        return;
    }

    echo '<div id="custom-checkbox-error" class="woocommerce-error" style="display:none;">Błąd: Zaznacz checkbox.</div>';

    woocommerce_form_field('custom_checkbox', array(
        'type' => 'checkbox',
        'class' => array('form-row-wide'),
        'label' => '//Tu wpisujesz treść swojego komunikatu//',
        'required' => true,
    ), $checkout->get_value('custom_checkbox'));
}

// Dodaj walidację chackboxa za pomocą JavaScript
add_action('wp_footer', 'custom_checkbox_validation_js');

function custom_checkbox_validation_js()
{
    if (!is_checkout()) {
        return;
    }
    ?>
    <script type="text/javascript">
        (function ($) {
            $(document).ready(function () {
                var errorMessage = $('#custom-checkbox-error');

                $('form.checkout').on('checkout_place_order', function () {
                    var isChecked = $('input[name="custom_checkbox"]').is(':checked');
                    if (!isChecked) {
                        errorMessage.show();
                        return false;
                    } else {
                        errorMessage.hide();
                        return true;
                    }
                });

                $('input[name="custom_checkbox"]').on('change', function () {
                    if ($(this).is(':checked')) {
                        errorMessage.hide();
                    } else {
                        errorMessage.show();
                    }
                });
            });
        })(jQuery);
    </script>
    <?php
}
  1. Dodanie pola wyboru do strony zamówienia:
    Funkcja custom_checkbox_field jest wywoływana przy użyciu add_action('woocommerce_after_order_notes', 'custom_checkbox_field');. Sprawdza ona, czy produkty o podanym ID znajdują się w koszyku klienta. Jeśli tak, to dodaje pole wyboru (checkbox) do strony zamówienia.

  2. Wyświetlenie błędu, gdy checkbox nie jest zaznaczony:
    Kod HTML z <div> zawierający wiadomość o błędzie jest wyświetlany tylko wtedy, gdy klient nie zaznaczy checkboxa. Domyślnie jest ukryty (style="display:none;").

  3. Dodanie walidacji checkboxa za pomocą JavaScript:
    Funkcja custom_checkbox_validation_js jest wywoływana przy użyciu add_action('wp_footer', 'custom_checkbox_validation_js');. Sprawdza ona, czy klient zaznaczył checkbox. Jeśli nie, to blokuje złożenie zamówienia i wyświetla wiadomość o błędzie. Jeśli checkbox jest zaznaczony, to wiadomość o błędzie zostaje ukryta, a zamówienie może być złożone.

Nie znalazłeś funkcji, która Cię interesuje?
Napisz do mnie.

Zostaw komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *