1

An easy question for you specialists out there, but I’ve been searching and can’t find an accurate working tutorial. So I’m desperately hoping someone knows the best way to handle this:

I would like to add a unique text field to each product (they are Variable products, not sure if this matters) in which I can enter text in the backend of the product. This text would be shown on the frontend above the tabs, preferably in its own created row.

This should be able to work through the functions.php of my child theme. And I’ve already gathered this to enable the text field in the backend, but it doesn’t seem to work for me (Probably due to using Variable products or the latest Wordpress version):

// Display Fields
add_action( 'woocommerce_product_options_general_product_data', 'woo_add_custom_general_fields' );

// Save Fields
add_action( 'woocommerce_process_product_meta', 'woo_add_custom_general_fields_save' );


function woo_add_custom_general_fields_save( $post_id ){

    // Textarea
    $woocommerce_textarea = $_POST['_textarea'];
    if( !empty( $woocommerce_textarea ) )
        update_post_meta( $post_id, '_textarea', esc_html( $woocommerce_textarea ) );

}
2

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.

  • PS: Am I right that your last block of code is to display the values on the front-end? It's meant to be put in the product page php? Again, thank you so much for your kind help. Have a wonderful day! – TimVanGorp Jun 2 '17 at 22:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.