How to add custom field in Woocommerce product's data tab?

Forums WoocommerceHow to add custom field in Woocommerce product's data tab?
Staff asked 5 years ago

Answers (1)

Add Answer
Het Patel Marked As Accepted
Staff answered 3 years ago

You can follow the below code as reference to insert the custom fields in the WooCommerce product’s Data Tab.

// Display Fields using WooCommerce Action Hook
add_action( 'woocommerce_product_options_general_product_data', 'woocom_general_product_data_custom_field' );

function woocom_general_product_data_custom_field() {
// Create a custom text field

// Text Field
woocommerce_wp_text_input(
  array(
    'id' => '_text_field',
    'label' => __( 'Custom Text Field', 'woocommerce' ),
    'placeholder' => 'Custom text field',
    'desc_tip' => 'true',
    'description' => __( 'Enter the custom value here.', 'woocommerce' )
  )
);

// Number Field
woocommerce_wp_text_input(
  array(
    'id' => '_number_field',
    'label' => __( 'Custom Number Field', 'woocommerce' ),
    'placeholder' => '',
    'description' => __( 'Enter the custom value here.', 'woocommerce' ),
    'type' => 'number',
    'custom_attributes' => array(
    'step' => 'any',
    'min' => '15'
  )
)
);

// Checkbox
woocommerce_wp_checkbox(
  array(
    'id' => '_checkbox',
    'label' => __('Custom Checkbox Field', 'woocommerce' ),
    'description' => __( 'Check me!', 'woocommerce' )
  )
);

// Select
woocommerce_wp_select(
  array(
    'id' => '_select',
    'label' => __( 'Custom Select Field', 'woocommerce' ),
    'options' => array(
      'one' => __( 'Custom Option 1', 'woocommerce' ),
      'two' => __( 'Custom Option 2', 'woocommerce' ),
      'three' => __( 'Custom Option 3', 'woocommerce' )
    )
  )
);

// Textarea
woocommerce_wp_textarea_input(
  array(
    'id' => '_textarea',
    'label' => __( 'Custom Textarea', 'woocommerce' ),
    'placeholder' => '',
    'description' => __( 'Enter the custom value here.', 'woocommerce' )
  )
);

}

// Hook to save the data value from the custom fields
add_action( 'woocommerce_process_product_meta', 'woocom_save_general_proddata_custom_field' );

/** Hook callback function to save custom fields information */
function woocom_save_general_proddata_custom_field( $post_id ) {
  // Save Text Field
  $text_field = $_POST['_text_field'];
  if( ! empty( $text_field ) ) {
    update_post_meta( $post_id, '_text_field', esc_attr( $text_field ) );
  }

  // Save Number Field
  $number_field = $_POST['_number_field'];
  if( ! empty( $number_field ) ) {
    update_post_meta( $post_id, '_number_field', esc_attr( $number_field ) );
  }
  // Save Textarea
  $textarea = $_POST['_textarea'];
  if( ! empty( $textarea ) ) {
    update_post_meta( $post_id, '_textarea', esc_html( $textarea ) );
  }

  // Save Select
  $select = $_POST['_select'];
  if( ! empty( $select ) ) {
    update_post_meta( $post_id, '_select', esc_attr( $select ) );
  }

  // Save Checkbox
  $checkbox = isset( $_POST['_checkbox'] ) ? 'yes' : 'no';
  update_post_meta( $post_id, '_checkbox', $checkbox );

  // Save Hidden field
  $hidden = $_POST['_hidden_field'];
  if( ! empty( $hidden ) ) {
    update_post_meta( $post_id, '_hidden_field', esc_attr( $hidden ) );
  }
}

 

WooCommerce Products Custom Field - How to Add WooCommerce Custom Fields to Products

Subscribe

Select Categories