Woocommerce产品列表 - 替换 引导div

Question

我整天都在寻找一个适当的解决方案来制作带有自举网格的woocommerce模板。总是我尝试用钩子进行更改，因为我觉得它是最好的方法。

Woocommerce显示产品列表如下：

<ul class="products">

<li class="post-24 product type-product status-publish has-post-thumbnail product_cat-zupki-z-chin product_tag-test first instock shipping-taxable purchasable product-type-simple"></li>

<li class="post-30 product type-product status-publish has-post-thumbnail product_cat-zupki-z-chin  instock shipping-taxable purchasable product-type-simple"></li>

<li class="post-31 product type-product status-publish has-post-thumbnail product_cat-zupki-z-chin  instock shipping-taxable purchasable product-type-simple"></li>

<li class="post-32 product type-product status-publish has-post-thumbnail product_cat-zupki-z-chin last instock shipping-taxable purchasable product-type-simple"></li>

</ul>

我想将此更改为正确的引导网格。像这样的东西：

<div class="row">

<div class="col-md3">product</li>

<div class="col-md3">product</li>

<div class="col-md3">product</li>

<div class="col-md3">product</li>

</ul>

通过函数woocommerce_product_loop_start（）将ul更改为div，但是如何更改/替换li class =“.... to div class =”col-md ....？

提前感谢您的帮助Lukas

Answer 1

因此，您需要在子主题中使用模板文件覆盖woocommerce模板文件。

FTP进入您的安装，转到wp-content/plugins/woocommerce/templates，复制content-product.php，在您的子主题中将该文件复制到名为“woocommerce”的新文件夹中。

然后将<li <?php post_class(); ?>>更改为你的div以及你想要的任何课程。

如果您对覆盖woocommerce模板文件有疑问，请查看：https://wordpress.stackexchange.com/questions/256088/how-to-override-woocommerce-template-files