우커머스 회원가입 필드 재정열 문제

안녕하세요?

쇼핑몰 회언 관리를 위해서 woocommerce 로고인 및 회원등록 기능을 사용하려 알아보고 있습니다. 

인터넷 자료를 기반으로 woocommerce 회원등록 시 여러개의 custom field를 추가하는데 성공했습니다.
그런데 이러한 custom field를 순서를 바꾸고 효율적으로 배치하는데 애를 먹고 있습니다.

제가 사용하려는 회원가입 시 사용하려는 필드는 아래와 같은 것들입니다.  
- reg_username
- first_name
- user_phone
- reg_email
- account_password

- 활동지역

- 골프 수준 선택 등

https://ownergolf.net/my-account/ 에서 Register section을 보시면 됩니다. 

이를 위해서 저는 예전 기억을 더듬어서 아래와 같은 css code snippet을 만들었습니다. 아쉽게도 이 code snippet은 잘 작동하지 않습니다.

혹시 제대로 재정렬하려면 어떻게 이 code snippet을 수정해야 하는지 알수 있을까요?

/* 계정 추가를 위해서...*/
/* .woocommerce-account-fields__field-wrapper {
    display: flex;
    flex-wrap: wrap;
  }
.woocommerce-account form .form-row {
    display: inline-block;
  } */
.woocommerce-form .woocommerce-form-register .register {
    max-width: 100%;
  }

  #reg_username_field {
    display: none !important;    
    order: 1;
    width: 48%; 
    padding-bottom: 20px !important;
  }
  #first_name_field {
    order: 2;
    width: 48%; 
    padding-bottom: 20px !important;
  }

  #user_phone_field {
    display: none !important;    
    order: 3;
    width: 48%; 
    padding-bottom: 20px !important;
  }
  #reg_email_field {
    order: 4;
    width: 48%; 
    padding-bottom: 20px !important;
  }

  #account_password_field {
    order: 5;
    width: 100%; 
    padding-bottom: 20px !important;
  }

