Extra row / text field to a product page (WooCommerce)

Question

The problem is not for variable products. It’s a separate tab. So if you want to add the custom field in general tab, it does not effect on the variable tab or any other tab.

However, I am giving you the updated code of products to add the custom field.
I am showing for general data, variable data, and custom tab field.

If you want to use functions.php, put my code in functions.php.

Theme function

    //function.php
//General Fields
add_action( 'woocommerce_product_options_general_product_data', 'woo_add_custom_general_fields',10,3 );
add_action( 'woocommerce_process_product_meta', 'woo_add_custom_general_fields_save',10,2 );
//variable data
add_action('woocommerce_product_after_variable_attributes', 'variation_settings_fields', 10, 3);
add_action('woocommerce_save_product_variation','save_variation_settings_fields',10, 2);

//data tab
add_filter( 'woocommerce_product_data_tabs', 'add_my_custom_product_data_tab' , 99 , 1 );
add_action( 'woocommerce_product_data_panels', 'add_my_custom_product_data_fields',10,3 );
add_action( 'woocommerce_process_product_meta','woocommerce_process_product_meta_fields_save',10,2 );
function woo_add_custom_general_fields() {

global $woocommerce, $post;
woocommerce_wp_text_input(
  array(
    'id'          => '_text_field',
    'label'       => __( 'My Text Field', 'woocommerce' ),
    'placeholder' => 'http://',
    'desc_tip'    => 'true',
    'value'       => get_post_meta( $post->ID, '_text_field', true ),
    'description' => __( 'Enter the custom value here.', 'woocommerce' )
  )
);
// Number Field
    woocommerce_wp_text_input(
      array(
        'id'          => '_number_field[' . $post->ID . ']',
        'label'       => __( 'My Number Field', 'woocommerce' ),
        'desc_tip'    => 'true',
        'description' => __( 'Enter the custom number here.', 'woocommerce' ),
        'value'       => get_post_meta( $post->ID, '_number_field', true ),
        'custom_attributes' => array(
                'step'  => 'any',
                'min' => '0'
              )
      )
    );
    // Textarea
    woocommerce_wp_textarea_input(
      array(
        'id'          => '_textarea[' . $post->ID . ']',
        'label'       => __( 'My Textarea', 'woocommerce' ),
        'placeholder' => '',
        'description' => __( 'Enter the custom value here.', 'woocommerce' ),
        'value'       => get_post_meta( $post->ID, '_textarea', true ),
      )
    );
    // Select
    woocommerce_wp_select(
      array(
      'id'          => '_select[' . $post->ID . ']',
      'label'       => __( 'My Select Field', 'woocommerce' ),
      'description' => __( 'Choose a value.', 'woocommerce' ),
      'value'       => get_post_meta( $post->ID, '_select', true ),
      'options' => array(
        'one'   => __( 'Option 1', 'woocommerce' ),
        'two'   => __( 'Option 2', 'woocommerce' ),
        'three' => __( 'Option 3', 'woocommerce' )
        )
      )
    );
    // Checkbox
    woocommerce_wp_checkbox(
      array(
        'id'            => '_checkbox[' . $post->ID . ']',
        'label'         => __('My Checkbox Field', 'woocommerce' ),
        'description'   => __( 'Check me!', 'woocommerce' ),
        'value'         => get_post_meta( $post->ID, '_checkbox', true ),
        )
    );
    // Hidden field
    woocommerce_wp_hidden_input(
      array(
        'id'    => '_hidden_field[' . $post->ID . ']',
        'value' => 'hidden_value'
        )
    );
}

function woo_add_custom_general_fields_save( $post_id ){

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

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

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

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

}

