Woocommerce定制商店页面布局

我已经按照我的要求修复了Woocommerce插件中的所有问题, 但找不到任何解决方案。 Woocommerce默认商店页面产品循环代码是这样的

<ul>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
</ul>

我希望它将此代码更改为此

<div class="row">
  <div class="col-md-4">
     // Product Loop Card here
  </div>
  <div class="col-md-4">
     // Product Loop Card here
  </div>
  <div class="col-md-4">
     // Product Loop Card here
  </div>
  <div class="col-md-4">
     // Product Loop Card here
  </div>
  // etc etc etc
</div>

发生问题的萤幕撷取画面

哪个功能/过滤器/挂钩或自定义模板可以做到这一点？请帮我

#1

你需要访问woocommerce / loop文件夹

内部有两个loop-strat和loop-end文件

删除ul, 如果使用引导程序, 请输入以下代码

<div class="container">
    <div class="row">

在循环结束文件中, 你需要关闭div

</div>
</div>

现在, 在内容产品文件中, 你将创建你的循环, 这里我的文件示例为其中之一。

<div class="col-md-3 col-sm-6" >

    <div class="product-grid6">
        <div class="product-image6">

            <?php do_action('woocommerce_before_shop_loop_item_title');?>
        </div>
        <div class="product-content">
            <h3 class="title"><?php do_action('woocommerce_shop_loop_item_title');?></h3>
            <div class="price">
                <span>          <?php do_action('woocommerce_after_shop_loop_item_title');?>
</span>
            </div>

        </div>
        <ul class="social">
            <li><a href="" data-tip="Quick View"><i class="fa fa-search"></i></a></li>
            <li><a href="" data-tip="Add to Wishlist"><i class="fa fa-shopping-bag"></i></a></li>
            <li><a href="" data-tip="Add to Cart"><i class="fa fa-shopping-cart"></i></a></li>
        </ul>
    </div>

</div>

#2

你必须更改名为

content-product.php

你可以在这里得到

wp-content\plugins\woocommerce\templates

#3

只需将以下模板覆盖为主题即可更改其模板-

loop / loop-start.php->删除<ul>标记, 并用<div class =” row products columns-<？php echo esc_attr(wc_get_loop_prop(‘columns’));？>”>替换

loop / loop-end.php->删除</ ul>标记并将其替换为</ div>

content-product.php-> 1.删除<li <？php wc_product_class(”, $ product); ？>>标记并用<div class =” col-md-4″>替换。2.删除</ li>标记并用</ div>替换