Complete Guide to WooCommerce Shortcodes: Easy Setup & Tips

If you’ve ever managed a WooCommerce store, you know the challenge: products change, promotions come and go, and keeping everything up to date can feel like a never-ending task. Every tweak or update pulls you away from focusing on your business.

But what if there was a way to simplify all that? That’s where WooCommerce shortcodes come in.

WooCommerce products shortcodes let you easily display content like products or order statuses with just a few lines of text. They simplify your workflow, saving you time and effort while keeping your site fresh and engaging.

In this guide, I’ll walk you through how WooCommerce shortcodes work and how you can use them to make managing your store a lot easier.

Not a tech expert? No problem. 

We can help you integrate WooCommerce shortcodes effortlessly. Contact our WooCommerce customisation experts for a free consultation and get your store running smoothly.

Table of Contents

1. Why should you be using WooCommerce shortcodes?
2. Types of WooCommerce Shortcodes We’ll Cover
3. Product Shortcodes
4. Add to Cart Shortcode
5. Shop Messages Shortcode
6. My Account Shortcode
7. WooCommerce Order Tracking
8. How to Use Shortcodes on Your Pages
9. Final Thoughts
10. FAQs

Why should you be using WooCommerce shortcodes?

Shortcodes in WordPress are like shortcuts—they’re small snippets of text that you place inside square brackets [ ] to display dynamic content on your site. WooCommerce shop shortcodes are specifically designed to help you easily manage and showcase your products, orders, and other important information without needing to dive into complex coding.

For example, if you want to display a grid of WooCommerce products from a specific category, you can simply use a shortcode like [products category=”Thriller”]. This will instantly pull in all the products from the “Thriller” category and display them right on the page, saving you the hassle of manually updating your product listings.

Here’s another example: Let’s say you want to feature a specific product on your homepage. Instead of creating a custom section, you can use the WooCommerce single product shortcode [product id=”25″] to display the product directly. This not only saves time but also ensures that your site remains flexible and easy to update as your inventory changes.

By using WooCommerce shortcodes, you can:

• Easily customize how and where your products are displayed.
• Quickly update content across multiple pages without manual edits.
• Enhance the user experience by providing targeted content, like featured products or sale items, with just a few lines of text.

Types of WooCommerce Shortcodes We’ll Cover

In this blog, we’ll learn about many important WooCommerce shortcodes that can help you manage and display your store’s content more effectively. Here’s a brief overview of the types of shortcodes we’ll cover:

1. Product Shortcodes
   These shortcodes allow you to display various WooCommerce products on your site, filtered by categories, tags, or attributes. Whether you want to showcase a specific product, a category, or items on sale, product shortcodes make it easy.
   
2. Add to Cart Shortcode
   Simplify the purchasing process by adding a direct Add to Cart button anywhere on your site. This shortcode lets customers add products to their cart without visiting the product page, streamlining their shopping experience.
   
3. Shop Messages Shortcode
   Ensure customers receive important notifications, like when a product has been added to the cart, using the shop messages shortcode. This is particularly useful for non-WooCommerce pages where these messages might not appear by default.
   
4. Page Shortcodes
   These shortcodes help you display key WooCommerce pages, like My Account, Order Tracking, Cart, and Checkout. Page shortcodes are perfect for creating custom layouts while maintaining all the functionality of standard WooCommerce pages.

Product Shortcodes

When you’re running a WooCommerce store, having the right tools to display your products can make a world of difference. That’s where product shortcodes come in. These are simple, yet powerful, snippets of text that let you showcase your products exactly how you want, without the hassle of manual updates.

Display Products with [products] Shortcode

The [products] shortcode is your go-to for displaying products in your store. Whether you need to filter products by categories, tags, or specific attributes, this shortcode has you covered. It’s a versatile option that replaces older shortcodes like [featured_products], [sale_products], and [best_selling_product].

Customize Your Product Display

To make your product displays just right, you can tweak the [products] shortcode using various attributes. Here’s how you can use them:

• limit: Set how many products you want to display. By default, it shows everything (-1).
• columns: Decide how many columns you want. The default is 4.
• paginate: Want pagination? Just turn it on—especially handy if you’re not showing all products at once.
• orderby: Choose how to sort your products. You’ve got options like:
  • title: Sort by product title (default).
  • date: Sort by the date the product was published.
  • id: Sort by the product’s post ID.
  • menu_order: Sort by the menu order if set (lower numbers show up first).
  • popularity: Sort by how many times a product has been purchased.
  • rand: Mix things up with a random order (just watch out if your site uses caching).
  • rating: Sort by average product rating.
• order: Pick whether the products appear in ascending (ASC) or descending (DESC) order. It’s ASC by default.
• skus: Show products by specific SKUs, using a comma-separated list.
• category: Filter by category slugs, also comma-separated.
• tag: Filter by tag slugs, using—you guessed it—a comma-separated list.
• class: Add an HTML class if you want to style your products with custom CSS.
• on_sale: Highlight products that are on sale. Just don’t mix it with best_selling or top_rated.
• best_selling: Want to show off your top sellers? This one’s for you, but don’t use it with on_sale or top_rated.
• top_rated: Display your best-reviewed products. Like the others, keep it separate from on_sale and best_selling.
• attribute: Filter products by a specific attribute slug.
• terms: Use a list of attribute terms to narrow down y87t5rour products.
• terms_operator: Choose how to compare those attribute terms:
  • AND: Show products that match all the selected attributes.
  • IN: Show products that match any of the selected attributes (this is the default).
  • NOT IN: Show products that don’t match the selected attributes.