.woocommerce-account-fields label{ 
    display: none !important; 
    font-size: 11px !important;
    line-height: 36px !important;
    color: #9E9E9E !important;
}

 

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    어떤 식으로 정렬하고 싶으신 건지요?

    필드의 순서를 변경하고 싶으신 건지요?

    필드는 어떤 식으로 추가하신 건지요?

    별도의 코드를 테마 쪽 functions.php 파일에 추가하셨다면

    에디터의 코드 스니펫 삽입 기능으로 올려주시겠어요?

    고맙습니다.

  • 안녕하세요?

    필드 순서를 변경하고, 한줄에 두개씩 배치하는 등의 조정을 하고 싶습니다.

    즉 reg_username, first_name 두개를  한줄에
    - user_phone, reg_email 두개를 한줄에
    - account_password 하나를 한줄에

    - 활동지역,  골프 수준 선택  두개를 한줄에 배치하고 싶습니다.

     

    필드 추가는 추가 코드를 만들어 플러그인으로 등록했습니다. 플러그인 내용을 그대로 복사해 왔습니다.

    <?php
    /*
    Plugin Name: WooCommerce Custom Account Fields
    Plugin URI: https://iconicwp.com/blog/the-ultimate-guide-to-adding-custom-woocommerce-user-account-fields/
    Description: Add custom WooCommerce user account fields.
    Author: Iconic
    Version: 1.0.0
    Author URI: https://iconicwp.com/products/
    */
    
    /**
     * Get additional account fields.
     *
     * @return array
     */
    function iconic_get_account_fields() {
    	return apply_filters( 'iconic_account_fields', array(
    		'first_name'                 => array(
    			'type'                 => 'text',
    			'label'                => __( '이름', 'iconic' ),
                'placeholder'          => __( '성+이름 추천해요', 'iconic' ),			
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => false,
    			'hide_in_registration' => false,
    			'required'             => true,
    		),
    
    		'user_phone'                 => array(
    			'type'                 => 'tel',
    			'label'                => __( '전화번호', 'iconic' ),
                'placeholder'          => __( '주연락 휴대 전화번호', 'iconic' ),			
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => false,
    			'hide_in_registration' => false,
    			'required'             => true,
    		),		
    
    
    		'iconic-register-region-select'     => array(
               'type'    => 'select',
               'class'   => 'iconic-register-region-select',           
               'label'   => __( '활동지역 선택', 'iconic' ),
               'options' => array(
     //              '' => __( '서울시', 'iconic' ),
                   1  => __( '서울시', 'iconic' ),
                   2  => __( '인천시', 'iconic' ),
                   3  => __( '경기도 북부', 'iconic' ),
                   4  => __( '경기도 남부', 'iconic' ),
                   5  => __( '충북', 'iconic' ),
                   6  => __( '충남', 'iconic' ),
                   7  => __( '경북', 'iconic' ),
                   8  => __( '경남', 'iconic' ),
                   9  => __( '전북', 'iconic' ),
                   10  => __( '전남', 'iconic' ), 
                   11  => __( '제주', 'iconic' ),                          
    		    ),
    			'required' => false,
    		),
    
    		'iconic-register-ability-select'     => array(
               'type'    => 'select',
               'class'   => 'iconic-register-ability-select',             
               'label'   => __( '골프수준 선택', 'iconic' ),
               'options' => array(
     //              '' => __( '90이상', 'iconic' ),
    
                   2  => __( '90이상', 'iconic' ),
                   1  => __( '100이상', 'iconic' ),
                   3  => __( '80이상', 'iconic' ),
                   4  => __( '70대', 'iconic' ),                        
    		    ),
    			'required' => false,
    		),
    
    		'iconic-register-checkboxes-required' => array(
    			'type'     => 'checkboxes', 'checked',
    			
    			'label'    => __( '가입 필수 동의 사항', 'iconic' ),
    			'options'  => array(
    				1 => __( '[필수] 만 14세 이상 확인', 'iconic' ),
    				2 => __( '[필수] <a href="https://ownergolf.net/privacy-policy/" target="_blank">개인보호정책</a> 및 <a href="https://ownergolf.net/terms-of-service/" target="_blank">이용 약관</a> 동의', 'iconic' ),
    
    				3 => __( '[필수] 사용 경험 강화를 위한 <a href="https://ownergolf.net/위치-정보-이용-정책/" target="_blank">위치 정보 이용</a> 동의', 'iconic' ),		
    				4 => __( '[필수] 서비스 관련 메일/SMS 등 <a href="https://ownergolf.net/커뮤니케이션-정책/" target="_blank">커뮤니케이션</a> 동의', 'iconic' ),							
    			),
    			'required' => true,
    		),
    
    		'iconic-register-checkboxes-option' => array(
    			'type'     => 'checkboxes', 'checked',
    			
    	
    			'label'    => __( '가입 선택 동의 사항', 'iconic' ),
    			'options'  => array(
    
    				1 => __( '[선택] 마케팅 정보 제공 <a href="https://ownergolf.net/커뮤니케이션-정책/" target="_blank">메일/SMS 등 수신</a> 동의', 'iconic' ),	
    				2 => __( '[선택] 새로운 서비스를 위한 <a href="https://ownergolf.net/제3자-개인-정보-제공-정책/" target="_blank">제3자 개인 정보 제공</a> 동의', 'iconic' ),				
    			),
    			'required' => false,
    		),
    
    	) );
    }
    
    /**
     * Add post values to account fields if set.
     * @param array $fields
     * @return array
     */
    function iconic_add_post_data_to_account_fields( $fields ) {
    	if ( empty( $_POST ) ) {
    		return $fields;
    	}
    
    	foreach ( $fields as $key => $field_args ) {
    		if ( empty( $_POST[ $key ] ) ) {
    			$fields[ $key ]['value'] = '';
    			continue;
    		}
    
    		$fields[ $key ]['value'] = $_POST[ $key ];
    	}
    
    	return $fields;
    }
    
    add_filter( 'iconic_account_fields', 'iconic_add_post_data_to_account_fields', 10, 1 );
    
    /**
     * Add fields to registration form and account area.
     */
    function iconic_print_user_frontend_fields() {
    	$fields            = iconic_get_account_fields();
    	$is_user_logged_in = is_user_logged_in();
    
    	foreach ( $fields as $key => $field_args ) {
    		$value = null;
    
    		if ( ! iconic_is_field_visible( $field_args ) ) {
    			continue;
    		}
    
    		if ( $is_user_logged_in ) {
    			$user_id = iconic_get_edit_user_id();
    			$value   = iconic_get_userdata( $user_id, $key );
    		}
    
    		$value = isset( $field_args['value'] ) ? $field_args['value'] : $value;
    
    		woocommerce_form_field( $key, $field_args, $value );
    	}
    }
    
    add_action( 'woocommerce_register_form', 'iconic_print_user_frontend_fields', 10 ); // register form
    add_action( 'woocommerce_edit_account_form', 'iconic_print_user_frontend_fields', 10 ); // my account
    
    /**
     * Get user data.
     *
     * @param $user_id
     * @param $key
     *
     * @return mixed|string
     */
    function iconic_get_userdata( $user_id, $key ) {
    	if ( ! iconic_is_userdata( $key ) ) {
    		return get_user_meta( $user_id, $key, true );
    	}
    
    	$userdata = get_userdata( $user_id );
    
    	if ( ! $userdata || ! isset( $userdata->{$key} ) ) {
    		return '';
    	}
    
    	return $userdata->{$key};
    }
    
    /**
     * Modify checkboxes/radio fields.
     *
     * @param $field
     * @param $key
     * @param $args
     * @param $value
     *
     * @return string
     */
    function iconic_form_field_modify( $field, $key, $args, $value ) {
    	ob_start();
    	iconic_print_list_field( $key, $args, $value );
    	$field = ob_get_clean();
    
    	if ( $args['return'] ) {
    		return $field;
    	} else {
    		echo $field;
    	}
    }
    
    add_filter( 'woocommerce_form_field_checkboxes', 'iconic_form_field_modify', 10, 4 );
    add_filter( 'woocommerce_form_field_radio', 'iconic_form_field_modify', 10, 4 );
    
    /**
     * Get currently editing user ID (frontend account/edit profile/edit other user).
     *
     * @return int
     */
    function iconic_get_edit_user_id() {
    	return isset( $_GET['user_id'] ) ? (int) $_GET['user_id'] : get_current_user_id();
    }
    
    /**
     * Print a list field (checkboxes|radio).
     *
     * @param string $key
     * @param array  $field_args
     * @param mixed  $value
     */
    function iconic_print_list_field( $key, $field_args, $value = null ) {
    	$value = empty( $value ) && $field_args['type'] === 'checkboxes' ? array() : $value;
    	?>
    	<div class="form-row">
    		<?php if ( ! empty( $field_args['label'] ) ) { ?>
    			<label>
    				<?php echo $field_args['label']; ?>
    				<?php if ( ! empty( $field_args['required'] ) ) { ?>
    					<abbr class="required" title="<?php echo esc_attr__( 'required', 'woocommerce' ); ?>">*</abbr>
    				<?php } ?>
    			</label>
    		<?php } ?>
    		<ul>
    			<?php foreach ( $field_args['options'] as $option_value => $option_label ) {
    				$id         = sprintf( '%s_%s', $key, sanitize_title_with_dashes( $option_label ) );
    				$option_key = $field_args['type'] === 'checkboxes' ? sprintf( '%s[%s]', $key, $option_value ) : $key;
    				$type       = $field_args['type'] === 'checkboxes' ? 'checkbox' : $field_args['type'];
    				$checked    = $field_args['type'] === 'checkboxes' ? in_array( $option_value, $value ) : $option_value == $value;
    				?>
    				<li>
    					<label for="<?php echo esc_attr( $id ); ?>">
    						<input type="<?php echo esc_attr( $type ); ?>" id="<?php echo esc_attr( $id ); ?>" name="<?php echo esc_attr( $option_key ); ?>" value="<?php echo esc_attr( $option_value ); ?>" <?php checked( $checked ); ?>>
    						<?php echo $option_label; ?>
    					</label>
    				</li>
    			<?php } ?>
    		</ul>
    	</div>
    	<?php
    }
    
    /**
     * Save registration fields.
     *
     * @param int $customer_id
     */
    function iconic_save_account_fields( $customer_id ) {
    	$fields         = iconic_get_account_fields();
    	$sanitized_data = array();
    
    	foreach ( $fields as $key => $field_args ) {
    		if ( ! iconic_is_field_visible( $field_args ) ) {
    			continue;
    		}
    
    		$sanitize = isset( $field_args['sanitize'] ) ? $field_args['sanitize'] : 'wc_clean';
    		$value    = isset( $_POST[ $key ] ) ? call_user_func( $sanitize, $_POST[ $key ] ) : '';
    
    		if ( iconic_is_userdata( $key ) ) {
    			$sanitized_data[ $key ] = $value;
    			continue;
    		}
    
    		update_user_meta( $customer_id, $key, $value );
    	}
    
    	if ( ! empty( $sanitized_data ) ) {
    		$sanitized_data['ID'] = $customer_id;
    		wp_update_user( $sanitized_data );
    	}
    }
    
    add_action( 'woocommerce_created_customer', 'iconic_save_account_fields' ); // register/checkout
    add_action( 'personal_options_update', 'iconic_save_account_fields' ); // edit own account admin
    add_action( 'edit_user_profile_update', 'iconic_save_account_fields' ); // edit other account
    add_action( 'woocommerce_save_account_details', 'iconic_save_account_fields' ); // edit WC account
    
    /**
     * Is this field core user data.
     *
     * @param $key
     *
     * @return bool
     */
    function iconic_is_userdata( $key ) {
    	$userdata = array(
    		'user_pass',
    		'user_login',
    		'user_nicename',
    		'user_url',
    		'user_phone',
    		'user_email',
    		'display_name',
    		'nickname',
    		'first_name',
    		'last_name',
    		'description',
    		'rich_editing',
    		'user_registered',
    		'role',
    		'jabber',
    		'aim',
    		'yim',
    		'show_admin_bar_front',
    	);
    
    	return in_array( $key, $userdata );
    }
    
    /**
     * Is field visible.
     *
     * @param $field_args
     *
     * @return bool
     */
    function iconic_is_field_visible( $field_args ) {
    	$visible = true;
    	$action  = filter_input( INPUT_POST, 'action' );
    
    	if ( is_admin() && ! empty( $field_args['hide_in_admin'] ) ) {
    		$visible = false;
    	} elseif ( ( is_account_page() || $action === 'save_account_details' ) && is_user_logged_in() && ! empty( $field_args['hide_in_account'] ) ) {
    		$visible = false;
    	} elseif ( ( is_account_page() || $action === 'save_account_details' ) && ! is_user_logged_in() && ! empty( $field_args['hide_in_registration'] ) ) {
    		$visible = false;
    	} elseif ( is_checkout() && ! empty( $field_args['hide_in_checkout'] ) ) {
    		$visible = false;
    	}
    
    	return $visible;
    }
    
    /**
     * Add fields to admin area.
     */
    function iconic_print_user_admin_fields() {
    	$fields = iconic_get_account_fields();
    	?>
    	<h2><?php _e( 'Additional Information', 'iconic' ); ?></h2>
    	<table class="form-table" id="iconic-additional-information">
    		<tbody>
    		<?php foreach ( $fields as $key => $field_args ) { ?>
    			<?php
    			if ( ! iconic_is_field_visible( $field_args ) ) {
    				continue;
    			}
    
    			$user_id = iconic_get_edit_user_id();
    			$value   = iconic_get_userdata( $user_id, $key );
    			?>
    			<tr>
    				<th>
    					<label for="<?php echo $key; ?>"><?php echo $field_args['label']; ?></label>
    				</th>
    				<td>
    					<?php $field_args['label'] = false; ?>
    					<?php woocommerce_form_field( $key, $field_args, $value ); ?>
    				</td>
    			</tr>
    		<?php } ?>
    		</tbody>
    	</table>
    	<?php
    }
    
    add_action( 'show_user_profile', 'iconic_print_user_admin_fields', 30 ); // admin: edit profile
    add_action( 'edit_user_profile', 'iconic_print_user_admin_fields', 30 ); // admin: edit other users
    
    /**
     * Validate fields on frontend.
     *
     * @param WP_Error $errors
     *
     * @return WP_Error
     */
    function iconic_validate_user_frontend_fields( $errors ) {
    	$fields = iconic_get_account_fields();
    
    	foreach ( $fields as $key => $field_args ) {
    		if ( empty( $field_args['required'] ) ) {
    			continue;
    		}
    
    		if ( ! isset( $_POST['register'] ) && ! empty( $field_args['hide_in_account'] ) ) {
    			continue;
    		}
    
    		if ( isset( $_POST['register'] ) && ! empty( $field_args['hide_in_registration'] ) ) {
    			continue;
    		}
    
    		if ( empty( $_POST[ $key ] ) ) {
    			$message = sprintf( __( '%s is a required field.', 'iconic' ), '<strong>' . $field_args['label'] . '</strong>' );
    			$errors->add( $key, $message );
    		}
    	}
    
    	return $errors;
    }
    
    add_filter( 'woocommerce_registration_errors', 'iconic_validate_user_frontend_fields', 10 );
    add_filter( 'woocommerce_save_account_details_errors', 'iconic_validate_user_frontend_fields', 10 );
    
    /**
     * Show fields at checkout.
     */
    function iconic_checkout_fields( $checkout_fields ) {
    	$fields = iconic_get_account_fields();
    
    	foreach ( $fields as $key => $field_args ) {
    		if ( ! iconic_is_field_visible( $field_args ) ) {
    			continue;
    		}
    
    		// Make sure our fields have a default priority so
    		// no error is thrown when sorting them.
    		$field_args['priority'] = isset( $field_args['priority'] ) ? $field_args['priority'] : 0;
    
    		$checkout_fields['account'][ $key ] = $field_args;
    	}
    
    	// Default password field has no priority which throws an
    	// error when it tries to order the fields by priority.
    	if ( ! empty( $checkout_fields['account']['account_password'] ) && ! isset( $checkout_fields['account']['account_password']['priority'] ) ) {
    		$checkout_fields['account']['account_password']['priority'] = 0;
    	}
    
    	return $checkout_fields;
    }
    
    add_filter( 'woocommerce_checkout_fields', 'iconic_checkout_fields', 10, 1 );

     

  • 회원가입 페이지의 필드 순서를 변경하는 건

    iconic_get_account_fields 함수 쪽의 배열의 순서를 조절해보시겠어요?

    CSS 코드로 한 줄에 2개씩 표시하는 건

    float left 속성과 width: 50%를 활용하면 가능할 듯합니다.

    아래 관련 링크를 참고해보시겠어요?

    https://stackoverflow.com/questions/15164288/floating-two-50-width-divs-with-a-10px-margin-between

    고맙습니다.

  • 안녕하세요?

    1. 말씀하신 정렬하라는 것의 정확한 의미를 몰라서 못해봤습니다.

    2. 두줄로 배치하기 위해 https://ownergolf.net/my-account/를 기반으로 며칠밤을세워서 이런 저런 시도를 해보았지만 작동하지 않습니다.네요.

    가장 최근에 시도한 코드는 아래와같습니다.  혹시 어디가 문제인지 봐주실 수 있나요?

    위에서 말씀드린대로 사이트 페이지는 https://ownergolf.net/my-account/ 입니다.

    /*
     * 우커머스 계정 등록 필드 순서 및 좌우 정렬  - 작동하지 않음 
     * 참조 : https://stackoverflow.com/questions/52659049/woocommerce-checkout-showing-1-column-cant-seem-to-get-default-2-back
    */
    
    .woocommerce form.checkout_coupon .woocommerce form.login .woocommerce form.register{
    max-width: 100% !important;
    }
    
    #reg_username_field{
    float: left;
    width: 45%;
    }
    
    #rreg_billing_first_name_field{
    float: right;
    width: 50%;
    }
    
    #reg_billing_phone_field {
    width: 45%;
    float: left;
    }
    
    #reg_emil_field {
    width: 50%;
    float: right;
    }
    
    #reg_password_field {
    width: 100%;
    float: right;
    }
    

     

    3. 그리고  아래 그림에서 보듯이 "가입 필수 동의 사항"이라는 라벨 이름이 이상한 곳에 위치해 있습니다.

     왜 이런 현상이 나타나는지 모르겠습니다.

     

    참고 필드 추가와 관련해 적용한 php code는 아래와 같습니다.

    function iconic_get_account_fields() {
    
    
    	return apply_filters( 'iconic_account_fields', array(
    
    		'reg_billing_first_name'                 => array(
    			'type'                 => 'text',
    //            'class'                => array('iconic_field', 'form-row-first'),			
    			'label'                => __( '이름', 'iconic' ),
    			'label_class'          => 'iconic_billing_first_name',
                'placeholder'          => __( '성+이름 추천해요', 'iconic' ),
    
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => false,
    			'hide_in_registration' => false,
    			'required'             => true,
    		),
    
    		'reg_billing_phone'                 => array(
    			'type'                 => 'tel',
    //            'class'                => array('iconic_field', 'form-row-last'),	
    			'label'                => __( '전화번호', 'iconic' ),
    			'label_class'          => 'iconic_billing_phone',			
                'placeholder'          => __( '주연락 휴대 전화번호', 'iconic' ),			
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => false,
    			'hide_in_registration' => false,
    			'required'             => true,
    		),		
    
    
    		'iconic-register-region-select'     => array(
               'type'    => 'select',
               'class'                => array('iconic_field', 'form-row-first'),		           
          
               'label'   => __( '활동지역 선택', 'iconic' ),
    		   'label_class'          => 'iconic-register-region-select',	           
               'options' => array(
     //              '' => __( '서울시', 'iconic' ),
                   1  => __( '서울시', 'iconic' ),
                   2  => __( '인천시', 'iconic' ),
                   3  => __( '경기도 북부', 'iconic' ),
                   4  => __( '경기도 남부', 'iconic' ),
                   5  => __( '충북', 'iconic' ),
                   6  => __( '충남', 'iconic' ),
                   7  => __( '경북', 'iconic' ),
                   8  => __( '경남', 'iconic' ),
                   9  => __( '전북', 'iconic' ),
                   10  => __( '전남', 'iconic' ), 
                   11  => __( '제주', 'iconic' ),                          
    		    ),
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => false,
    			'hide_in_registration' => false,           
    			'required' => false,
    		),
    
    		'iconic-register-ability-select'     => array(
               'type'    => 'select',
               'class'                => array('iconic_field', 'form-row-last'),	           
              
               'label'   => __( '골프수준 선택', 'iconic' ),
    		   'label_class'          => 'iconic-register-ability-select',	            
               'options' => array(
     //              '' => __( '90이상', 'iconic' ),
    
                   2  => __( '90이상', 'iconic' ),
                   1  => __( '100이상', 'iconic' ),
                   3  => __( '80이상', 'iconic' ),
                   4  => __( '70대', 'iconic' ),                        
    		    ),
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => false,
    			'hide_in_registration' => false,           
    			'required' => false,
    		),
    
    
    
    		'iconic-register-checkboxes-required' => array(
    			'type'     => 'checkboxes', 'checked',	
                'class'                => array('iconic_field', 'form-row-wide'),	
    
    			'label'    => __( '가입 필수 동의 사항', 'iconic' ),
    		    'label_class'          => 'iconic-register-checkboxes-required',	 			
    			'options'  => array(
    				1 => __( '[필수] 만 14세 이상 확인', 'iconic' ),
    				1 => __( '[필수] <a href="https://ownergolf.net/privacy-policy/" target="_blank">개인보호정책</a> 및 <a href="https://ownergolf.net/terms-of-service/" target="_blank">이용 약관</a> 동의', 'iconic' ),
    
    				2 => __( '[필수] 사용 경험 강화를 위한 <a href="https://ownergolf.net/위치-정보-이용-정책/" target="_blank">위치 정보 이용</a> 동의', 'iconic' ),		
    				3 => __( '[필수] 서비스 관련 메일/SMS 등 <a href="https://ownergolf.net/커뮤니케이션-정책/" target="_blank">커뮤니케이션</a> 동의', 'iconic' ),							
    			),
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => true,
    			'hide_in_registration' => false,			
    			'required' => true, 
    			'value' => array(1, 2, 3, 4)
    
    		), 
    
    		'iconic-register-checkboxes-option' => array(
    			'type'     => 'checkboxes', 'checked',
    //            'class'                => array('iconic_field', 'form-row-wide'),			
    	
    			'label'    => __( '가입 선택 동의 사항', 'iconic' ),
    		    'label_class'          => 'iconic-register-checkboxes-option',			
    			'options'  => array(
    
    				1 => __( '[선택] 마케팅 정보 제공 <a href="https://ownergolf.net/커뮤니케이션-정책/" target="_blank">메일/SMS 등 수신</a> 동의', 'iconic' ),	
    				2 => __( '[선택] 새로운 서비스를 위한 <a href="https://ownergolf.net/제3자-개인-정보-제공-정책/" target="_blank">제3자 개인 정보 제공</a> 동의', 'iconic' ),				
    			),
    			'hide_in_account'      => false,
    			'hide_in_admin'        => false,
    			'hide_in_checkout'     => true,
    			'hide_in_registration' => false,			
    			'required' => false,
                'value' => array(1, 2)			
    		),
    
    	) );
    }

     

  • 안녕하세요.

    1. 현재 표시되는 필드의 순서가 원하는 대로 표시되고 있다면

    별도로 수정하지 않으셔도 될 듯합니다.

     

    2. 두줄로 표시되는 건 어느 필드를 말씀하시는 건지 알려주시면

    도움 드릴 방법을 찾아보겠습니다.

     

    3. 올려주신 페이지에서 가입 필수 동의 사항 쪽 레이블이 깨지는 문제는

    아래의 CSS 코드를 추가해서 확인해보시겠어요?

    .woocommerce form .form-row { float: left; }

    고맙습니다.

  • 안녕하세요?

    하고 싶은것은 필드의 순서를 바꾸고 싶은게 가장 크고 그 다음으로는 효율적으로 보이기 위해서 한줄에 두개 필드를 배치하고 싶습니다.

    아시다시피 회원 가입위해 제가 구성한 필드는

    1. 우커머스가 기본으로 제공하는 reg_username, reg_email, reg_password 

    2. 제가 추가한 reg_billing_first_name, reg_billing_phone, 그리소 거주지 선택, 골프 실력 등이 있습니다.

    제가 추가한 custom field는 어찌어찌해서 일부 목표는 달성해 가고 있는데 우커머스에서 제공한 필드는 난공불락이네요.  한줄에 두필드 정렬도 안되고 커스텀 필드와 순서를 조정하는 것도 안됩니다.

     

    내가 하고 싶은 것은 피드 순서를 조정하고 가능하는한 한줄에 2개가 보이도록 하는 것입니다.

    즉 

    첫줄 reg_username(사용자이름-이는 ID입니다), reg_billing_first_name(이름) 

    둘째줄 reg_billing_phone(전화번호), reg_email(이메일)

    셋째줄 reg_password(비밀번호)

    넷째줄 활동지역, 골프 실력

    다섯째 필수 동의 사항

    여섯째 옵션 동의 사항 으로 구성하고 싶습니다.

     설명이 제대로 되었는지 모르겠습니다.

     

    솔직히 너무 많이 도아주셔서 이런 글을 적는것도 미안할 따름입니다. 그런데 여쭈어볼데가 마땅치않네요.

    여러가지로 고맙고 미압합니다.

  • 코드 수정이 어려우실 경우,

    아래 플러그인을 사용하시면

    우커머스 Account 필드를 관리하실 수 있습니다.

    Woocommerce Extra Registration Fields

    설치해서 테스트해보시겠어요?

    고맙습니다.

  • 안녕하세요?

    지금가지 알려주신대로 열심히 따라해서 아직 마음에는 안들지만 어느정도 만들었습니다.

    그런데 문제가 또하나 생겼네요.
    이번엔 로그인쪽 에서 로그인버튼, 기억하기 그리고 비밀번호 문구가 이상한 곳에 가 있는데요.
    하나를 해결하면 다른 문제가 나오고 참 어렵네요.

    죄송하지만  로그인버튼, 기억하기 그리고 비밀번호 문구를 정상적인 곳에 위치시키려면 어찌해야 하는지 도와주세요.

    링크 주소는  https://ownergolf.net/my-account/

    현상 이미지는 아래와 같습니다.

  • 안녕하세요~^^

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가해보시겠어요?

    .woocommerce form.login .woocommerce-LostPassword { clear: both; }
    .woocommerce form.login .form-row:nth-child(3) { width: 100%; }

     

    레이아웃 수정 시 HTML과 CSS 코드에 대해 알면 도움이 됩니다.

    크롬 브라우저 개발자 도구(F12)를 사용하시면

    CSS 속성을 쉽게 찾을 수 있고 테스트해보실 수 있습니다.

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기