WooCommerce 등록 양식에 필드를 추가하는 방법

게시 됨: 2021-04-20

사용자 정의 필드 추가 WooCommerce 등록 양식 WooCommerce 등록 양식 필드를 추가하는 방법을 찾고 있습니까? 이 튜토리얼에서는 WooCommerce 스토어에 등록하기 전에 고객에게 추가 정보를 요청하기 위해 WooCommerce 등록 양식에 사용자 정의 필드를 추가하는 방법을 보여줍니다.

WooCommerce는 사용자 정의가 유연하기 때문에 대부분의 상점 소유자에게 계속 인기가 있습니다. 플러그인이나 사용자 정의 코드를 사용하여 더 많은 기능을 추가할 수 있습니다.

필드 추가 방법 WooCommerce 등록 양식

이 게시물에서는 사용자 정의 PHP 스크립트를 사용하여 WooCommerce 등록 양식 필드를 추가하는 방법을 볼 수 있습니다. 하위 테마를 만드는 것이 좋습니다. 이렇게 하면 업데이트 중에 변경 사항이 손실되지 않습니다.

시작하기 전에 계정 로그인 페이지에서 WooCommerce 등록 양식이 활성화되어 있는지 확인해야 합니다.

이를 위해 WooCommerce > 설정 > 계정 으로 이동하여 아래와 같이 " 내 계정 " 페이지에서 고객 등록 활성화를 확인하십시오.

이렇게 하면 WooCommerce 등록 양식이 프런트 엔드에 표시됩니다.

WooCommerce 등록 양식에 필드를 추가하는 단계

이 섹션에서는 다음 작업을 활용하여 이 구조에 더 많은 필드를 추가합니다. 이름, 성 및 휴대폰 번호와 같은 필드가 포함됩니다.

따라야 할 단계는 다음과 같습니다.

WordPress 사이트에 로그인하고 관리자로 대시보드에 액세스합니다.
대시보드 메뉴에서 모양 메뉴 > 테마 편집기 메뉴를 클릭합니다. 테마 편집기 페이지가 열리면 등록 양식에 필드를 추가할 기능을 추가할 테마 기능 파일을 찾으십시오.
functions.php 파일에 다음 코드를 추가합니다.

 함수 njengah_extra_register_fields() {?>

       <p class="form-row form-row-wide">

       <label for="reg_billing_phone"><?php _e( '전화', '우커머스' ); ?></label>

       <input type="text" class="input-text" name="billing_phone" id="reg_billing_phone" value="<?php esc_attr_e( $_POST['billing_phone'] ); ?>" />

       </p>

       <p class="form-row form-row-first">

       <label for="reg_billing_first_name"><?php _e( '이름', '우커머스' ); ?><span class="required">*</span></label>

       <input type="text" class="input-text" name="billing_first_name" id="reg_billing_first_name" value="<?php if ( ! empty( $_POST['billing_first_name'] ) ) esc_attr_e( $_POST[' Billing_first_name'] ); ?>" />

       </p>

       <p class="form-row form-row-last">

       <label for="reg_billing_last_name"><?php _e( '성', '우커머스' ); ?><span class="required">*</span></label>

       <input type="text" class="input-text" name="billing_last_name" id="reg_billing_last_name" value="<?php if ( ! empty( $_POST['billing_last_name'] ) ) esc_attr_e( $_POST[' Billing_last_name'] ); ?>" />

       </p>

       <div class="clear"></div>

       <?php

 }

 add_action( 'woocommerce_register_form_start', 'njengah_extra_register_fields' );

페이지를 새로 고칠 때의 결과는 다음과 같습니다.

등록 양식 필드는 청구서 수신 주소와 동일합니다.

필드 이름 앞에 접두사 "billing_"을 포함했습니다.

다음은 등록 양식에 추가할 수 있고 청구서 수신 주소와 연결할 수 있는 유효한 WooCommerce 양식 필드입니다.

Billing_first_name
Billing_last_name
Billing_company
Billing_address_1
Billing_address_2
Billing_city
Billing_postcode
Billing_country
Billing_state
Billing_email
Billing_phone

