Showing posts with label WooCommerce. Show all posts
Showing posts with label WooCommerce. Show all posts

Extra WooCommerce category and tags cut-off


Extra WooCommerce

If you are running the Extra theme with WooCommerce, you may have noticed the WordPress category and tags for your products are being cut off. This is an issue with Elegant Themes and the fix is easy.

Please, go to your WordPress Dashboard > Divi > Theme Options > Custom CSS and add the following:

.product_meta {

margin-bottom: 25px !important;


Increase pricing text size on WooCommerce products

Looking to increase the size of the pricing text on the woocommerce pages?

You can use the following CSS rule in your themes custom CSS:

.woocommerce ul.products li.product .price, .woocommerce ul.products li.product .price del, .woocommerce-page ul.products li.product .price, .woocommerce-page ul.products li.product .price del {
font-size: 18px;

How to Remove Sidebar from WooCommerce Shop and Category Page

Looking to make category pages full width? There are many posts online that tell you to edit core WooCommerce files. This is not the best practice as there are regular updates to the WooCommerce plugin. When you update the plugin, it will revert back to the page with the sidebar.

Please add this CSS code into Divi > Theme Options > General > Custom CSS field.

#left-area {
padding-right: 0 !important;
width: 100%;
#sidebar {
display: none;
#main-content .container::before {
display: none;

Change No products were found matching your selection background color for WooCommerce

If you install the WooCommerce plugin for WordPress, you may notice some colors do not match your WordPress theme. You can add a CSS over-ride to change the default color here.

Add this CSS code to make the blue background black. 

woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message {
    background: #000!important;