Woocommerce: pomoc w wymianie danych wyjściowych html

Question

Moje płatności-pola fakturowania i wysyłki są wydrukowane w html z 3 różnymi wyrównaniami wierszy. pierwszy, ostatni i szeroki. Chcę tylko ustawić je jako pierwsze i ostatnie - tak, aby każde wejście było obok siebie.

oryginalny:

<div class="woocommerce-billing-fields"> 

    <h3>Faktureringsdetaljer</h3> 




    <p class="form-row form-row form-row-first validate-required" id="billing_first_name_field"><label for="billing_first_name" class="">Fornavn <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_first_name" id="billing_first_name" placeholder="" value=""></p> 

    <p class="form-row form-row form-row-last validate-required" id="billing_last_name_field"><label for="billing_last_name" class="">Etternavn <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_last_name" id="billing_last_name" placeholder="" value=""></p><div class="clear"></div> 

    <p class="form-row form-row form-row-wide" id="billing_company_field"><label for="billing_company" class="">Navn på firma</label><input type="text" class="input-text " name="billing_company" id="billing_company" placeholder="" value=""></p> 

    <p class="form-row form-row form-row-wide address-field validate-required" id="billing_address_1_field"><label for="billing_address_1" class="">Adresse <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_address_1" id="billing_address_1" placeholder="Gateadresse" value=""></p> 

    <p class="form-row form-row form-row-last address-field validate-required validate-postcode" id="billing_postcode_field"><label for="billing_postcode" class="">Postnummer <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_postcode" id="billing_postcode" placeholder="Postnummer " value=""></p><div class="clear"></div> 

    <p class="form-row form-row form-row-wide address-field validate-required" id="billing_city_field"><label for="billing_city" class="">Sted <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_city" id="billing_city" placeholder="Sted" value=""></p> 

    <p class="form-row form-row form-row-first address-field validate-state" id="billing_state_field" style="display: none"><label for="billing_state" class="">Delstat/Fylke</label><input type="hidden" class="hidden" name="billing_state" id="billing_state" value="" placeholder=""></p> 

    <p class="form-row form-row form-row-first validate-required validate-email" id="billing_email_field"><label for="billing_email" class="">Epostadresse <abbr class="required" title="påkrevet">*</abbr></label><input type="email" class="input-text " name="billing_email" id="billing_email" placeholder="" value="kreegah@gmail.com"></p> 

    <p class="form-row form-row form-row-last validate-required validate-phone" id="billing_phone_field"><label for="billing_phone" class="">Telefon <abbr class="required" title="påkrevet">*</abbr></label><input type="tel" class="input-text " name="billing_phone" id="billing_phone" placeholder="" value=""></p><div class="clear"></div> 


</div> 

Czego chcę:

<div class="woocommerce-billing-fields"> 

    <h3>Faktureringsdetaljer</h3> 




    <p class="form-row form-row form-row-first validate-required" id="billing_first_name_field"><label for="billing_first_name" class="">Fornavn <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_first_name" id="billing_first_name" placeholder="" value=""></p> 

    <p class="form-row form-row form-row-last validate-required" id="billing_last_name_field"><label for="billing_last_name" class="">Etternavn <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_last_name" id="billing_last_name" placeholder="" value=""></p> 

    <p class="form-row form-row form-row-first" id="billing_company_field"><label for="billing_company" class="">Navn på firma</label><input type="text" class="input-text " name="billing_company" id="billing_company" placeholder="" value=""></p> 

    <p class="form-row form-row form-row-last address-field validate-required" id="billing_address_1_field"><label for="billing_address_1" class="">Adresse <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_address_1" id="billing_address_1" placeholder="Gateadresse" value=""></p> 

    <p class="form-row form-row form-row-first address-field validate-required validate-postcode" id="billing_postcode_field"><label for="billing_postcode" class="">Postnummer <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_postcode" id="billing_postcode" placeholder="Postnummer " value=""></p> 

    <p class="form-row form-row form-row-last address-field validate-required" id="billing_city_field"><label for="billing_city" class="">Sted <abbr class="required" title="påkrevet">*</abbr></label><input type="text" class="input-text " name="billing_city" id="billing_city" placeholder="Sted" value=""></p> 

    <p class="form-row form-row form-row-first address-field validate-state" id="billing_state_field" style="display: none"><label for="billing_state" class="">Delstat/Fylke</label><input type="hidden" class="hidden" name="billing_state" id="billing_state" value="" placeholder=""></p> 

    <p class="form-row form-row form-row-first validate-required validate-email" id="billing_email_field"><label for="billing_email" class="">Epostadresse <abbr class="required" title="påkrevet">*</abbr></label><input type="email" class="input-text " name="billing_email" id="billing_email" placeholder="" value="kreegah@gmail.com"></p> 

    <p class="form-row form-row form-row-last validate-required validate-phone" id="billing_phone_field"><label for="billing_phone" class="">Telefon <abbr class="required" title="påkrevet">*</abbr></label><input type="tel" class="input-text " name="billing_phone" id="billing_phone" placeholder="" value=""></p><div class="clear"></div> 


</div> 

ktoś wie gdzie mogę je zastąpić? Przeszukałem w większości folderów woocommerce w/include. nie mam pojęcia.

Answer 1

Czy możesz dokładnie określić, co chcesz zmienić? Trudno to porównać i dostrzec różnicę.

Jeśli chcesz tylko zmiana klasy na niektórych obszarach, właściwym sposobem na to jest:

add_filter('woocommerce_checkout_fields' , 'custom_override_checkout_fields'); 

function custom_override_checkout_fields($fields) { 

    $fields['billing']['billing_company']['class'] = array('form-row', 'form-row', 'form-row-first'); 
    $fields['billing']['billing_address_1']['class'] = array('form-row', 'form-row', 'form-row-first', 'address-field', 'validate-required'); 
    $fields['billing']['billing_postcode']['class'] = array('form-row', 'form-row', 'form-row-first', 'address-field', 'validate-required'); 
    $fields['billing']['billing_city']['class'] = array('form-row', 'form-row', 'form-row-last', 'address-field', 'validate-required'); 
    $fields['billing']['billing_state']['class'] = array('form-row', 'form-row', 'form-row-first', 'address-field', 'validate-state'); 
    $fields['billing']['billing_email']['class'] = array('form-row', 'form-row', 'form-row-first', 'address-field', 'validate-email'); 
    $fields['billing']['billing_phone']['class'] = array('form-row', 'form-row', 'form-row-last', 'address-field', 'validate-phone'); 
    return $fields; 
} 

Należy absolutnie nie używać JavaScript do tego.

Answer 2

Dodaj te klasy wydaje się być dodana dynamicznie przez temat lub wtyczki jest trudny do śledzenia pliku root dla przyczyny dodania tych klas.

Aby zmienić klasy, należy użyć jQuery jako ostateczności. Na szczęście są identyfikatory dla każdego pola, dzięki czemu można wybrać określone elementy i zmienić ich właściwości.

Oto kod, który może ci pomóc.

jQuery("#billing_company_field").removeClass("form-row-wide").addClass("form-row-first"); 

Powyższy kod zmieni klasę tylko dla jednego elementu div. Użyj, zmodyfikuj i dodaj drugi potrzebny kod. Ten kod powinien zostać umieszczony na stronie, na której chcesz wpłynąć na zmiany.