결제 세부 정보를 수정하는 방법 WooCommerce 결제 페이지

게시 됨: 2021-02-22

결제 세부정보 수정 WooCommerce 결제 페이지 WooCommerce에서 청구 세부 정보를 편집하는 방법에는 여러 가지가 있습니다. 이 자습서에서는 청구 세부 정보를 편집하여 필드를 제거하거나 요구 사항을 제거하는 방법을 강조하고 싶습니다.

이전 게시물 에서 체크아웃 페이지에서 우편번호 필드를 비활성화 하는 방법 또는 우편번호 유효성 검사를 제거하는 방법을 공유했습니다.

청구 세부 정보를 편집하는 방법 WooCommerce (필드 제거, 유효성 검사 비활성화, 사용자 지정 자리 표시자 추가 및 사용자 지정 양식 레이블 추가)

오늘은 결제 세부정보를 수정하고 고객에게 보여주고 싶지 않은 필드를 제거하는 방법을 보여드리고자 합니다.

WooCommerce 무료 플러그인을 사용하여 결제 세부 정보 편집

WooCommerce 청구 세부 정보를 편집하는 데 사용할 수 있는 무료 및 프리미엄 플러그인이 12개 이상 있습니다. 청구 세부 정보를 수정하는 방법 woocommerce

이러한 플러그인은 각각 고유한 기능과 인터페이스 디자인을 가지고 있습니다. WooCommerce에서 청구 세부 정보를 편집하는 최고의 무료 플러그인은 WooCommerce용 Checkout Field Editor(Checkout Manager)입니다.

이 플러그인을 사용하면 WooCommerce 체크아웃에서 핵심 청구, 배송 및 추가 필드를 편집할 수 있습니다.

편집 양식에서 이름, 유형, 레이블, 자리 표시자, 클래스, 레이블 클래스, 유효성 검사 규칙 등과 같은 사용자 정의 필드 옵션을 추가할 수 있습니다(이 옵션의 가용성은 필드 유형에 따라 변경될 수 있음).

WooCommerce 코드 조각을 사용하여 결제 세부 정보 편집

테마의 functions.php 파일에 코드 스니펫을 추가하여 WooCommerce 결제 페이지에서 결제 세부정보를 편집할 수도 있습니다.

WooCommerce Checkout 청구 필드 제거

먼저 아래 코드 스니펫을 사용하여 원하지 않는 청구 필드를 제거할 수 있습니다.

 

/**
 * 원하지 않는 필드를 제거하기 위해 청구 세부 정보 편집 
 **/
기능 njengah_remove_checkout_fields( $fields ) {

    // 청구 필드
    unset( $fields['billing']['billing_company'] );
    unset( $fields['billing']['billing_email'] );
    unset( $fields['billing']['billing_phone'] );
    unset( $fields['billing']['billing_state'] );
    unset( $fields['billing']['billing_first_name'] );
    unset( $fields['billing']['billing_last_name'] );
    unset( $fields['billing']['billing_address_1'] );
    unset( $fields['billing']['billing_address_2'] );
    unset( $fields['billing']['billing_city'] );
    unset( $fields['billing']['billing_postcode'] );
	
	$ 필드 반환;
	
} 

	add_filter( 'woocommerce_checkout_fields', 'njengah_remove_checkout_fields' ); 

모든 필드를 제거하고 사용자 정의 필드를 추가하거나 유지하려는 필드 아래의 코드 스니펫에서 제거할 수 있습니다.

플러그인을 사용하지 않고 WooCommerce 결제 페이지에서 청구 필드를 제거하는 가장 빠른 방법입니다.

예를 들어, 결제 세부정보에만 이름, 성 및 이메일을 표시하려는 경우 코드를 아래 코드 조각과 같이 변경합니다.

 

