By default, WooCommerce Description is visible only on single product pages. To be able to see it WooCommernce Shop page, Product Category page and Divi Builder Woocommerce Product Module, you will need to add the following changes.
First of all, make sure you have a child theme installed. You need it to not lose the changes once you update/reinstall your Divi. If you are not sure what a child theme is please refer to the following tutorial:
How To Make A Child Theme
If you already have a child theme simply add the following code to the functions.php file in your child theme folder:
/**
* Add the product short description (excerpt) to the WooCommerce shop/category pages.
*/
function woocommerce_after_shop_loop_item_title_short_description() {
global $product;
if ( ! $product->get_short_description() ) return; ?>
<div itemprop="description">
<?php echo apply_filters( 'woocommerce_short_description', $product->get_short_description() ) ?>
</div>
<?php
}
add_action('woocommerce_after_shop_loop_item_title', 'woocommerce_after_shop_loop_item_title_short_description', 5);
That's it. After you saved the changes you can add a short description to each product:
Expected result on shop/archive pages:
Further, if you want to change the short description font-color, font-size, line-height etc, you can use this CSS in Theme Options > General > Custom CSS:
.woocommerce ul.products li.product div[itemprop="description"] {
color: #000000;
line-height: 1.4em;
font-size: 14px;
}
Modify the values as you want to style the short descriptions.