WooCommerce, Add Short or Long Description to Products on Shop Page

You can add a WooCommerce products’ long or short description to the actual product on the main shop page in WooCommerce via the woocommerce_after_shop_loop_item_title action hook, this hook places content immediately after the product title.

Adding the Long Description to the Product Loop on the Shop page

add_action( 'woocommerce_after_shop_loop_item_title', 'wc_add_long_description' );
/**
 * WooCommerce, Add Long Description to Products on Shop Page
 *
 * @link https://wpbeaches.com/woocommerce-add-short-or-long-description-to-products-on-shop-page
 */
function wc_add_long_description() {
	global $product;

	?>
        <div itemprop="description">
            <?php echo apply_filters( 'the_content', $product->post->post_content ) ?>
        </div>
	<?php
}

Adding the Short Description to the Product Loop on the Shop page

add_action( 'woocommerce_after_shop_loop_item_title', 'wc_add_short_description' );
/**
 * WooCommerce, Add Short Description to Products on Shop Page
 *
 * @link https://wpbeaches.com/woocommerce-add-short-or-long-description-to-products-on-shop-page
 */
function wc_add_short_description() {
	global $product;

	?>
        <div itemprop="description">
            <?php echo apply_filters( 'woocommerce_short_description', $product->post-> post_excerpt ) ?>
        </div>
	<?php
}

You can also limit the content character count by wrapping part of the function in a  substr function, so for example – limiting the full product description to 200 characters

add_action( 'woocommerce_after_shop_loop_item_title', 'wc_add_long_description' );
/**
 * WooCommerce, Add Long Description to Products on Shop Page with Character limit
 *
 * @link https://wpbeaches.com/woocommerce-add-short-or-long-description-to-products-on-shop-page
 */
function wc_add_long_description() {
	global $product;

	?>
        <div itemprop="description">
            <?php echo substr( apply_filters( 'the_content', $product->post->post_content ), 0,200 ); echo '...' ?>
        </div>
	<?php
}

So the above is now limited to 200 characters and also has an ellipse at the end.

ref

Leave a Comment