Wie implementiert man dynamische Gebührenanpassungen basierend auf der Auswahl von Optionsfeldern im WooCommerce-Checkout?

Gebühr dynamisch basierend auf Optionsfeldern im WooCommerce-Checkout aktualisieren

Einführung

Verbessern Sie Ihr WooCommerce-Checkout-Erlebnis, indem Sie dynamische Gebührenaktualisierungen basierend auf der Auswahl von Optionsfeldern aktivieren . Dadurch können Sie unterschiedliche Verpackungsoptionen und Gebühren anbieten und so auf die Vorlieben der Kunden eingehen.

Code-Implementierung

Implementieren Sie den folgenden Code in Ihrer Datei „functions.php“, um die gewünschte Funktionalität zu erreichen:

<code class="php">// Add a custom dynamic packaging fee
add_action( 'woocommerce_cart_calculate_fees', 'add_packaging_fee', 20, 1 );
function add_packaging_fee( $cart ) {
    if ( is_admin() &amp;&amp; ! defined( 'DOING_AJAX' ) )
        return;

    $packing_fee = WC()->session->get( 'chosen_packing' ); // Dynamic packing fee
    $fee = $packing_fee === 'box' ? 9.00 : 3.00;
    $cart->add_fee( __( 'Packaging fee', 'woocommerce' ), $fee );
}

// Add a custom radio fields for packaging selection
add_action( 'woocommerce_review_order_after_shipping', 'checkout_shipping_form_packing_addition', 20 );
function checkout_shipping_form_packing_addition() {
    $domain = 'woocommerce';

    echo '<tr class="packing-select"><th>' . __('Packing options', $domain) . '</th><td>';

    $chosen   = WC()->session->get('chosen_packing');
    $chosen   = empty($chosen) ? WC()->checkout->get_value('radio_packing') : $chosen;
    $chosen   = empty($chosen) ? 'bag' : $chosen;

    // Add a custom checkbox field
    woocommerce_form_field( 'radio_packing', array(
        'type' => 'radio',
        'class' => array( 'form-row-wide packing' ),
        'options' => array(
            'bag' => __('In a bag '.wc_price(3.00), $domain),
            'box' => __('In a gift box '.wc_price(9.00), $domain),
        ),
        'default' => $chosen,
    ), $chosen );

    echo '</td></tr>';
}</code>

JavaScript und AJAX-Skript

Um nahtlose Aktualisierungen bei der Auswahl von Optionsfeldern zu gewährleisten, implementieren Sie dieses JavaScript- und AJAX-Skript:

<code class="javascript">// jQuery - Ajax script
add_action( 'wp_footer', 'checkout_shipping_packing_script' );
function checkout_shipping_packing_script() {
    if ( ! is_checkout() )
        return; // Only checkout page
    ?>
    <script type="text/javascript">
    jQuery( function($){
        $('form.checkout').on('change', 'input[name=radio_packing]', function(e){
            e.preventDefault();
            var p = $(this).val();
            $.ajax({
                type: 'POST',
                url: wc_checkout_params.ajax_url,
                data: {
                    'action': 'woo_get_ajax_data',
                    'packing': p,
                },
                success: function (result) {
                    $('body').trigger('update_checkout');
                    console.log('response: '+result); // just for testing | TO BE REMOVED
                },
                error: function(error){
                    console.log(error); // just for testing | TO BE REMOVED
                }
            });
        });
    });
    </script>
    <?php

}

// Php Ajax (Receiving request and saving to WC session)
add_action( 'wp_ajax_woo_get_ajax_data', 'woo_get_ajax_data' );
add_action( 'wp_ajax_nopriv_woo_get_ajax_data', 'woo_get_ajax_data' );
function woo_get_ajax_data() {
    if ( isset($_POST['packing']) ){
        $packing = sanitize_key( $_POST['packing'] );
        WC()->session->set('chosen_packing', $packing );
        echo json_encode( $packing );
    }
    die(); // Alway at the end (to avoid server error 500)
}</code>

Notizen

• Stellen Sie sicher, dass dieser Code zu einem aktiven untergeordneten Theme oder direkt zur Datei „functions.php“ Ihres Themes hinzugefügt wird.
• Der bereitgestellte Code berücksichtigt nicht angemeldete Benutzer und ist mit der neuesten WooCommerce-Version (3.7.x) kompatibel. .
• Wenn Probleme auftreten, entfernen Sie alle vorherigen Anpassungen im Zusammenhang mit Optionsfeldern und Verpackungsoptionen.

Das obige ist der detaillierte Inhalt vonWie implementiert man dynamische Gebührenanpassungen basierend auf der Auswahl von Optionsfeldern im WooCommerce-Checkout?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!