function variation_settings_fields($loop, $variation_data, $variation){
  // Text Field
    woocommerce_wp_text_input(
      array(
        'id'          => 'statement[' . $variation->ID . ']',
        'label'       => __( 'Statement Cost', 'woocommerce' ),
        'placeholder' => 'Statement Cost',
        'desc_tip'    => 'true',
        'description' => __( 'Statement Cost.', 'woocommerce' ),
        'value'       => get_post_meta( $variation->ID, 'statement', true )
      )
    );
    // Number Field
    woocommerce_wp_text_input(
      array(
        'id'          => '_number_field[' . $variation->ID . ']',
        'label'       => __( 'My Number Field', 'woocommerce' ),
        'desc_tip'    => 'true',
        'description' => __( 'Enter the custom number here.', 'woocommerce' ),
        'value'       => get_post_meta( $variation->ID, '_number_field', true ),
        'custom_attributes' => array(
                'step'  => 'any',
                'min' => '0'
              )
      )
    );
    // Textarea
    woocommerce_wp_textarea_input(
      array(
        'id'          => '_textarea[' . $variation->ID . ']',
        'label'       => __( 'My Textarea', 'woocommerce' ),
        'placeholder' => '',
        'description' => __( 'Enter the custom value here.', 'woocommerce' ),
        'value'       => get_post_meta( $variation->ID, '_textarea', true ),
      )
    );
    // Select
    woocommerce_wp_select(
      array(
      'id'          => '_select[' . $variation->ID . ']',
      'label'       => __( 'My Select Field', 'woocommerce' ),
      'description' => __( 'Choose a value.', 'woocommerce' ),
      'value'       => get_post_meta( $variation->ID, '_select', true ),
      'options' => array(
        'one'   => __( 'Option 1', 'woocommerce' ),
        'two'   => __( 'Option 2', 'woocommerce' ),
        'three' => __( 'Option 3', 'woocommerce' )
        )
      )
    );
    // Checkbox
    woocommerce_wp_checkbox(
      array(
        'id'            => '_checkbox[' . $variation->ID . ']',
        'label'         => __('My Checkbox Field', 'woocommerce' ),
        'description'   => __( 'Check me!', 'woocommerce' ),
        'value'         => get_post_meta( $variation->ID, '_checkbox', true ),
        )
    );
    // Hidden field
    woocommerce_wp_hidden_input(
      array(
        'id'    => '_hidden_field[' . $variation->ID . ']',
        'value' => 'hidden_value'
        )
    );
}