These attributes let you fine-tune how your WooCommerce products show up on your site, making it easy to create a product display that fits your store’s needs perfectly.

Example Use Cases

I run a WooCommerce store that sells books, and I’ve found these shortcodes incredibly useful in showcasing specific products to my customers.

For example, I had a collection of “Thriller” books that I wanted to highlight during a sale. Instead of manually curating a list, I used the [products] shortcode:

• category: I set this to “Thriller” to show only books from that genre.
• on_sale: I set this to true to display just the ones on sale.

Here’s the shortcode I used:

[products category="Thriller" on_sale="true"]

With this, all my Thriller books on sale were automatically displayed on a dedicated page, making it easy for customers to find exactly what they were looking for.

Displaying Books with Specific Tags

In another instance, I wanted to feature books tagged with both “novel” and “ghost.” These books were also on sale, so I needed a shortcode that could filter by both tags and sale status.

• tag: I used “novel, ghost” to filter the right books.
• tag_operator: I set this to AND to make sure only books with both tags were shown.
• on_sale: Again, I set this to true to display the discounted ones.

The shortcode looked like this:

[products tag="novel, ghost" tag_operator="AND" on_sale="true"]

This pulled up all the books that matched both tags and were on sale, making it easy for my customers to find exactly what they wanted.

Add to Cart Shortcode

Have you ever noticed how many steps it takes for a customer to add a product to their cart on your WooCommerce store? They have to browse through WooCommerce products, click on one, get redirected to the product page, and only then can they hit that Add to Cart button. It’s a bit of a journey, isn’t it?

But what if you could make that process simpler?

WooCommerce offers an Add to Cart shortcode that allows you to place the Add to Cart button for a specific product anywhere on your site. This means your customers can add items to their cart directly from the page they’re on—no need to jump through multiple hoops.

Here’s how you can make the most of this shortcode:

• id: Use the product ID, which you can find by hovering over a product in the Products > All Products section of your dashboard. This tells the shortcode exactly which product’s Add to Cart button to display using the WooCommerce single product shortcode.
• style: Want the button to match your site’s design? Customize the look of the Add to Cart button, including the border, color, and padding.
• sku: If you’d rather use the product SKU instead of the ID, the shortcode can do that too, showing the right button based on the SKU.
• show_price: You can choose to display the product price right next to the Add to Cart button by setting this to TRUE or hide it by setting it to FALSE.
• class: Add custom CSS classes to style the button exactly how you want it.

By placing the Add to Cart button exactly where it’s most convenient, you simplify the buying process for your customers. This can lead to more sales and a smoother shopping experience—something every WooCommerce store owner aims for.

Shop Messages Shortcode

When I first added the Add to Cart button directly on my product listings, I noticed something was missing. After clicking the button, there was no confirmation or notification to let the customer know their item had been successfully added to the cart. It felt like something crucial was lacking in the shopping experience.

That’s when I thought of using the [shop_messages] shortcode. This shortcode is incredibly useful if you’re using the [add_to_cart] or [product_page] shortcodes, especially on non-WooCommerce pages. It displays shop messages, like “Product has been added to cart,” giving customers the immediate feedback they expect.

Here’s how I set it up:

First, I had to tweak a setting to make sure the shop messages would display correctly:

1. Log in to your WordPress Admin dashboard.
2. Navigate to WooCommerce → Settings → Products.
3. Disable the setting named “Enable AJAX add to cart button on archive” and save the changes.

Once that was done, I simply added the [shop_messages] shortcode to the same page where I had placed the Add to Cart button. Now, whenever a customer clicks the button, they instantly see a confirmation message saying “Product has been added to cart.”

My Account Shortcode

Giving your customers easy access to their account details is a key part of running a WooCommerce store. The [woocommerce_my_account] shortcode makes it simple to set up a dedicated page for this purpose.

WooCommerce My Account

The My Account page is where your customers can manage everything related to their account. Here’s what they can do:

• Edit Personal Information: Update their username, password, and other account details.
• Order History: Check past orders, track current ones, and stay on top of any ongoing transactions.
• Manage Subscriptions: If your store offers subscriptions, customers can view their plans, renew, modify, or cancel them right from this page.

To create this page, you just need to use this shortcode:

[woocommerce_my_account]

Placing this shortcode on a page provides your customers with a straightforward way to manage their account and order details, making their experience with your store smoother and more user-friendly.

WooCommerce Order Tracking

While customers can track their orders through the Orders tab in the My Account page, sometimes you might want to offer a more accessible option—especially for guest users who don’t have an account. This is possible through the WooCommerce order tracking shortcode.

WooCommerce Order Tracking

