在Woocommerce单一产品中，在简短说明后的简短说明后添加div

Question

我需要对Woocommerce单个产品页面进行一些样式设置：我需要在价格（我将其移至添加到购物车按钮上方的位置）周围添加边框，以库存状态添加到购物车按钮和元数据。因此，这些项目基本上是视觉边界：https://postimg.cc/image/jp6e1hpa9/

由于它们不在一个特定的div中，因此我需要在它们周围放置一个新的div。如何在上述项目周围添加此div？

Answer 1

更新

如果您已在商品价格上方将产品价格移动到带有某些代码的添加到购物车按钮上，则下面的代码将替换您的代码，因为它也会移动价格在产品简短说明下。

它还添加了一个div容器html标签，该标签开始于移动价格之前，结束于产品元数据之后（请参见最后的截图）。>>

代码：

add_action('woocommerce_single_product_summary', 'custom_single_product_price', 3 );
function custom_single_product_price() {

    // Remove product price
    remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );

    // Add back the product price after short description
    add_action('woocommerce_single_product_summary', 'woocommerce_template_single_price', 25 );

    // Opening div container (just after the product short description and before the moved product price)
    add_action('woocommerce_single_product_summary', 'opening_div_single_product_summary', 21 );

    // Closing div container (after the product meta data)
    add_action('woocommerce_single_product_summary', 'closing_div_template_single_price', 60 );
}

function opening_div_single_product_summary() {
    // Display the opening div
    echo '<div class="custom-container">';
}

function closing_div_template_single_price() {
    // Then display the closing div
    echo '</div>';
}
代码进入活动子主题（或活动主题）的function.php文件。经过测试并可以正常工作。

Answer 2

您需要从各自的主题中覆盖woocommerce模板结构。https://docs.woocommerce.com/document/template-structure/之后，请在单个产品文件夹中找到price.php（可能会在最新版本上进行更改）。我们将在此处找到价格的HTML结构。