The code below is located on the elementor child theme with the following path **…woocommerce/single-product/add-to-cart/variation.php**
I already tried it with a **custom field (example-custom-field)** for the **WooCommerce Product Data** editing area and it worked fine.
But I wanted to have a a **custom field (example-custom-field)** for the **WooCommerce Product variation** editing area, so I created one.
But it doesn’t display anything. What is wrong with the code?
Any help would be appreciated
<?php
/**
* Single variation display
*
* This is a javascript-based template for single variations (see .
* The values will be dynamically replaced after selecting attributes.
*
* @see
* @package WooCommerce\Templates
* @version 2.5.0
*/
defined( ‘ABSPATH’ ) || exit;
?>
<script type=”text/template” id=”tmpl-variation-template”>
<div class=”woocommerce-variation-description”>{{{ data.variation.variation_description }}}</div>
<div class=”woocommerce-variation-price”>{{{ data.variation.price_html }}}</div>
<?php
$customFieldValue1 = get_post_meta(get_the_ID(), ‘example-custom-field’, true);
?>
<?php if (!empty($customFieldValue1)): ?>
<div class=”custom-field-content”>
€<?php echo esc_html($customFieldValue1); ?>
</div>
<?php endif; ?>
<div class=”woocommerce-variation-availability”>{{{ data.variation.availability_html }}}</div>
</script>
<script type=”text/template” id=”tmpl-unavailable-variation-template”>
<p><?php esc_html_e( ‘Sorry, this product is unavailable. Please choose a different combination.’, ‘woocommerce’ ); ?></p>
</script>