I am making an online store with every category using a specific page template; that's all done, but now, I want to edit the layout of that page template.

As such, every product will have:

  • a name,
  • an image,
  • a short description;
    I would like the product description to be between the product name and product price tag,
  • a price tag, and
  • a Add to Cart button.

My challenge: I have no idea about how to get started and need assistance in that regard.

What file do I possibly have to clone and or edit?


1 Answer 1


WooCommerce allows you to override its default templates. All templates are located in a woocommerce/templates folder. All you have to do is to create a woocommerce folder within your theme’s directory, and in this folder duplicate the files you’d like to override.

If you want to update the markup then you will need to copy archive-product.php and content-product.php files. If you just want to show a little description between the product name and price, then you can simply put following code into your theme's functions.php file.

function show_product_summary(){
    $product_summary = get_the_excerpt();
    echo '<div class="product-summary">'. substr( $product_summary , 0, 30 )  .'</div>';
add_action('woocommerce_shop_loop_item_title', 'show_product_summary', 10, 2);

You will see the product summary like below on product listing page.

enter image description here

Here is official blog post which will give you quick walkthrough.

  • But which php file do I need to duplicate and edit?
    – TLR
    Mar 29, 2016 at 13:30
  • I have updated my answer with more details. Please let me know if that helps. Mar 29, 2016 at 14:03
  • 1
    yes that's what I was looking for. Thanx!
    – TLR
    Mar 29, 2016 at 14:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.