每行产品 Woocommerce

Question

我有这个 Woocommerce 网站，我想每行显示 6 个产品。我尝试在functions.php中添加一些代码并使用css更改li宽度。这是网站：codedoors.com/styleindia。我也尝试过 WooCommerce 产品存档定制器插件，但不起作用。

我的functions.php文件：

// Display 24 products per page. //working
add_filter( 'loop_shop_per_page', create_function( '$cols', 'return 9;' ), 20 );


// Change number or products per row to 3 //not working
add_filter('loop_shop_columns', 'loop_columns');
if (!function_exists('loop_columns')) {
    function loop_columns() {
        return 6; // 3 products per row
    }
}

谢谢

Answer 1

我使用 CSS 样式本身制作了每行显示 6 个产品。我会告诉你我如何改变它的风格。

样式表 1：

隐藏我在下面提到的行

http://codedoors.com/styleindia/wp-content/themes/smartshop/assets/css/smartshop-woocommerce.css?ver=1.0

.woocommerce ul.products li.product:nth-child(4n+1) {
    /*clear: both !important;*/
}

并在同一个文件中将选择器的样式更改为此

.woocommerce ul.products li.product {
  clear: none !important;
  margin: 2% !important;
  width: 12% !important; /* you have given here it as 15% */
}

最后一个是应用 UL 类 .products 的样式，您可以将其粘贴到您想要的任何位置，但如果没有应用，请将其放在重要标签下。

.products {
  float: left;
  width: 100%;
}

这是通过应用我发送给您的样式制作的屏幕截图。 http://www.awesomescreenshot.com/image/1480013/f65662d652f36b254a9882ce4ba6011a

希望此解决方案对您有所帮助。