Show the WooCommerce Short Description Anywhere on Your Store
Displaying a short WooCommerce product description on your store’s main shop page and category pages makes it easy for customers to make a quick buying decision. It lets them know what the product is and encourages them to learn more.
The only problem is that WooCommerce only displays the short description on the single product page. There’s no option to add a WooCommerce short description to your main shop page, product category pages, or elsewhere on your site.
Fortunately, there’s another way to display product descriptions, other important product information, and various buying options directly on your WooCommerce store’s main shop page.
What’s more, you can include any content in the short description, including formatting, audio and video players, or content from a shortcode.
In this post, we’ll show you how to customize and display a WooCommerce product short description on your main shop page, category pages, and archive pages. Before we begin, let’s quickly step through some reasons why you might consider doing this in the first place.
Why you might want to show extra product information
Most WooCommerce stores use the default shop page layout which is limited in terms of display options. For each product, it typically displays the product image, reviews, prices, title, and an add to cart button.
While this may work perfectly fine for some online stores, it isn’t the best solution for every type of online store. For example, if you sell a lot of similar-looking products – such as mattresses – you’ll need a better way to let customers know how each product is different from the next. In these sorts of situations, you can’t rely on the product’s name alone.
Here are some of the ways you can enhance the customer’s shopping experience by adding a WooCommerce short description to the main shop page and category pages:
- Improve the shopping user flow Customers don’t have to click through to the single product page to read the WooCommerce product’s short description or view additional details. This takes a step out of the buying user flow, which is especially helpful if your customers typically purchase multiple products from you at a time.
- Help customers make a quick buying decision Customers can view the product’s short description directly on the main shop page. This helps them make a faster buying decision since all they have to do is find what they’re looking for and add it to the cart.
Two plugins to help you display the WooCommerce short description
There are two different ways you can go about displaying extra product information on your main shop page and category pages:
1. Create a table-based product layout
One way to display extra product information on the shop and category pages is by using WooCommerce Product Table. This plugin lets you list all of your products – along with important product data – in a neat, front-end table layout allowing your customers to see more information at a glance.
You can control exactly what information shows up in your table, which lets you include a column dedicated to each product’s short description.
2. Use product quick view
Another way to show extra product information on the shop or category pages is by using the WooCommerce Quick View Pro plugin. While it doesn’t make the short description visible on the initial page load, it does add a dedicated button that shoppers can click to open a lightbox with more product details.
The plugin then lets you include the product short description in the lightbox popup.
You can add quick view buttons to your main shop page and category pages or to a product table created using WooCommerce Product Table.
Overall, the WooCommerce Product Table and WooCommerce Quick View Pro plugins allow you to display the short WooCommerce product description anywhere on your WooCommerce store, including the main shop page and category pages.
The key benefit of using a plugin is so you don’t have to code or HTML/CSS. This saves you from messing around with
add_action functions or the
post_excerpt function. The coding method involves creating a new filter for
woocommerce_short_description in your
Exactly what we needed
How to show the WooCommerce short description on shop and category pages
Here, we’ll show you how you can customize and display a short WooCommerce product description on the main shop page and category pages.
We’ll cover the two methods discussed above:
- Using WooCommerce Product Table to create a table-based layout to include the product short description.
- Displaying the product short description in a quick view lightbox.
We’ll also discuss how you can use both methods at the same time.
Method #1: Create a product table layout to include short description
In this first section, we’ll show you how to set up WooCommerce Product Table to include the product short description.
1. Install the plugin
Get the WooCommerce Product Table plugin and install and activate it to your WordPress website.
Next, go to WooCommerce → Settings → Products → Product Tables and copy-paste the plugin’s license key to begin using the plugin.
2. Configure the plugin’s settings
In the same area where you added your license key, you can also configure how your product table will function.
There are lots of helpful settings for things like filters, bulk add to cart, and more. But if you want to display the product short description, the setting you most have to pay attention to is the Columns option.
Here, you can define the exact columns that will display in your product table, including your short description. You can view all the column options here, but a good starting point is something like:
Feel free to browse the other settings because you might find something else that can help your store.
3. Display your product table on the front-end of your site
To add your product table to the front-end of your store, you have two options:
- You can add the
[product_table]shortcode to any post or page. By default, it will display all of your products, but you can use shortcode modifiers to filter products from specific categories, tags, and more. Learn how to select your products.
- Alternatively, you can edit your WooCommerce store’s template files to replace the native WooCommerce shop and archive pages with your new table layout.
If you go with option #1, all you do is add the shortcode and you’re done.
If you want to use option #2, you’ll need to connect to your store’s server and edit the template file, which is a little more technical.
To do that, log into your hosting server using an FTP client and create a folder called
woocommerce in the same directory as your active theme. Upload the folder to your hosting server in the
/wp-content/themes/<your theme>/woocommerce directory.
Next, download our sample archive-product.php template from here. Edit the file and go to line #60. There, make sure that the shortcode is just
[product_table]. This tells the template file to pull its configuration from the settings you just configured in the previous step.
Finally, upload the file to the folder you just created:
Check out the complete tutorial on How to Build a Custom WooCommerce Shop Page for detailed, step-by-step instructions.
Once you’re finished, your main shop page should look something like this:
Method #2: Add a quick view lightbox that includes short description
For Method #2, we’ll show you how to set up the WooCommerce Quick View Pro plugin to add a quick view lightbox button to your shop and archive pages that includes the product short description:
You can also use the quick view lightbox to let customers:
- View full product galleries.
- View additional information (such as a WooCommerce short description).
- Choose product variations.
- Add products to cart.
Here’s what you need to do to add it to your WooCommerce product table:
- Get the WooCommerce Quick View Pro plugin and install and activate it to your WordPress website.
- Navigate to WooCommerce → Settings → Products → Quick view and enter your license key.
- Select what product information you want to display in the quick view lightbox.
That’s it! You’ll have a product quick view button on your shop page. When a shopper clicks it, they’ll see your product short description and other details in the lightbox.
Pro tip: You can also disable the links to individual product pages. Scroll down to the Quick View settings on the same page and enable this option.
You can combine both methods
If you want to use both the product table layout and product quick view, you can integrate WooCommerce Product Table with WooCommerce Quick View Pro.
If you have both plugins active on your site, you can add a new
quick-view column to your product table layout to include the product quick view button.
Here’s an example of what it will look like:
Add WooCommerce Product Descriptions to improve the user flow
We explained how you can:
- Enhance the customer’s buying user flow and
- Help them make a quick, informed buying decision
… simply by adding a short WooCommerce product description to your main shop page and category pages.
Do you think that displaying a WooCommerce short description on the main shop page will impact your conversion rate? Let us know by commenting below!