title: Print styled HTML as custom field output from admin meta box fields in WooCommerce
body: <p>I have this code, based on <a href="https://stackoverflow.com/q/63011510/11987538">Display custom field values of product variations to custom product tab in WooCommerce</a> to display 3 custom field on WooCommerce variations.</p>
  <p>In that fields I want to insert text with HTML tags and show it in shortcode with all HTML styling (tables etc...) but current code doesn't output styled text but raw text with printed HTML tags:</p>
  <p><code>&lt;div&gt;some text etc...&lt;/div&gt;&lt;a&gt;some link&lt;/a&gt;</code></p>
  <p>Any suggestions what I did wrong here?</p>
  <pre class="lang-php prettyprint-override"><code>/* Add custom field input @ Product Data &gt; Variations &gt; Single Variation */
  add_action( 'woocommerce_variation_options', 'add_custom_field_cage_code_to_variations', 10, 3 );
  function add_custom_field_cage_code_to_variations( $loop, $variation_data, $variation ) {
      echo '&lt;div class=&quot;cage_code_options_group options_group&quot;&gt;';
          woocommerce_wp_text_input( array(
              'id' =&gt; 'cage_code[' . $loop . ']',
              'label' =&gt; __( 'One-line description', 'woocommerce' ),
              'value' =&gt; get_post_meta( $variation-&gt;ID, 'cage_code', true )
          ));
  
          woocommerce_wp_textarea_input( array(
              'id' =&gt; 'cage_code_part_number[' . $loop . ']',
              'label' =&gt; __( 'Short Description', 'woocommerce' ),
              'value' =&gt; get_post_meta( $variation-&gt;ID, 'cage_code_part_number', true )
          ));
  
          woocommerce_wp_textarea_input( array(
              'id' =&gt; 'cage_code_niin_nsn_number[' . $loop . ']',
              'label' =&gt; __( 'Long description', 'woocommerce' ),
              'value' =&gt; get_post_meta( $variation-&gt;ID, 'cage_code_niin_nsn_number', true )
          ));
      echo '&lt;/div&gt;';
  }
  
  /* Save custom field on product variation save */
  add_action( 'woocommerce_save_product_variation', 'magazine_save_custom_field_variations', 10, 2 );
  function magazine_save_custom_field_variations( $variation_id, $i ) {
      $cage_code = $_POST['cage_code'][$i];
      if ( isset( $cage_code ) ) update_post_meta( $variation_id, 'cage_code', esc_attr( 
      $cage_code ) );
  
      $cage_code_part_number = $_POST['cage_code_part_number'][$i];
      if ( isset( $cage_code ) ) update_post_meta( $variation_id, 'cage_code_part_number', 
      esc_attr( $cage_code_part_number ) );
  
      $cage_code_niin_nsn_number = $_POST['cage_code_niin_nsn_number'][$i];
      if ( isset( $cage_code_niin_nsn_number ) ) update_post_meta( $variation_id, 
      'cage_code_niin_nsn_number', esc_attr( $cage_code_niin_nsn_number ) );
  }
  
  function woo_cage_code_info_tab_content() {
       global $product;
      
      if ( $product-&gt;is_type( 'variable' ) ) {
          
          // Loop through the variation IDs
          foreach( $product-&gt;get_children() as $key =&gt; $variation_id ) {
              // Get an instance of the WC_Product_Variation Object
              $variation = wc_get_product( $variation_id );
              
              // Get meta
              $cage_code = $variation-&gt;get_meta( 'cage_code' );
              $cage_code_part_number = $variation-&gt;get_meta( 'cage_code_part_number' );
              $cage_code_niin_nsn_number = $variation-&gt;get_meta( 
       'cage_code_niin_nsn_number' );
              
              // Output
              echo '&lt;div class=&quot;woo_cage_code_info_tab_content 
       woo_cage_code_info_tab_content-' . $variation_id .'&quot;&gt;';
              
              if ( $cage_code ) {
                  echo '&lt;p&gt;' . $cage_code . '&lt;/p&gt;';
              }
              
              echo '&lt;/div&gt;';
          }
          ?&gt;
          &lt;script&gt;
          jQuery(document).ready(function($) {
              // Hide all
              $( '.woo_cage_code_info_tab_content' ).css( 'display', 'none' );
  
              // Change
              $( 'input.variation_id' ).change( function() {
                  // Hide all
                  $( '.woo_cage_code_info_tab_content' ).css( 'display', 'none' );
  
                  if( $( 'input.variation_id' ).val() != '' ) {
                      var var_id = $( 'input.variation_id' ).val();
  
                      // Display current
                      $( '.woo_cage_code_info_tab_content-' + var_id ).css( 'display', 'block' );
                  }
              });    
          });
          &lt;/script&gt;
          &lt;?php
      }
  }
  add_shortcode('woo_cage_code_info_tab_content', 'woo_cage_code_info_tab_content');
  </code></pre>