function save_variation_settings_fields($post_id){
  // Text Field
  $text_field = $_POST['statement'][ $post_id ];
  if( ! empty( $text_field ) ) {
    update_post_meta( $post_id, 'statement', esc_attr( $text_field ) );
  }
  // Number Field
  $number_field = $_POST['_number_field'][ $post_id ];
  if( ! empty( $number_field ) ) {
    update_post_meta( $post_id, '_number_field', esc_attr( $number_field ) );
  }
  // Textarea
  $textarea = $_POST['_textarea'][ $post_id ];
  if( ! empty( $textarea ) ) {
    update_post_meta( $post_id, '_textarea', esc_attr( $textarea ) );
  }

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

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

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

function add_my_custom_product_data_tab( $product_data_tabs ) {
  $product_data_tabs['my-custom-tab'] = array(
      'label' => __( 'My Custom Tab', 'my_text_domain' ),
      'target' => 'my_custom_product_data',
  );
  return $product_data_tabs;
}
function add_my_custom_product_data_fields() {
  global $woocommerce, $post;
    echo '<div id="my_custom_product_data" class="panel woocommerce_options_panel">';
      woocommerce_wp_checkbox( array(
          'id'            => '_my_custom_field',
          'wrapper_class' => 'show_if_simple',
          'label'         => __( 'My Custom Field Label', 'my_text_domain' ),
          'description'   => __( 'My Custom Field Description', 'my_text_domain' ),
          'default'       => '0',
          'desc_tip'      => false,
      ) );
    echo '</div>';

}

function woocommerce_process_product_meta_fields_save( $post_id ){
$woo_checkbox = isset( $_POST['_my_custom_field'] ) ? 'yes' : 'no';
  update_post_meta( $post_id, '_my_custom_field', $woo_checkbox );
}

If you use custom plugin.
Plugin Code
//create class and put my code

    <?php
    /**
     * Add Cutom Fields Woocommerce product type functionality
     */
    class AddCutomFields
    {
    public static function init(){
        //General Fields
        add_action( 'woocommerce_product_options_general_product_data',array('AddCutomFields', 'woo_add_custom_general_fields'),10,3 );
        add_action( 'woocommerce_process_product_meta', array('AddCutomFields', 'woo_add_custom_general_fields_save'),10,2 );

        //variable data
        add_action('woocommerce_product_after_variable_attributes', array('AddCutomFields','variation_settings_fields'), 10, 3);
        add_action('woocommerce_save_product_variation', array('AddCutomFields','save_variation_settings_fields' ),10, 2);

        //data tab
        add_filter( 'woocommerce_product_data_tabs', array('AddCutomFields','add_my_custom_product_data_tab') , 99 , 1 );
        add_action( 'woocommerce_product_data_panels', array('AddCutomFields','add_my_custom_product_data_fields'),10,3 );
        add_action( 'woocommerce_process_product_meta',  array('AddCutomFields','woocommerce_process_product_meta_fields_save'),10,2 );
    }

    public static function woo_add_custom_general_fields() {

      global $woocommerce, $post;
      woocommerce_wp_text_input(
        array(
          'id'          => '_text_field',
          'label'       => __( 'My Text Field', 'woocommerce' ),
          'placeholder' => 'http://',
          'desc_tip'    => 'true',
          'value'       => get_post_meta( $post->ID, '_text_field', true ),
          'description' => __( 'Enter the custom value here.', 'woocommerce' )
        )
      );
      // Number Field
          woocommerce_wp_text_input(
            array(
              'id'          => '_number_field[' . $post->ID . ']',
              'label'       => __( 'My Number Field', 'woocommerce' ),
              'desc_tip'    => 'true',
              'description' => __( 'Enter the custom number here.', 'woocommerce' ),
              'value'       => get_post_meta( $post->ID, '_number_field', true ),
              'custom_attributes' => array(
                      'step'  => 'any',
                      'min' => '0'
                    )
            )
          );
          // Textarea
          woocommerce_wp_textarea_input(
            array(
              'id'          => '_textarea[' . $post->ID . ']',
              'label'       => __( 'My Textarea', 'woocommerce' ),
              'placeholder' => '',
              'description' => __( 'Enter the custom value here.', 'woocommerce' ),
              'value'       => get_post_meta( $post->ID, '_textarea', true ),
            )
          );
          // Select
          woocommerce_wp_select(
            array(
            'id'          => '_select[' . $post->ID . ']',
            'label'       => __( 'My Select Field', 'woocommerce' ),
            'description' => __( 'Choose a value.', 'woocommerce' ),
            'value'       => get_post_meta( $post->ID, '_select', true ),
            'options' => array(
              'one'   => __( 'Option 1', 'woocommerce' ),
              'two'   => __( 'Option 2', 'woocommerce' ),
              'three' => __( 'Option 3', 'woocommerce' )
              )
            )
          );
          // Checkbox
          woocommerce_wp_checkbox(
            array(
              'id'            => '_checkbox[' . $post->ID . ']',
              'label'         => __('My Checkbox Field', 'woocommerce' ),
              'description'   => __( 'Check me!', 'woocommerce' ),
              'value'         => get_post_meta( $post->ID, '_checkbox', true ),
              )
          );
          // Hidden field
          woocommerce_wp_hidden_input(
            array(
              'id'    => '_hidden_field[' . $post->ID . ']',
              'value' => 'hidden_value'
              )
          );
    }

    public static function woo_add_custom_general_fields_save( $post_id ){

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

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

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

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

    }

    public static function variation_settings_fields($loop, $variation_data, $variation){
        // Text Field
          woocommerce_wp_text_input(
            array(
              'id'          => 'statement[' . $variation->ID . ']',
              'label'       => __( 'Statement Cost', 'woocommerce' ),
              'placeholder' => 'Statement Cost',
              'desc_tip'    => 'true',
              'description' => __( 'Statement Cost.', 'woocommerce' ),
              'value'       => get_post_meta( $variation->ID, 'statement', true )
            )
          );
          // Number Field
          woocommerce_wp_text_input(
            array(
              'id'          => '_number_field[' . $variation->ID . ']',
              'label'       => __( 'My Number Field', 'woocommerce' ),
              'desc_tip'    => 'true',
              'description' => __( 'Enter the custom number here.', 'woocommerce' ),
              'value'       => get_post_meta( $variation->ID, '_number_field', true ),
              'custom_attributes' => array(
                      'step'  => 'any',
                      'min' => '0'
                    )
            )
          );
          // Textarea
          woocommerce_wp_textarea_input(
            array(
              'id'          => '_textarea[' . $variation->ID . ']',
              'label'       => __( 'My Textarea', 'woocommerce' ),
              'placeholder' => '',
              'description' => __( 'Enter the custom value here.', 'woocommerce' ),
              'value'       => get_post_meta( $variation->ID, '_textarea', true ),
            )
          );
          // Select
          woocommerce_wp_select(
            array(
            'id'          => '_select[' . $variation->ID . ']',
            'label'       => __( 'My Select Field', 'woocommerce' ),
            'description' => __( 'Choose a value.', 'woocommerce' ),
            'value'       => get_post_meta( $variation->ID, '_select', true ),
            'options' => array(
              'one'   => __( 'Option 1', 'woocommerce' ),
              'two'   => __( 'Option 2', 'woocommerce' ),
              'three' => __( 'Option 3', 'woocommerce' )
              )
            )
          );
          // Checkbox
          woocommerce_wp_checkbox(
            array(
              'id'            => '_checkbox[' . $variation->ID . ']',
              'label'         => __('My Checkbox Field', 'woocommerce' ),
              'description'   => __( 'Check me!', 'woocommerce' ),
              'value'         => get_post_meta( $variation->ID, '_checkbox', true ),
              )
          );
          // Hidden field
          woocommerce_wp_hidden_input(
            array(
              'id'    => '_hidden_field[' . $variation->ID . ']',
              'value' => 'hidden_value'
              )
          );
    }

    public static function save_variation_settings_fields($post_id){
        // Text Field
        $text_field = $_POST['statement'][ $post_id ];
        if( ! empty( $text_field ) ) {
          update_post_meta( $post_id, 'statement', esc_attr( $text_field ) );
        }
        // Number Field
        $number_field = $_POST['_number_field'][ $post_id ];
        if( ! empty( $number_field ) ) {
          update_post_meta( $post_id, '_number_field', esc_attr( $number_field ) );
        }
        // Textarea
        $textarea = $_POST['_textarea'][ $post_id ];
        if( ! empty( $textarea ) ) {
          update_post_meta( $post_id, '_textarea', esc_attr( $textarea ) );
        }

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

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

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

    public static function add_my_custom_product_data_tab( $product_data_tabs ) {
        $product_data_tabs['my-custom-tab'] = array(
            'label' => __( 'My Custom Tab', 'my_text_domain' ),
            'target' => 'my_custom_product_data',
        );
        return $product_data_tabs;
    }
    public static function add_my_custom_product_data_fields() {
        global $woocommerce, $post;
          echo '<div id="my_custom_product_data" class="panel woocommerce_options_panel">';
            woocommerce_wp_checkbox( array(
                'id'            => '_my_custom_field',
                'wrapper_class' => 'show_if_simple',
                'label'         => __( 'My Custom Field Label', 'my_text_domain' ),
                'description'   => __( 'My Custom Field Description', 'my_text_domain' ),
                'default'       => '0',
                'desc_tip'      => false,
            ) );
          echo '</div>';

    }

    public static function woocommerce_process_product_meta_fields_save( $post_id ){
      $woo_checkbox = isset( $_POST['_my_custom_field'] ) ? 'yes' : 'no';
        update_post_meta( $post_id, '_my_custom_field', $woo_checkbox );
    }

}

To get those values we just need to use the popular get_post_meta() function.

<?php
// Display Custom Field Value
echo get_post_meta( $post->ID, 'my-field-slug', true );
ex. echo get_post_meta( $post->ID, '_textarea', true );
// You can also use
echo get_post_meta( get_the_ID(), 'my-field-slug', true );
ex. echo get_post_meta( get_the_ID(), '_textarea', true );

// variable data 
ex. echo get_post_meta( $variation->ID, '_textarea', true );
?>

The code is tested and worked fine. If you trouble anywhere, don’t hesitate to ask anything again.
If you need help to add the custom field for shipping tab or any other tab, let me know I will update my code since future.

NB. The code of plugins and functions.php are same. You use either functions.php or custom plugin code.

Related Posts: