На странице проверки доставки Woocommerce сначала указывается адрес доставки, а затем адрес выставления счета?

На странице проверки Woocommerce мне нужно изменить функциональность адресных средств, сначала мне нужны поля адреса доставки, а затем поля адреса фактуры.

Сначала отображается биллинг, а затем доставка отображается, если флажок установлен, как показано ниже, см. изображение.

Сначала адрес фактуры

теперь мне нужно изменить его, как первый адрес доставки, когда я поставлю флажок, он показывает мне платежный адрес. см. ниже изображение.

Первый адрес доставки

Мне нужно это изменение без изменения каких-либо файлов файлов woocommerce в папке с темами, также необходима проверка и эффект jquery.

Может ли какой-нибудь plz помочь мне сделать это?

заранее спасибо

фрагменты кода: это не решение, поэтому plz не записывает это, потому что он меняет место, а не функциональность и флажок. plz см. снимок экрана, который я пишу.

Сначала адрес фактуры

<?php do_action( 'woocommerce_checkout_billing' ); ?>
<?php do_action( 'woocommerce_checkout_shipping' ); ?>

Первый адрес доставки

<?php do_action( 'woocommerce_checkout_shipping' ); ?>
<?php do_action( 'woocommerce_checkout_billing' ); ?>

все еще этот вопрос не решен, jquery не является хорошим решением для этого, потому что checkout запускается как ajax и validation. если у кого-то есть хорошее решение, тогда предоставляйте, чтобы другие могли помочь здесь.

Ответы

Ответ 1

Если вы используете дочернюю тему, это можно сделать легко.

ШАГОВ:

1) Скопируйте form-checkout.php из wp-content->plugins->woocommerce->templates->checkout и вставьте его внутри wp-content\themes\your_theme\woocommerce\myaccount.

2) Измените это

<div class="col2-set" id="customer_details">
     <div class="col-1">
          <?php do_action( 'woocommerce_checkout_billing' ); ?>
     </div>

      <div class="col-2">
           <?php do_action( 'woocommerce_checkout_shipping' ); ?>
       </div>
</div>

<div class="col2-set" id="customer_details">
     <div class="col-1">
          <?php do_action( 'woocommerce_checkout_shipping' ); ?>    
     </div>

      <div class="col-2">
           <?php do_action( 'woocommerce_checkout_billing' ); ?>               
       </div>
</div>

ПРИМЕЧАНИЕ. Это решение работает только с дочерней темой.

Ответ 2

Ваше требование было уникальным, сложным и сложным. Так что попробовал код для достижения цели.

Чтобы достичь такой функциональности, все кодирование было выполнено в jQuery, поэтому сначала убедитесь в том, что вы попытаетесь сделать то же самое в консоли, а затем после успешной работы того же кода добавьте код в любой js, который загружается на странице проверки или добавляет ваш js для страницы проверки.

jQuery('.shipping_address').css('display','block');

var bigHtml = jQuery(".woocommerce-billing-fields").children().not("h3, .create-account").detach();
var smallHtml = jQuery('.shipping_address').detach();
jQuery('.woocommerce-billing-fields').append(smallHtml);
jQuery('#order_comments_field').before(bigHtml);

jQuery('.woocommerce-billing-fields h3').text('Shipping Details');
jQuery('h3#ship-to-different-address').replaceWith('<h3 id="ship-to-billing-different-address"><label for="ship-to-billing-different-address-checkbox" class="checkbox">Ship to billing address?</label><input id="ship-to-billing-different-address-checkbox" class="input-checkbox" name="ship_to_different_billing_address" value="1" type="checkbox"></h3>');
jQuery(".woocommerce-shipping-fields").children().not("h3,#order_comments_field").hide();

jQuery("#ship-to-billing-different-address-checkbox").click(function(event) {
    if (jQuery(this).is(":checked"))
        jQuery(".woocommerce-shipping-fields").children().not("h3,#order_comments_field").show();
    else
        jQuery(".woocommerce-shipping-fields").children().not("h3,#order_comments_field").hide();
});

Я надеюсь, что мое время и работа, отправленные в этом выпуске, будут работать и выполнять ваши требования.

Ответ 3

Если вы уже знаете, как использовать шаблоны woocommerce, то самый простой способ сделать это без необходимости переделки всего кода бэкэнда и без необходимости переписывать jquery - это сделать копии трех шаблонов woocommerce для модификации. Это для модификации стандартных шаблонов woocommerce.

оформить заказ> form-checkout.php

оформить заказ> form-billing.php

оформить заказ> form-shipping.php

Изменения, которые необходимо внести в каждый шаблон:

оформить заказ> form-checkout.php

move <?php do_action( 'woocommerce_checkout_billing' );?> <?php do_action( 'woocommerce_checkout_billing' );?> в строке 40 в строку 44 и переместите <?php do_action( 'woocommerce_checkout_shipping' );?> <?php do_action( 'woocommerce_checkout_shipping' );?> от строки 44 до строки 40.

Теперь на двух других шаблонах произойдет обмен кода.

из оформления заказа> form-billing.php

в строке 29 изменить <?php _e( 'Billing & Shipping', 'woocommerce' );?> <?php _e( 'Billing & Shipping', 'woocommerce' );?> to <?php _e( 'Shipping & Billing', 'woocommerce' );?> <?php _e( 'Shipping & Billing', 'woocommerce' );?>

в строке 33 изменить <?php _e( 'Billing details', 'woocommerce' );?> <?php _e( 'Billing details', 'woocommerce' );?> to <?php _e( 'Shipping details', 'woocommerce' );?> <?php _e( 'Shipping details', 'woocommerce' );?>

Вот где происходит обмен кода:

Теперь обрежьте строки с 27 по 35 и вставьте их в оформление заказа> form-shipping.php в строке 25. Не теряйте свое место в строках оформления заказа> form-shipping.php. Вам нужно будет обрезать строки с 25 по 33 и вставить их в оформление заказа. > form-billing.php в строке 27.

ПРИМЕЧАНИЕ: это обмен кодами на обоих шаблонах

должно быть выше этого <?php do_action( 'woocommerce_before_checkout_billing_form', $checkout );?> <?php do_action( 'woocommerce_before_checkout_billing_form', $checkout );?> при оформлении заказа> шаблон form-billing.php и выше <?php do_action( 'woocommerce_before_checkout_shipping_form', $checkout );?> <?php do_action( 'woocommerce_before_checkout_shipping_form', $checkout );?> при оформлении заказа> шаблон form-shipping.php.

Теперь из checkout> form-billing.php отрежьте строки с 55 по 82 и вставьте в checkout> form-shipping.php в строке 77.

Теперь из checkout> form-shipping.php вырежьте строки с 52 по 54 и вставьте checkout> form-billing.php в строку 53. Это должно быть между тем, что находится в строках 52 и 53 шаблона по умолчанию.

Последним шагом будет изменение текста во входных данных для флажка, который теперь должен быть в строке 31 checkout> form-billing.php, если вы строго следовали этому.

Вы можете скопировать и заменить строку 31 следующим текстом:

<input id="ship-to-different-address-checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" <?php checked( apply_filters( 'woocommerce_ship_to_different_address_checked', 'shipping' === get_option( 'woocommerce_ship_to_destination' ) ? 1 : 0 ), 1 ); ?> type="checkbox" name="ship_to_different_address" value="1" /> <span><?php _e( 'Bill to a different address?', 'woocommerce' ); ?></span>

Последнее замечание о jquery woocommerce, которое заставляет поля появляться из флажка

Jquery работает со следующим элементом, который теперь должен быть в строке checkout> form-billing.php 35. <div class="shipping_address">