Wооcommerce. Как изменить html разметку полей ввода (checkout fields) на странице оформления заказа (checkout page)?

350

08 июня 2017, 05:15

Очень нужна помощь! Стандартными средствами woocommerce c помощью вот такого хука:

add_action( 'woocommerce_after_checkout_billing_form', 'add_custom_field' );
function add_custom_field( $checkout ) {
    echo '<div id="custom_field_wrapper">';  
    woocommerce_form_field( 'custom_field', array(
    'type'          => 'text',
    'class'         => array('custom_field_class'),
    'label'         => __('Custom Field'),
    'placeholder'   => __('Please input value ...'),
    'required'   => false, ), 
    $checkout->get_value( 'custom_field' ) ); 
    echo '</div>';
}

получаем такую разметку

<div id="custom_field_wrapper">
    <p class="form-row custom_field_class" id="custom_field_field" data-priority="">
        <label for="custom_field" class="">Custom Field</label>
        <input type="text" class="input-text " name="custom_field" id="custom_field" placeholder="Please input value ..." value="">
    </p>
</div>

а вот требуемая разметка выглядит вот так:

<div class="row order-form__row">
    <div class="col-lg-3 col-md-4">
        <label class="label" for="index-field">Индекс:</label>
    </div>
    <div class="col-lg-6 col-md-6">
        <input class="input" type="text" name="index" id="index-field"/>
    </div>
    <div class="col-lg-3 col-md-2"><a class="field-after" href="javascript:void(0);" target="_blank">Забыли индекс?</a></div>
</div>

Добрые умные люди помогите разрешить дилемму ... Как изменить html разметку согласно требованиям?

Answer 1

Похоже, вы используете Simplify Commerce Gateway. В нем есть такой файл: \wp-content\plugins\woocommerce\includes\gateways\class-wc-payment-gateway-cc.php. Именно он порождает разметку, о которой вы говорите.

Править его на месте нельзя - при обновлении WooCommerce ваши правки могут быть удалены. Класс WC_Payment_Gateway_CC надо перекрыть. Попробуйте добавить такой код в function.php:

require( get_home_path() . 'wp-content/plugins/woocommerce/includes/gateways/class-wc-payment-gateway-cc.php' );
class WC_Payment_Gateway_CC_Custom extends WC_Payment_Gateway_CC {
    public function form() {
    // Скопируйте сюда код функции form из WC_Payment_Gateway_CC
    // и отредактируйте его
    } 
}