将自定义字段添加到WooCommerce商店存档页面

Question

作为一个标准，woocommerce存档页面显示产品，图像，标题和购买“按钮”并排堆叠。我想要的是也要显示自定义字段，例如SKU，颜色等。

我设法将代码添加到functions.php中，该代码调用页面上每种产品的自定义字段。

function my_function() {

    global $product;


    $my_custom_element_1 = get_post_meta( $product->id, 'my_custom_element_1', true );
    $my_custom_element_2 = get_post_meta( $product->id, 'my_custom_element_2', true );


    $my_custom_element_1 = str_replace( '_', ' ', $my_custom_element_1 );


    if ( ! empty( $my_custom_element_1 ) ) {
        echo '<div class="product-meta"><span class="product-meta-title">my_custom_element_1:</span> ' . ucwords( $my_custom_element_1 ) . '</div>';
    }

    if ( ! empty( $my_custom_element_2 ) ) {
        echo '<div class="product-meta"><span class="product-meta-title">Skymy_custom_element_2:</span> ' . $my_custom_element_2 . '</div>';
    }
}
add_action( 'woocommerce_after_shop_loop_item', 'my_function', 9 );

它本身位于div中的自定义字段组，并在页面顶部输出。我想要的是将结果输出到每个产品模块的内部，例如在产品图片下方。