WooCommerce Shortcodes: The Ultimate Guide for 2024
If you have a WooCommerce business, you’ve probably heard about shortcodes. They’re small snippets that allow you to add and customize different aspects of your online store without writing long lines of code. In this guide, we’ll look at what WooCommerce shortcodes are, why you should use them, and how to make the most of them.
WooCommerce Shortcodes: All you need to know
If you work with WordPress, you’re probably familiar with WooCommerce. The renowned WooCommerce plugin powers 93.7% of all WordPress eCommerce websites.
This open-source, fully customizable platform developed by WooThemes started as just any other add-on but soon took off with millions of downloads, which caught the attention of the WordPress board. It has been downloaded 70 million times and has become the leading eCommerce plugin, powering 28% of online stores.
Despite its excellent reputation and success, the WooCommerce team continuously works to improve it. Throughout its development path, it has given users multiple shortcodes of various types to customize their sites. With such shortcodes, they can transform their stores and customize their interface, check-out, functionality, product listing process, and more.
So, to help you make the most of shortcodes, in this guide, we’ll have a look at:
- A brief explanation of shortcodes
- Why they are necessary for your business
- A list of WooCommerce shortcodes
- How you can make full use of them
What are WooCommerce Shortcodes?
Let’s start with the basics. WooCommerce shortcodes are small snippets that help you achieve functionality or display content on your eCommerce site without writing a long stretch of code. In other words, they’re macros that will allow dynamic interaction with your site’s content.
You can customize shortcodes anywhere in your store, show off products, or just call-to-action buttons. And the best part is that you don’t need any coding knowledge to use them. You need a burning passion for online business and a deep understanding of what you want for your store. Shortcodes will do the rest cleanly and neatly.
In a nutshell, WooCommerce shortcodes are beneficial in three ways:
- They help save time because you don’t have to write long lines of code, giving you more time to work on other things.
- Since they don’t add a markup to the post content, store owners can edit the page’s style later.
- More flexibility. Although this will depend on the user’s parameters, they can apply the same shortcode to different situations.
Why do you need WooCommerce Shortcodes?
Still not convinced? Think again; WooCommerce shortcodes can do a lot more than you imagine.
Firstly, shortcodes grant you complete site control. This means that you can freely display products and add call-to-action buttons or buttons anywhere in your store without asking for help from any developer. It also means you don’t have to work with long, complex code stretches.
This is perfect for those who want to try various strategies in their online stores. For example, rather than walking your customers through a standard sales process like any other store, you may want to display an add-to-cart button on one of your popular posts to encourage conversions. And the best part is that shortcodes allow you to choose among many call-to-action buttons that you place on your site.
Additionally, WooCommerce shortcodes let you add products to the homepage, create a grid of items that are on sale to show them to customers and display your popular products anywhere you’d like. Even creating an order tracking page is possible! And that’s the magic of shortcodes: They provide endless options to customize your store.
What types of WooCommerce Shortcodes are there?
As it’s hard to say how many shortcodes WooCommerce offers, we’ll list them based on their category. Here is a quick overview of the WooCommerce shortcodes that we’ll cover in this guide:
- Page Shortcodes
- Products Shortcodes (this is the most robust category)
- Product Page Shortcodes
- Related Products Shortcodes
- Add-to-cart Button or URL Shortcodes
How do you make the most of WooCommerce Shortcodes?
Now, let’s see what each type of shortcode can do and how to make the most of them:
1. Page Shortcodes
Normally, WordPress comes with 4 default pages with the shortcodes included, so you won’t need to manually add them. However, if that wasn’t the case, you could recreate the pages with the shortcodes and clarify them in the settings.
Within the page shortcodes, you’ll find:
Cart
[woocommerce_cart
]
It’s used for the cart page and helps show the cart content once your customers add products to their cart. Moreover, it also displays the interface for coupon codes, cart bits and pieces, and other elements for a standard cart page. This shortcode is simple, so you don’t add more conditions or parameters.
Checkout
[woocommerce_checkout
]
Once your customers have collected all the products/services they want, they will click check out, which is when the checkout shortcode comes into action. It will display all the necessary information the shopper needs before checkout, such as payment method, billing information, shipping information, etc. This is also a simple shortcode that doesn’t accept any additional arguments.
My account
[woocommerce_my_account
]
Customers should be able to see and modify their profile details, such as name, email address, and password, as well as their order details, such as shipping and billing address. This shortcode lets users view, edit, and update those details. Moreover, it contains an argument displaying information about the current shopper.
Order Tracking Form
[woocommerce_order_tracking
]
Unlike the previous three-page shortcodes, this one isn’t automatically generated by default, but you can add it so that your customers can see and track the status of their ongoing orders. To check the status of an order, shoppers must input their order details in the Order Tracking Form.
You can use this WooCommerce shortcode for an individual page or combine it with other shortcodes to display the tracking form. For instance, you may use this shortcode on the My Account page to let your customers access the tracking form.
2. Product Shortcodes
Please remember that to use Product Shortcodes, you’ll need WooCommerce 3.2 and later versions. These versions let you use the product shortcode for various product displays. If you have a previous version, check this document because you’ll need to use different shortcodes for each type of product grouping.
[products
]
2.1 Product Shortcode Attributes
When using product shortcodes, you must specify which products you want to display based on different conditions. These conditions allow you to filter products by post ID, SKU, categories, attributes, etc. They also support pagination, random sorting, and product tags.
Let’s go through some product shortcodes:
Limit product quantity
With the limit attribute, you can limit the number of products displayed. For example, you can restrict the number of products to be shown to 8 items with the following:
[products limit="12"
]
. Please note that by default, the limit is “-1,” meaning all the products will be shown.
Change the product layout
With WooCommerce shortcodes, you can also change the layout to diversify the product display. Depending on your customers’ preferences, choose among the following attributes: columns, paginate, or orderby.
a. Columns
To set a certain number of columns, add the ‘columns’ attribute and clarify the number you want. So, if you wish to 6 columns with a different product in each of them, you can use the shortcode:
[products limit="12" columns="4"
]
b. Paginate
Another example is the paginate attribute, which divides your products into different pages. With this shortcode, you can specify the number of items shown in each page.
To use it, set paginate = “true”, and then enter the following shortcode:
[products limit="12" columns="4" paginate="true"
]
c. Sort products with “orderby”
The orderby attribute opens up a wide range of options as it lets you sort your products according to multiple criteria to display them as you wish by adding conditions. These include:
-
- id: display products by product id.
- popularity: with this attribute, the most purchased products will be shown first.
- title: sort products by their title. This is the default order of orderby.
- rating: another exciting way to sort products is based on their average rating value.
- date: to sort the items based on the date they were published. By default, the oldest product is shown first. However, you can change this using the date attribute.
- rand: This attribute allows you to alter the order of the products when the page is reloaded. Nonetheless, this attribute may not work on sites where caching is enabled, and the products are saved in a fixed order.
- menu_order: this will only work when you have set menu orders, and it will show products according to that order. The lowest number will be displayed first.
If you want even more customization, you can go one step further and combine these options just by adding a space between them. For example, you could try mixing the shortcodes to have six columns of products displayed in an order based on their popularity like this:
[products limit="12" columns="4" orderby="popularity"
]
More product attributes
There are several more product attributes in WooCommerce that you can use, combining them with the “products” shortcode. Some of the main ones are:
-
- SKU: You can display your products based on their SKU (stock-keeping unit). To add several SKUs, separate them by commas.
- on_sale: As its name suggests, this attribute will display all your shop’s on-sale products.
- category: It’s also a good idea to show products by their categories. You can have multiple categories separating the slugs with commas.
- best_selling: This is an excellent option to show your most popular and best-selling products first.
- top_rated: Following the same logic, you can show your top-rated items.
- class: This attribute helps you change the order using custom CSS by adding an HTML wrapper class.
For example, if you want to display your best-selling products, four per row, with a maximum of twelve items, you can use this shortcode:
[products limit="12" columns="4" best_selling="true"
]
Visibility
This attribute allows you to display products based on the visibility settings. Some of the options are:
-
-
- catalog: It retrieves products visible only on the shop page
- search: It shows products that are visible only on the search page
- visible: It’s a combination of the previous two as it retrieves products that are visible on the shop page and search results.
- hidden: It shows products that can only be accessed by a direct URL.
- featured: It’ll only retrieve products that are marked as featured
-
For example, if you want to display your featured products, four per row, with a maximum of twelve items, you can use this shortcode:
[products limit="12" columns="4" visibility="featured"
]
Content product attributes
Within product shortcodes, there are content product attributes that you can use to retrieve products on a particular page or post. More specifically, it’s possible to retrieve stuff based on the available attribute or attribute terms (these are variations of that attribute). You can do this by including the slug, specifying the terms, and combining them with the attributes. This can be a bit confusing, so let’s have a closer look at each of them:
-
- attribute: It helps display products by enclosing the slugs
- terms: It mentions the attribute terms separated by commas
- terms_operator: It gives you more control over how to show the attributes. There are three operators:
- AND: It’ll show products from all of the attributes that you’ve chosen.
- IN: It displays the products that have that chosen attribute.
- NOT IN: It’ll show products that don’t have the chosen attributes.
Categories
Following the same logic as content product attributes, you can also display items based on their categories:
-
-
- category: To choose the category you want to display
- cat_operator: You can apply conditions to show the items you want:
- AND: The products that are displayed need to belong to all the categories chosen
- IN: The products that are displayed need to be in at least one of the categories chosen
- NOT IN: The products that are displayed don’t need to be in any of the categories chosen
- You can also display products according to a comma-separated list of Post IDs or a list of SKUs.
- Several more shortcodes/attributes belong to the Product shortcodes: Special Attributes, Product Category, and Product Category. The logic is very similar to what you’ve read above, but if you want to look, you can check this out.
- If you want to know more about shortcodes, visit this page and review the eight scenarios.
-
For example, if you want to display products for specific categories, four per row, with a maximum of twelve items, you can use this shortcode:
[products limit="12" columns="4" category="hoodies, tshirts"
]
3. Product Page Shortcodes
With this type of WooCommerce shortcode, you can show different product pages using two attributes: product IDs and SKUs. The code for this is .
It’s important to note that you can even use both of the following shortcodes:
[product_page id="219"
]
or
[product_page sku="hoodie"
]
4. Related Products Shortcode
If you’ve used eCommerce stores such as Amazon or Alibaba, you’ve probably noticed that they show you related items when you’re looking at a product. For example, if you’re searching for a tent, they’ll show you other similar tents and sleeping bags. That’s because if you need a tent, you will likely be interested in a sleeping bag.
Consequently, showing your shoppers related products is an excellent idea to boost your sales. In WooCommerce, this is possible with the Related Products shortcode. You can indicate exactly how many products you want users to see. For example, if you want to show four products, the shortcode should be:
[related_products limit="4"
]
5. Add to Cart button
An add-to-cart button is another excellent way to improve customer experience in your store and increase conversion rate. The best part is that it’s very simple.
Let’s say you want to display the price of a product and an Add to Cart button on a post or page; the shortcode you need to use is
[add_to_cart sku="hoodie"
]
WooCommerce shortcodes also allow you to redirect your shoppers to another URL instead of adding an item to the cart. To do this, you need to write
[add_to_cart_url id="219"
]
For the product with ID 219.
List of useful Shortcodes for WooCommerce
Finally, here’s a list of the most useful WooCommerce shortcodes you can use on your site.
- Cart page shortcode.
[woocommerce_cart
]
- Check out page
[woocommerce_checkout
]
- User Account.
[woocommerce_my_account
]
- Order Tracking Form.
[woocommerce_order_tracking
]
- Products shortcode.
[products
]
[featured_products
]
- Sale products.
[sale_products
]
- Best-selling products.
[best_selling_products
]
- Recent products.
[recent_products
]
- Product attribute.
[product_attribute
]
- Top-rated products.
[top_rated_products
]
- Product category: to display products in a specific category.
[product_category
]
- Product categories: displays all your product categories.
[product_categories
]
- Shop messages: to display messages.
[shop_messages
]
- Product Filter: displays a product search filter.
[woocommerce_product_filter
]
- Filter Attribute.
[woocommerce_product_filter_attribute
]
- Product Filter Category.
[woocommerce_product_filter_category
]
- Filter Price.
[woocommerce_product_filter_price
]
- Product Filter Tag.
[woocommerce_product_filter_tag
]
- Filter Rating.
[woocommerce_product_filter_rating
]
- Product Filter Sale: displays a live filter for products on sale.
[woocommerce_product_filter_sale
]
- Product Filter Reset: Displays a button to clear all live filters.
[woocommerce_product_filter_reset
]
WooCommerce Shortcodes: Conclusion
Overall, WooCommerce shortcodes will help you customize your store without writing long lines of code. This way, you can test different layouts and alternatives to find the right one for your store.
Even though they can seem complicated at first, the truth is that with some practice, they’ll make your life much easier and help you take your business to the next level.
For more alternatives to customize your online store, you can check out our guides on:
What do you think about WooCommerce shortcodes? Please let us know your thoughts in the comments below.