기능 njengah_remove_checkout_fields_keep_email_name( $fields ) {

    // 청구 필드
    unset( $fields['billing']['billing_company'] );
    unset( $fields['billing']['billing_phone'] );
    unset( $fields['billing']['billing_state'] );
    unset( $fields['billing']['billing_address_1'] );
    unset( $fields['billing']['billing_address_2'] );
    unset( $fields['billing']['billing_city'] );
    unset( $fields['billing']['billing_postcode'] );
	
	$ 필드 반환;
	
} 

	add_filter( 'woocommerce_checkout_fields', 'njengah_remove_checkout_fields_keep_email_name' ); 

WooCommerce Checkout 청구 필드 및 배송 필드 제거

또한 이 논리를 확장하여 배송 필드와 청구 필드도 제거할 수 있습니다 . 청구 필드와 배송 필드를 제거하는 전체 코드는 다음과 같습니다.

 

    기능 njengah_remove_checkout_fields_billing_shipping( $fields ) {
   
		// 청구 필드
		unset( $fields['billing']['billing_company'] );
		unset( $fields['billing']['billing_email'] );
		unset( $fields['billing']['billing_phone'] );
		unset( $fields['billing']['billing_state'] );
		unset( $fields['billing']['billing_first_name'] );
		unset( $fields['billing']['billing_last_name'] );
		unset( $fields['billing']['billing_address_1'] );
		unset( $fields['billing']['billing_address_2'] );
		unset( $fields['billing']['billing_city'] );
		unset( $fields['billing']['billing_postcode'] );

		// 배송 필드
		unset( $fields['shipping']['shipping_company'] );
		unset( $fields['shipping']['shipping_phone'] );
		unset( $fields['shipping']['shipping_state'] );
		unset( $fields['shipping']['shipping_first_name'] );
		unset( $fields['shipping']['shipping_last_name'] );
		unset( $fields['shipping']['shipping_address_1'] );
		unset( $fields['shipping']['shipping_address_2'] );
		unset( $fields['shipping']['shipping_city'] );
		unset( $fields['shipping']['shipping_postcode'] );

    $ 필드 반환;
  } 
add_filter( 'woocommerce_checkout_fields', 'njengah_remove_checkout_fields_billing_shipping' ); 

WooCommerce Checkout 청구 필드, 배송 필드 및 주문 메모 제거

동일한 논리를 사용하여 청구 섹션 및 배송 섹션 아래에 있는 주문 메모 필드를 제거할 수도 있지만 아래 결합된 코드 조각에서와 같이 order_comments 제거 옵션을 추가합니다.

 

    기능 njengah_remove_checkout_fields_billing_shipping_order( $fields ) {
   
		// 청구 필드
		unset( $fields['billing']['billing_company'] );
		unset( $fields['billing']['billing_email'] );
		unset( $fields['billing']['billing_phone'] );
		unset( $fields['billing']['billing_state'] );
		unset( $fields['billing']['billing_first_name'] );
		unset( $fields['billing']['billing_last_name'] );
		unset( $fields['billing']['billing_address_1'] );
		unset( $fields['billing']['billing_address_2'] );
		unset( $fields['billing']['billing_city'] );
		unset( $fields['billing']['billing_postcode'] );

		// 배송 필드
		unset( $fields['shipping']['shipping_company'] );
		unset( $fields['shipping']['shipping_phone'] );
		unset( $fields['shipping']['shipping_state'] );
		unset( $fields['shipping']['shipping_first_name'] );
		unset( $fields['shipping']['shipping_last_name'] );
		unset( $fields['shipping']['shipping_address_1'] );
		unset( $fields['shipping']['shipping_address_2'] );
		unset( $fields['shipping']['shipping_city'] );
		unset( $fields['shipping']['shipping_postcode'] );

                // 주문 필드
                unset( $fields['order']['order_comments'] );

    $ 필드 반환;
  } 
add_filter( 'woocommerce_checkout_fields', 'njengah_remove_checkout_fields_billing_shipping_order' ); 

