WooCommerce comes with several shortcodes that can be used to add a various type of functionality to your post, pages, widget, sidebar, etc without any type to write a code. In this article, I made a complete list to cover the shortcodes included with WooCommerce and their usage so that new/advanced users can take full benefits from WooCommerce.
WooCommerce Shortcodes for Pages:
There are 4 Page shortcodes available in WooCommerce.
1. Cart: WooCommerce creates a Cart page for its shopping cart functionality. This is the cart shortcode:
[woocommerce_cart]
This shortcode is used to display cart content and the interface for coupon codes and other cart-related elements. There are no parameters for this shortcode.
2. Checkout: Check out page shows the checkout functionality for your customers. This is the Checkout pages:
[woocommerce_checkout]
There are no parameters available for it. It shows all the information which will be collected from a user during checkout such as billing info, shipping info, payment method etc.
3. My Account: This shortcode displays the dashboard to the logged-in customers. This is the My Account pages:
[woocommerce_my_account]
In My Account Pages a customer can view their past orders, downloads, and update their personal details such as billing info, shipping info, account password.
4. Order Tracking: This shortcode will display the Order Tracking page.
[woocommerce_order_tracking]
You can combine My Account shortcode with Order Tracking will result in a better user experience as the user can check their order history and check the status of an order from the same page.
WooCommerce Product Shortcodes:
Single Product
The Product shortcode shoes a single product by either SKU or product ID.
[product id=”99″
[product sku=”F00″
Multiple Products
This WooCommerce shortcode allows you to show multiple products by ID or SKU. Use this shortcode:
[products ids=”1, 2, 3, 4, 5″]
You can also use the following arguments: order=” “, columns=” “, orderby=” “.
This shortcode:
[products ids=”1, 2, 3″ orderby=”date” columns=”3″ order=”desc”],
will output six products in 3 columns ordered by date in descending order.
Product Categories
Product Categories shortcode will display the product categories that you have created in the Woocommerce product categories section.
Arguments:
- number – Displays the number of products returned.
- orderby – What to order the results by.
- order – Order the results in asc or desc order.
- columns – How many columns to show the categories in.
- hide_empty – Set to 1 to hide categories with no products.
- parent – Set to 0 to only display top level categories
- ids – Show certain categories
[product_categories ids=”22, 34, 44, 65, 55” columns=”3″ hide_empty=”1″ parent=”0″]
Product Category by Slug
This is similar to product categories but this allows you to add all your products within the defined category and can be adjusted with the per_page=”” and columns=”” parameters. Here is the shortcode:
[product_category category=”” per_page=”16″ columns=”3″ orderby=”date” order=”desc”]
Recent Products
You can use this WooCommerce shortcode to list a set of recent products.
Arguments:
- per_page – How many products to show per page.
- columns – How many columns to show the products in.
- orderby – What to order the results by.
- order – Order the results in asc or desc order.
Shortcode:
[recent_products per_page=”12″ columns=”4″ orderby=”date” order=”asc”]
Featured Product
You can use this WooCommerce shortcode to display products that have been set as “featured” in WooCommerce.
Arguments:
- per_page – how many products to show per page.
- columns – The number of columns to put the products in.
- orderby – You can order the results by title, date, etc.
- order – Display the results ordered descending or ascending.
Shortcode:
[featured_products per_page=”12″ columns=”3″ orderby=”date” order=”asc”]
Sale Product
Sale products allow you to add products currently on sale.
Arguments:
- per_page – How many products to show per page.
- columns – How many columns to show the products in.
- orderby – What to order the results by.
- order – Order the results in asc or desc order.
Shortcode:
[sale_products per_page=”12″ columns=”4″ orderby=”date” order=”desc”]
Best Selling Products
If you want to show your best selling product, you need to use this shortcode:
[best_selling_products per_page=”12″ columns=”4″ orderby=”date” order=”asc”]
Top Rated Product
If you use the reviews and ratings feature built into WooCommerce, you can use this shortcode for displaying your best products. Here is the shortcode:
[top_rated_products per_page=”12″ columns=”4″ orderby=”date” order=”asc”]
Related Product
This WooCommerce shortcode shows all of your top-rated products.You need to use this shortcode for it:
[related_products per_page=”12″]
Add to Cart
This shortcode allows you to show the price and add to cart button of a single product by ID. The shortcode is look like the following:
Add to Cart URL
This shortcode prints the URL on the add to cart button of a single product by ID. Here is the shortcode:
[add_to_cart_url id=“99”]
Product Attribute
This WooCommerce shortcode lists products by attributes.
[product_attribute attribute=”color” filter=”black”]
Product Search Field
WooCommerce product search allows you to insert live search and live filtering facilities inside pages and posts. The shortcode is following:
[woocommerce_product_search]
Live Product Filter Shortcode
You can customize the live product by using the following live product filter shortcodes:
[woocommerce_product_filter] — This will allow you to shows a live Product Search Filter.
[woocommerce_product_filter_attribute] — This will allow you to shows a live Product Attribute Filter.
[woocommerce_product_filter_category] — This will allow you to shows a live Product Category Filter.
[woocommerce_product_filter_price] — This will allow you to shows a live Product Price Filter.
[woocommerce_product_filter_tag] — This will allow you to shows a live Product Tag Filter.
Display notifications on non WooCommerce pages:
Sometimes you need to display notifications on certain pages other than the default WooCommerce pages. [shop_messages] will help you get this done.
When WooCommerce Shortcodes Are Not Working / Troubleshooting of Shortcodes:
Sometimes it may happen that you paste a shortcode correctly but it will display error. If you face this issue, you need to check your code and remove the <pre> and </pre> tags surrounding the shortcode:
To remove this tags go to your text editor and remove it.
Related Articles: Shortcodes included with WooCommerce
Conclusion
That’s all. I hope you will encounter no issues while using these shortcodes on your WooCommerce Store and hopefully this tutorial will help you to customize your online store.
[…] of shortcodes to embed products on any […]
[…] of shortcodes to embed products on any […]
[…] of shortcodes to embed products on any […]
[…] of shortcodes to embed products on any […]