programing

Woocommerce: html 출력을 대체하는 데 도움

megabox 2023. 10. 26. 20:57
반응형

Woocommerce: html 출력을 대체하는 데 도움

나의 체크아웃 청구서 필드와 배송 필드는 3개의 다른 행 정렬로 html로 출력됩니다.처음, 끝 그리고 넓은.각 입력이 다른 입력 옆에 있도록 처음과 마지막으로 설정하고 싶습니다.

원본:

<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>

원하는 것:

<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>

이걸 어디서 무시할 수 있는지 아는 사람?저는 우커머스 폴더에 있는 대부분의 /includes에서 아래위로 검색했습니다.감이 안 잡히네

정확히 무엇을 변경할 것인지 지정할 수 있습니까?그 차이를 비교하고 발견하는 것은 상당히 어렵습니다.

일부 필드의 클래스만 변경하려면 다음을 수행하는 것이 좋습니다.

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;
}

절대 자바스크립트를 사용해서는 안 됩니다.

이 클래스를 추가하면 해당 클래스를 추가하는 원인에 대해 루트 파일을 추적하기가 어려운 테마 또는 플러그인에 의해 동적으로 추가되는 것 같습니다.

클래스를 변경하려면 jQuery를 최후의 수단으로 사용해야 합니다.그리고 운 좋게도 각 필드에 ID가 있어서 특정 요소를 선택하고 속성을 변경할 수 있습니다.

여기 당신에게 도움이 될만한 코드가 있습니다.

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

위 코드는 div 요소 하나에 대해서만 클래스를 변경합니다.필요한 다른 코드를 사용, 수정 및 추가합니다.이 코드는 변경사항을 적용해야 하는 페이지에 입력해야 합니다.

언급URL : https://stackoverflow.com/questions/32191218/woocommerce-help-replacing-html-output

반응형