php - 电子商务 : editing product-category page outside the loop

Question

我已经构建了一个自定义的 Wordpress 主题，并将 Woo Commerce 用于购物车插件。它的大部分集成得很好(我在 functions.php 中为主题添加了钩子(Hook)，并将 Woo commerce 模板页面复制到主题中的 woocommerce 子文件夹中。)但是我试图在循环之外添加一个包装器 ()产品类别页面，我一辈子都无法弄清楚我需要编辑什么才能让它发挥作用。我需要这样做才能通过 CSS 重新定位产品。我可以将 css 应用到，但这对我来说不够具体

到目前为止我有:

• 试验过 content-product_cat.php 和 content-product.php(但两者都在循环内运行。
• 试验了许多其他模板页面
• 我已将标签添加到 wrapper-start.php 和 wrapper-end.php 页面。这适用于其他页面，但不会显示在产品类别中

我已经在网上和 Wordpress 网站上查看过，但它对此事没有提供任何帮助。任何帮助将不胜感激!

Answer 1

对于像这样的小改动，没有必要覆盖整个文件。首先尝试使用 WooCommerce 提供的 Hook 。您可以在主题 functions.php 中执行此操作。这些函数在您的首页包装器中输出自定义包装器。

 function start_wrapper_here() { // Start wrapper 
    echo '<div class="custom-wrapper">';
 }

 add_action(  'woocommerce_before_main_content', 'start_wrapper_here', 20  );


 function end_wrapper_here() { // End wrapper 
   echo '</div>';
 }

 add_action(  'woocommerce_after_main_content', 'end_wrapper_here', 20  );

如果您想在所有 WooCommerce 页面上添加独特的包装器，您可以通过向上述函数添加条件语句来实现。 Visit this page on the WooCommerce site更多条件标签。

 function start_wrapper_here() { // Start wrapper 

     if (is_shop()) { // Wrapper for the shop page

        echo '<div class="shop-wrapper">';

     } elseif (is_product_category()) {  // Wrapper for a product category page

        echo '<div class="product-category-wrapper">';

     } elseif (is_product()) { // Wrapper for a single product page

        echo '<div class="product-wrapper">';

     }
 }

 add_action(  'woocommerce_before_main_content', 'start_wrapper_here', 20  );

不要忘记再次关闭它们。

 function end_wrapper_here() { // End wrapper 
    if (is_shop()) {

       echo '</div>';

    } elseif (is_product_category()) {  

       echo '</div>';

    } elseif (is_product()) {

       echo '</div>';

    }
 }

 add_action(  'woocommerce_after_main_content', 'end_wrapper_here', 20  );

如果您不想更改实际的首页包装器(默认值:<div id="container">)，您应该为此编辑一个 WooCommerce 函数。此函数通常会调用 wrapper-start.php和 wrapper-end.php使用 get_template_part() 的文件.我们现在覆盖这个函数并回显我们自己的包装器。

function woocommerce_output_content_wrapper() { // Start wrapper for all the page contents
  echo '<div class="custom-wrapper">';
}

add_action(  'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 20  );


function woocommerce_output_content_wrapper_end() { // End wrapper for all the page contents
echo '</div>';
}

add_action(  'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 20  );