This shortcode creates a page where customers can easily track their orders by entering their Order ID and Billing Email. It’s particularly useful for those who purchased without creating an account, allowing them to stay informed about their order status without needing to log in.

Here’s what the shortcode does:

• Creates an Order Tracking Form: The form includes fields for Order ID and Billing Email.
• Displays Order Status: Once the customer enters their details, the page shows the status of their order.

To set this up, just use the following shortcode:

[woocommerce_order_tracking]

This shortcode adds a simple, user-friendly order tracking form to your site, making it easier for all customers—especially guest users—to keep track of their purchases.

Beyond this, WooCommerce also provides other helpful page shortcodes like [woocommerce_cart] and [woocommerce_checkout] to enhance the shopping experience. You can explore the full list of WooCommerce shortcodes and their use cases to see how they can benefit your store.

How to Use Shortcodes on Your Pages

Adding shortcodes to your pages in WordPress is pretty straightforward, and you’ve got a few options depending on the editor you’re using.

Using the Classic Editor

If you’re working with the Classic Editor, you’re in familiar territory. This traditional content editor is all about simplicity. You can easily create and edit posts or pages with a WYSIWYG (What You See Is What You Get) interface—no coding required.

To add a shortcode here, all you need to do is type or paste the shortcode directly into the content area, wrapped in square brackets. For example:

[products category="Thriller"]

On the admin side, it’s as simple as adding any other text. And when you view the page on the frontend, the shortcode will automatically display the list of products in the “Thriller” category.

Now on the frontend the shortcode will display the list of the products with category Thriller. Here is a screenshot of the frontend.

Using the Block Editor (Gutenberg)

If you’re using the Block Editor, also known as Gutenberg, the process is just as easy but a bit more visual. Gutenberg allows you to build posts and pages using different blocks for text, images, media, and more.

To use a shortcode in Gutenberg:

1. Add a new block by clicking the “+” button.
2. Search for the “Shortcode” block.
3. Paste your shortcode into the block.

Gutenberg’s visual approach makes it simple to see how your shortcodes fit within your page’s layout.

Using a Page Builder

For those who prefer using a page builder like Elementor, Divi, or Beaver Builder, shortcodes are still super easy to work with. Most page builders offer a dedicated “Shortcode” block similar to Gutenberg’s, where you can paste your shortcode directly.

If your page builder doesn’t have a specific block for shortcodes, don’t worry. You can just add your shortcode within a text block, wrapped in square brackets, and WordPress will take care of the rest.

Whether you’re using the Classic Editor, Block Editor, or a page builder, adding shortcodes is a breeze. It’s all about choosing the method that works best for you and your site’s design.

Final Thoughts

WooCommerce shortcodes are a powerful way to streamline your store’s management and enhance the shopping experience for your customers. By using these simple snippets of text, you can display products, manage orders, and customize pages without needing to dive into complex coding. Whether you’re new to shortcodes or looking to optimize your use of them, they offer a flexible solution to keep your site dynamic and user-friendly.

Feeling overwhelmed by all the technical details? 

Let us handle it for you. At Wisdm Labs, we specialize in simplifying WooCommerce management so you can focus on what you do best—growing your business. Schedule a free consultation today.

FAQs 

1. Can I customize how WooCommerce shortcodes display content on my site?

Yes, WooCommerce shortcodes are highly customizable. You can adjust them using various attributes to control what’s displayed and how it appears. For example, you can filter products by category, sort them by popularity, and decide how many items to show per page. This flexibility allows you to create tailored displays, whether you’re using WooCommerce product category shortcodes or WooCommerce featured products shortcodes.

2. Are there any limitations to using WooCommerce shortcodes?

While WooCommerce shortcodes are powerful, they do have some limitations. For complex custom layouts, you might need more than just shortcodes—you may need additional CSS or a WooCommerce shortcodes plugin to achieve specific designs. Additionally, some shortcodes might not work perfectly with all themes, especially if the theme modifies the default WooCommerce templates.

3. Can WooCommerce shortcodes be used with third-party plugins?

Yes, WooCommerce shortcodes can often be used alongside third-party plugins. Some plugins may even extend the functionality of shortcodes or offer additional ones, like a WooCommerce related products shortcode. However, compatibility can vary, so it’s always a good idea to test these shortcodes with any third-party plugin to ensure they work as expected.

4. How do WooCommerce shortcodes affect site performance?

Generally, WooCommerce shortcodes are optimized for performance, but how you use them matters. For instance, displaying a large number of products with a WooCommerce products shortcode or enabling complex filters can potentially slow down page load times. It’s wise to test your site’s performance after adding shortcodes, especially on high-traffic pages.

5. Can I use WooCommerce shortcodes in widgets or custom HTML areas?

Absolutely. You can insert WooCommerce shortcodes into widgets, sidebars, or custom HTML areas on your site. WordPress supports shortcodes in text widgets, and many themes or page builders allow you to use shortcodes in various sections of your site. This means you can easily display WooCommerce product category shortcodes or WooCommerce single product shortcodes outside of standard posts and pages, giving you more flexibility in your site’s layout.