wordpress - Display custom fileds in variations product page Woocommerce -


i've created 2 custom fields in variations following code (thanks remi corso):

functions.php

add variation settings

add_action( 'woocommerce_product_after_variable_attributes', 'variation_settings_fields', 10, 3 ); 

save variation settings

add_action( 'woocommerce_save_product_variation', 'save_variation_settings_fields', 10, 2 ); 

create new fields variations

function variation_settings_fields( $loop, $variation_data, $variation ) {     woocommerce_wp_text_input(          array(              'id'          => '_pdf_ficha_tecnica[' . $variation->id . ']',              'label'       => __( 'pdf ficha tÉcnica', 'woocommerce' ),              'placeholder' => 'http://',             'desc_tip'    => 'true',             'description' => __( 'aqui', 'woocommerce' ),             'value'       => get_post_meta( $variation->id, '_pdf_ficha_tecnica', true )         )     );       woocommerce_wp_text_input(          array(              'id'          => '_pdf_ficha_caracteristicas[' . $variation->id . ']',              'label'       => __( 'pdf ficha caracterÍsticas', 'woocommerce' ),              'placeholder' => 'http://',             'desc_tip'    => 'true',             'description' => __( 'aqui', 'woocommerce' ),             'value'       => get_post_meta( $variation->id, '_pdf_ficha_caracteristicas', true )         )     ); } 

save new fields variations

function save_variation_settings_fields( $post_id ) {     $text_field = $_post['_pdf_ficha_tecnica'][ $post_id ];     if( ! empty( $text_field ) ) {         update_post_meta( $post_id, '_pdf_ficha_tecnica', esc_attr( $text_field ) );     }     $text_field = $_post['_pdf_ficha_caracteristicas'][ $post_id ];     if( ! empty( $text_field ) ) {         update_post_meta( $post_id, '_pdf_ficha_caracteristicas', esc_attr( $text_field ) );     } } 

these custom fields store urls , displayed links . looking displaying these fields i'm having lot of troubles finding right solution.

can guide me? should focus on file "variable.php"? , js? or can render fields hooks?

thanks in advance!

the following code created works perfectly. new js , i'm sure can improved. hope helpful. create custom fields reads post of remi.

explanation: "wc_product variable" object can display custom fields of product variation,

to display these fields used jquery, contents of span "sku" our reference shown on product page. code in "variations.php" file.

<?php  // "wc_product variable" object custom fields variations.  $product_id = $product->id; $variation = new wc_product_variable( $product_id ); $arrvariations = $variation->get_children ();  // foreach construct div contain custom fields  foreach ($arrvariations $varid) {     $cfvalone = get_post_meta( $varid, '_custom_field_one', true );     $cfvaltwo = get_post_meta( $varid, '_custom_field_two', true );  // check custom fields not empty      if (!empty($cfvalone) or !empty($cfvaltwo) ) {          $cfonecont = get_post_meta( $varid, '_custom_field_one', true );         $cftwocont = get_post_meta( $varid, '_custom_field_two', true );         $varsku = get_post_meta( $varid, '_sku', true );  // built div , embed sku of variation processed later js. ?>     <div class="varskudiv" data-varskudiv="<? echo $varsku;?>" style="display:none;">         <?php if (!empty($cfonecont)) {?>             <a href="<? echo $cfonecont;?>">custom field one</a>         <?php } ?>         <?php if (!empty($cftwocont)) {?>             <a href="<? echo $cftwocont;?>">custom field two</a>         <?php } ?>     </div>     <? }}?>     <br/> <script>    jquery(document).ready(function( $ ) {     // take contents of span "sku" create js      //we must consider span complete once screen loaded.      $(window).bind("load", function() {     woosku = $(".sku").text();     // map div created "varskudiv" , load values in array     wooarrsku = $('div.varskudiv').map(function(){         return $(this).data('varskudiv');     }).get();     // make loop, if values match show div.     var indexsku;     (indexsku = 0; indexsku < wooarrsku.length; indexsku++) {     if (woosku == wooarrsku[indexsku]) {         $('.varskudiv[data-varskudiv="'+ woosku +'"]').css( "display", "inline-block" );         }     }     });     // once loaded screen, if span "sku" changes, start process again , hide previous div displayed.      $('.sku').bind("domsubtreemodified",function(){       woosku = $(".sku").text();         wooarrsku = $('div.varskudiv').map(function(){             return $(this).data('varskudiv');         }).get();         var indexsku;         (indexsku = 0; indexsku < wooarrsku.length; indexsku++) {         if (woosku == wooarrsku[indexsku]) {             $('.varskudiv[data-varskudiv="'+ woosku +'"]').css( "display", "inline-block" );             }         else {$('.varskudiv[data-varskudiv="'+ wooarrsku[indexsku] +'"]').css( "display", "none" );             }         }     }); }); </script> 

Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

javascript - Get parameter of GET request -

javascript - Twitter Bootstrap - how to add some more margin between tooltip popup and element -