首页 文章

Woo commerce:在循环外编辑产品类别页面

提问于
浏览
3

我已经构建了一个自定义的Wordpress主题,并使用Woo Commerce作为购物车插件 . 其中大部分都集成得很好(我在functions.php中为主题添加了钩子,并将Woo商务模板页面复制到主题中的woocommerce子文件夹中 . )但是我试图在循环外面添加一个包装器()产品类别页面,并不能为我的生活找出我需要编辑的东西,以使其工作 . 我需要这样做才能通过CSS重新定位产品 . 我可以申请css,但这对我来说不够具体

到目前为止,我有:

  • 使用content-product_cat.php和content-product.php进行实验(但两者都在循环内运行 .

  • 使用许多其他模板页面进行了实验

  • 我已将标签添加到wrapper-start.php和wrapper-end.php页面 . 这适用于其他页面,但不会显示在product-cateogry中

我已经在线查看了Wordpress网站,但它没有提供任何帮助 . 任何帮助将不胜感激!

亲切的问候尼克

3 回答

  • 11

    对于像这样的小改动,不需要覆盖整个文件 . 首先尝试使用WooCommerce提供的钩子 . 您可以在主题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函数 . 此函数通常使用 get_template_part() 调用 wrapper-start.phpwrapper-end.php 文件 . 我们现在覆盖这个函数并回显我们自己的包装器 .

    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  );
    
  • 1

    刚刚找到答案 - 我需要修改archive-product.php

  • 8

    做一件事,在自定义主题根目录中创建一个文件夹,并将其命名为'woocommerce' . 现在,您可以将WooCommerce插件中的模板复制到自定义主题woocommerce文件夹中,并覆盖任何WooCommerce模板文件 . 你可以在 plugins/woocommerce/template/ 找到WooCommerce模板文件

    希望这会帮助你 .

相关问题