이제 양식이 생성되었으므로 functions.php 파일에 삽입해야 하는 다음 코드를 사용하여 양식을 검증해야 합니다.

 /**

* 필드를 등록합니다.

*/

함수 njengah_validate_extra_register_fields( $username, $email, $validation_errors ) {




      if ( isset( $_POST['billing_first_name'] ) && 비어 있음( $_POST['billing_first_name'] ) ) {




             $validation_errors->add( 'billing_first_name_error', __( '<strong>오류</strong>: 이름이 필요합니다!', 'woocommerce' ) );

      }

      if ( isset( $_POST['billing_last_name'] ) && 비어 있음( $_POST['billing_last_name'] ) ) {




             $validation_errors->add( 'billing_last_name_error', __( '<strong>오류</strong>: 성은 필수입니다!.', 'woocommerce' ) );




      }

         $validation_errors 반환;

}




add_action( 'woocommerce_register_post', 'njengah_validate_extra_register_fields', 10, 3 );

마지막 단계는 fucntions.php 파일에 다음 코드를 추가하여 이러한 값을 데이터베이스에 저장하는 것입니다.

 /**

* 아래 코드는 추가 필드를 저장합니다.

*/

기능 njengah_save_extra_register_fields( $customer_id ) {

    if ( isset( $_POST['billing_phone'] ) ) {

                 // WooCommerce에서 사용되는 전화 입력 필드

                 update_user_meta( $customer_id, 'billing_phone', Sanitize_text_field( $_POST['billing_phone'] ) );

          }

      if ( isset( $_POST['billing_first_name'] ) ) {

             //기본값인 이름 필드

             update_user_meta( $customer_id, 'first_name', Sanitize_text_field( $_POST['billing_first_name'] ) );

             // WooCommerce에서 사용되는 이름 필드

             update_user_meta( $customer_id, 'billing_first_name', Sanitize_text_field( $_POST['billing_first_name'] ) );

      }

      if ( isset( $_POST['billing_last_name'] ) ) {

             // 기본적으로 있는 성 필드

             update_user_meta( $customer_id, 'last_name', Sanitary_text_field( $_POST['billing_last_name'] ) );

             // WooCommerce에서 사용되는 성 필드

             update_user_meta( $customer_id, 'billing_last_name', Sanitize_text_field( $_POST['billing_last_name'] ) );

      }




}

add_action( 'woocommerce_created_customer', 'njengah_save_extra_register_fields' );

이제 필드가 추가, 검증 및 향후 사용을 위해 삽입되었습니다.

계정의 청구서 수신 주소 페이지로 이동할 때 수정을 클릭해야 이동합니다. 필드가 이미 채워져 있습니다.

결론

이 게시물에서는 WooCommerce 등록 양식에 필드를 추가하는 방법을 배웠습니다.

이 코드를 구현하는 데 문제가 발생하면 자격을 갖춘 WordPress 개발자에게 문의하세요.

유사한 기사

결제 세부 정보를 수정하는 방법 WooCommerce 결제 페이지
체크아웃 후 WooCommerce 리디렉션: 맞춤 감사 페이지로 리디렉션
로그아웃 후 WooCommerce 리디렉션 [궁극적인 가이드]
WooCommerce에서 쇼핑 페이지에 검색을 추가하는 방법
WooCommerce Checkout 오류 메시지를 변경하는 방법
WooCommerce에서 결제에 날짜 필드를 추가하는 방법
체크아웃 전화번호 확인 추가 방법 WooCommerce
WordPress 파일 공유 등을 위한 30가지 최고의 다운로드 플러그인
35개 이상의 최고의 자유형 플러그인 WordPress
WooCommerce에서 통화 기호를 변경하는 방법
kg당 WooCommerce 제품 가격을 설정하는 방법
WooCommerce 결제 필드를 이동하는 방법
사용자가 WordPress에 로그인했는지 확인하는 방법
WooCommerce 결제 페이지 스타일 지정 방법
WooCommerce의 결제에서 쿠폰을 제거하는 방법
WooCommerce에 통화를 추가하는 방법 [커스텀 통화]
WooCommerce 결제 페이지에서 확인란 필드를 만드는 방법
WooCommerce에서 결제 URL을 얻는 방법
WooCommerce 모바일 결제 최적화 퀵 가이드