WooCommerce 청구 세부 정보 수정 요구 사항 또는 유효성 검사

청구 필드 중 하나가 채워지지 않으면 WooCommerce는 가장 일반적인 오류와 같은 오류를 생성합니다. 청구 우편 번호는 유효한 우편 번호가 아닙니다.

이것은 기본적으로 WooCommerce 결제 체크아웃 필드에 유효성 검사 기능이 있기 때문에 발생합니다.

이 문제를 해결하고 필드가 비어 있을 때 이러한 오류가 표시되지 않도록 하려면 청구 세부 정보 유효성 검사를 제거해야 합니다.

아래 코드 스니펫은 Billing phone 필드에서 유효성 검사를 제거합니다. 이 코드는 활성 테마의 functions.php 파일에 추가되어야 합니다.

 /**
	 * 청구 필드 유효성 검사를 제거하는 예
	 **/ 
 
		add_filter( 'woocommerce_billing_fields', 'njengah_remove_phone_field_validation');

		기능 njengah_remove_phone_field_validation( $fields ) {
		
			$fields['billing_phone']['필수'] = 거짓;
			
			$ 필드 반환;
		}

이 논리를 이름, 이메일 등과 같은 더 많은 필드로 확장할 수 있습니다. 다음 코드 줄을 유효성 검사를 제거하려는 필드의 필드 ID로 바꾸기만 하면 됩니다.

$fields['billing_phone']['required'] = false;

WooCommerce 결제 세부 정보 자리 표시자 및 레이블 수정

WooCommerce 청구 세부 정보를 편집하는 또 다른 방법은 기본 WooCommerce 결제 페이지 양식 레이블 및 자리 표시자를 변경하는 것입니다. 아래 코드 스니펫을 사용하여 이를 달성할 수 있습니다.

 add_filter('woocommerce_checkout_fields', 'njengah_edit_checkout_placeholders_labels');
  
		기능 njengah_edit_checkout_placeholders_labels($fields){
		
			 $fields['billing']['billing_company']['placeholder'] = '사용자 지정 자리 표시자';
			 $fields['billing']['billing_company']['label'] = '맞춤 라벨';
		 
		 $ 필드 반환;
		 }

결론

이 튜토리얼에서는 WooCommerce 결제 세부 정보를 편집하여 필요에 맞게 WooCommerce 체크아웃 페이지를 사용자 정의할 수 있는 다양한 방법을 강조했습니다. 이 코드 조각은 청구 세부 정보, 배송 세부 정보 및 주문 메모를 편집하는 플러그인과 동일한 방식으로 작동한다는 점을 기억하는 것이 중요합니다.

또한 항상 활성 테마의 하위 테마에 이러한 코드 조각을 추가하는 것이 좋습니다. 자식 테마가 없는 경우 이 게시물을 사용하여 자식 테마를 만드는 방법에 대해 배울 수 있습니다 – Storefront 자식 테마 만들기.

WooCommerce를 사용자 정의하는 방법에는 여러 가지가 있지만 가장 일반적인 것은 마음에 들지 않는 기능을 숨기는 것입니다. 저는 WooCommerce 스토어에서 대부분의 기능을 숨기는 방법에 대한 포괄적인 가이드인 Ultimate WooCommerce Hide Guide를 공유했습니다. 이것은 WooCommerce 사용자 정의를 시작하기에 좋은 장소가 될 수 있습니다.

WooCommerce 기본 테마인 Storefront 테마를 사용하는 경우 WooCommerce 상점을 전문적인 모양과 느낌으로 만드는 방법에 대한 80개 이상의 상점 사용자 정의 팁에서 배울 수 있습니다.

마지막으로, WordPress 전문가 또는 WooCommerce 개발자를 고용해야 하는 경우 WooCommerce 문제를 해결하거나 사이트의 오류를 수정할 수 있도록 항상 도와드릴 수 있습니다.

유사한 기사