Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add a class to a WooCommerce product within the product loop

I would like to add multiple bootstrap col classes to this line of code inside the product loop but I have no idea.

<li><?php wc_product_class(); ?></li>

Can I somehow push my classed into this bit of php and still keep the product applied?

like image 868
Reece Avatar asked Jul 02 '18 09:07

Reece


People also ask

How to add class in WooCommerce product?

So to add a class/classes on the single product page (The "product" div) you could use: /** * WooCommerce Post Class filter. * * @since 3.6. 2 * @param array $classes Array of CSS classes.

How do I edit classes in WooCommerce?

To bulk-edit shipping classes: Go to: WooCommerce > Products. Select the products you want to edit by ticking boxes on the left-hand side. Select Edit from the Bulk Actions dropdown, then Apply.

How do I add a class to my add to cart button in WooCommerce?

To add a class to the Add to Cart button in WooCommerce we need to override a template. In this case we need to override the Add to Cart button template on the single product page. We have to copy the file in woocommerce/templates/single-product/add-to-cart/simple.


Video Answer


2 Answers

try this <li <?php wc_product_class("col-md-4 col-sm-6 custom-class m-4"); ?>></li>

like image 56
Sharif Mohammad Eunus Avatar answered Sep 22 '22 10:09

Sharif Mohammad Eunus


For this wc_product_class(); uses two arguments one is class name and other one is product id so just pass your class name as first argument and product id in second one.

you could see the wc_product_class() in /woocommerce/includes/wc-template-functions.php

For example your class name is test and product id is 143 then just pass <li><?php wc_product_class('test',143); ?></li>

like image 37
raju_odi Avatar answered Sep 24 '22 10:09

raju_odi