Woocommerce Products Display Page (Add short description)

[jsnewton]

I saw threads on this topic for earlier versions of xtheme, but no recent topics for xtheme pro. I would like to add a short description to the woocommerce products display page between the product name and product price. I have included a screenshot below of where the short description should go in yellow highlight.

Thank you for your time!

[Prasant]

Hello @jsnewton,

Thanks for reaching out.

You can add following JS code under X/Pro > Theme Options > CSS:

jQuery(function($){
$( "<p>Add text here </p>" ).insertAfter( $( ".woocommerce li.product .entry-header h3" ) );
});

Replace Add text here with your custom text.

Thanks.

[jsnewton]

Thanks for getting back to me! Sorry If I didn’t explain correctly. I do not want to add custom text, I want to pull a short description of the product description into this space. Say like the first 25 characters of the product description will show in this space.

[mldarshana]

Hi There @jsnewton

To achieve that, first you need to setup a child theme and activate it by following our guide here (https://theme.co/apex/forum/t/setup-how-to-setup-child-themes/57). Then you can add the following code into your child theme’s functions.php file.

// Add Short Description
function woocommerce_after_shop_loop_item_title_short_description() {
	global $product;
	if ( ! $product->post->post_excerpt ) return;
	?>
	<div itemprop="description">
		<?php echo apply_filters( 'woocommerce_short_description', $product->post->post_excerpt ) ?>
	</div>
	<?php
}
add_action('woocommerce_after_shop_loop_item_title', 'woocommerce_after_shop_loop_item_title_short_description', 5);

Then it should display as follows.

Please Note: We’re only providing a guidance on certain customizations as it would be outside our scope of the support. So if you require any further customizations, I would suggest you to contact a developer or service.

Thanks!

[jsnewton]

Thank you for putting this together! I installed the Child Theme, and added the code to the child theme’s function.php file. Upon checking on the front end it returned the entire product short description. Is there a way to limit the amount of description it is pulling? Say, 25 characters.

[christopher]

Hi @jsnewton,

Kindly change the code to:

// Add Short Description
function woocommerce_after_shop_loop_item_title_short_description() {
	global $product;
	if ( ! $product->post->post_excerpt ) return;
	?>
	<div itemprop="description">
		<?php 
			$filtered = apply_filters( 'woocommerce_short_description', $product->post->post_excerpt ); 
			$filtered = substr($filtered, 0, 25);
			echo $filtered;
		?>
	</div>
	<?php
}
add_action('woocommerce_after_shop_loop_item_title', 'woocommerce_after_shop_loop_item_title_short_description', 5);

I’m sure you understand that this is customization and outside of our support policy. We will do our best to help you out but we will not be able to provide further customization.

Thank you.

[jsnewton]

Thank you! This works well for me!

[rad]

You’re most welcome!