Introduction

WooCommerce Product Tables

How to Configure CSS for Product Table?

To change and customize the Product Table styles, please move to the WooCommerce Product Tablt by WooBeWoo -> Settings tab -> CSS editor

CSS

 

  • To  justify the product names to the left, right, centre:

.wtbpContentTable td.product_title {
text-align: left !important;
}

  • To  justify the Buy button to the left, right, centre:

.wtbpContentTable .wtbpAddToCartWrapper {display: inline-block !important; }

  • To position the search box and change the font size for the input field:

.wtbpTableWrapper .dataTables_filter {
float: none;
text-align: center;
width: 100%;
}
.wtbpTableWrapper .dataTables_filter input {
width: 100%;
}

  • To change the colour for a star rating:

.wtbpContentTable .star-rating span::before {color: #6565b0 !important;}

What should you do next?

Thanks for reading till the end. Here are 4 ways we can help you grow:

Want to learn more?

Explore our full collection of How-To guides to master every feature and functionality.

Check out How-To Guides →

Looking to grow your store?

Browse our WooCommerce plugins to discover tools that can improve performance and boost your sales.

Browse WooCommerce Plugins →

Curious about related topics?

Visit our blog for more tutorials, expert insights, and the latest trends in e-commerce.

Visit Our Blog →

Still confused about this topic?

Submit your question or contact our support team directly. We are here to help!

Contact Support Team →

Latest Articles

Shopping Cart