results display on front end woocommerce

Question

IN WooCommerce I am trying to display some custom data on front end:

1. A custom Shipping Cost tab. But data is not fetched on front end product display page.
   
2. Few custom fields added under general product setting tab but enable to fetch on front end product display page.

1st code *( https://stackoverflow.com/a/39010336/8523129

2nd code:

add_action('woocommerce_product_options_general_product_data', 'woocommerce_product_custom_fields');

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


function woocommerce_product_custom_fields()
{
    global $woocommerce, $post;
    echo '<div class="product_custom_field">';

    // WooCommerce custom dropdown Select
    woocommerce_wp_select(
       array(
        'id'      => '_select',
        'label'   => __( 'WooCommerce Custom Select Field', 'woocommerce' ),
        'options' => array(
            'one'   => __( 'First Dropdown', 'woocommerce' ),
            'two'   => __( 'Second Dropdown', 'woocommerce' ),
            'three' => __( 'Third Dropdown', 'woocommerce' )
            )
        )
       );
       //WooCommerce Custom Checkbox
       woocommerce_wp_checkbox(
       array(
        'id'            => '_checkbox',
        'wrapper_class' => 'show_if_simple',
        'label'         => __('WooCommerce Custom Checkbox Field', 'woocommerce' )
            )
       );
       // WooCommerce Custom field Type
       ?>
       <p class="form-field custom_field_type">
        <label for="custom_field_type"><?php echo __( 'WooCommerce Custom Field Type', 'woocommerce' ); ?></label>
        <span class="wrap">
            <?php $custom_product_field_type = get_post_meta( $post->ID, '_custom_field_type', true ); ?>
            <input placeholder="<?php _e( 'Field One', 'woocommerce' ); ?>" class="" type="number" name="_field_one" value="<?php echo $custom_product_field_type[0]; ?>" step="any" min="0" style="width: 80px;" />
            <input placeholder="<?php _e( 'Field Two', 'woocommerce' ); ?>" type="number" name="_field_two" value="<?php echo $custom_product_field_type[1]; ?>" step="any" min="0" style="width: 80px;" />
        </span>
       </p>
   <?php

   ?>
   <?php
       echo '</div>';

   }
   function woocommerce_product_custom_fields_save($post_id)
   {

       // WooCommerce custom dropdown Select
       $woocommerce_custom_product_select = $_POST['_select'];
       if (!empty($woocommerce_custom_product_select))
           update_post_meta($post_id, '_select', esc_attr($woocommerce_custom_product_select));

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

       // WooCommerce Custom field Type
       $custom_product_field_type = array(esc_attr($_POST['_field_one']), esc_attr($_POST['_field_two']));
       update_post_meta($post_id, '_custom_field_type', $custom_product_field_type);
   }
   // Custom Product  Variation Settings
   add_filter( 'woocommerce_available_variation', 'custom_load_variation_settings_products_fields' );
   function custom_load_variation_settings_products_fields( $variations ) {

    // duplicate the line for each field
    $variations['_select'] = get_post_meta( $variations[ 'variation_id' ], '_select', true );

    return $variations;
   }

I am not getting any results on display page.

How to achieve this.

Answer 1

As per your comment, to get and display the data from your product custom fields in a custom product tab on single product pages, you will use get_post_meta() function this way:

// Add product custom product tab
add_filter( 'woocommerce_product_tabs', 'custom_product_tab' );
function custom_product_tab( $tabs ) {

    $tabs['custom_tab'] = array(
        'title'     => __( 'Custom Data', 'woocommerce' ),
        'priority'  => 50,
        'callback'  => 'custom_data_product_tab_content'
    );

    return $tabs;
}

// The custom product tab content
function custom_data_product_tab_content(){
    global $post;

    // 1. Get the data
    $select = get_post_meta( $post->ID, '_select', true );
    $checkbox = get_post_meta( $post->ID, '_checkbox', true );
    $cf_type = get_post_meta( $post->ID, '_custom_field_type', true );

    // 2. Display the data
    $output = '<div class="custom-data">';

    if( ! empty( $select ) )
        $output .= '<p>'. __('Select field: ').'</span style="color:#96588a;">'.$select.'</span></p>';
    if( ! empty( $checkbox ) )
        $output .= '<p>'. __('Checkbox field: ').'</span style="color:#96588a;">'.$checkbox.'</span></p>';
    if( ! empty( $cf_type[0] ) )
        $output .= '<p>'. __('Number field 1: ').'</span style="color:#96588a;">'.$cf_type[0].'</span></p>';
    if( ! empty( $cf_type[1] ) )
        $output .= '<p>'. __('Number field 2: ').'</span style="color:#96588a;">'.$cf_type[1].'</span></p>';

    echo $output.'</div>';
}

Code goes in function.php file of your active child theme (or theme) or also in any plugin file.

Tested and works. You will get something like (and your data will be fetched if not empty):