In this guide, we are going to cover the shortcodes included with WooCommerce. These help you embed content like a future product or even specific products into pages, post, widget, etc.
There are a few useful shortcodes for WooCommerce and it is important that we cover them all. You can read about every single one in this tutorial. Apart from WooCommerce, you can use these shortcodes for your Cart, Checkout and My account pages etc. to display their content.
[woocommerce_cart] – This shortcode will demonstrate the customer’s cart.
[woocommerce_checkout] – This shortcode will display the checkout page.
[woocommerce_order_tracking] – This shortcode will display the Order Tracking page.
[woocommerce_my_account] – This shortcode will display the My Account Page.
You should also note that you can use combined shortcodes with each page, for example, you can set up a form page with [woocommerce_my_account], [woocommerce_order_tracking] on one page.
WooCommerce Shortcodes Plugin
Now first thing first, you need to add the WooCommerce shortcode plugin. For installing this plugin just follow these few steps:
Go to your admin dashboard and click on Plugin >> Add New on the right side. Then search for WooCommerce shortcodes, and then you just have to install and activate it.
When you install a shortcode plugin for WooCommerce, you will find a new shortcode button in your page editor and post editor. Just click on the button and you’ll see all the shortcodes in the drop down list. See the screenshot below.
Product Price/Cart Button
When you click on the Price/Cart button, it will ask you for your product ID and SKU. After filling the instructions it will generate the following shortcode [add_to_cart id=”21″ sku=”21″].
This is used to show the price and add to cart button for a singular product, either by ID or SKU.
I am adding a new page and add the shortcode:
I can also add my product ID and whatever i want to display:
Clicking the OK button will generate a shortcode like in the screenshot below:
Click the publish button and you’ll see that the shortcode is generated successfully as shown in this screenshot:
Multiple Product Shortcode
Similar to the previous example, you can also add multiple products while using 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. You can also use asc for ascending and title for ordering.
Product Categories allow you to add product categories loop and output with this shortcode: [product_category category=”one”]. For the purpose of categories section, here are seven more attributes you can apply to this shortcode:
‘number‘ => ‘null‘, – This shortcode represent the number of categories.
‘orderby‘ => ‘name‘, – This shortcode represent the order, “name” and “date” are valid options.
‘order‘ => ‘ASC‘, – This shortcode represent how product categories are ordered, “ASC” or “DESC“.
‘columns‘ => ‘4′, – This shortcode defines the number of columns categories are organized into.
‘hide_empty‘ => ‘1‘, – This shortcode represent Set to 1 to hide categories with no products or 0 to show them.
‘parent‘ => ”, – This shortcode represent Set to 0 to only display top-level categories.
‘ids‘ => ” – This shortcode represent that IDs can be set to only output specified results.
Product Categories 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”].
The Recent product will show you the products you may have added recently. Here is the shortcode: [recent_products per_page=”12″ columns=”4″ orderby=”date” order=”ASC”].
If you need to see the result after, add this shortcode on your page/post or anywhere else:
Feature products allow you to add your favorite products to your web page. Just go to your admin site dashboard, Products >> Products and you will see an icon like this:
If you want to add featured products, just click on the icon. See the screenshot below:
Here is the shortcode:
[featured_products per_page=”12″ columns=”4″ orderby=”date” order=”ASC”]
Here’s what it will look like now:
Sale products allow you to add products currently on sale.
Here is the shortcode: [sale_products per_page=”12″ columns=”4″ orderby=”date” order=”ASC”]
After you have added this shortcode, you can see the result as demonstrated below:
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, then this shortcode can be useful for displaying your best products. Here is the shortcode: [top_rated_products per_page=”12″ columns=”4″ orderby=”date” order=”ASC”].
Related product show you the list of all the similar products. You need to use this shortcode for it: [related_products per_page=”12″].
This is given to you on your receipt and in the confirmation email you receive.
That is all there is to it. I hope you will encounter no issues while using these shortcodes on your WordPress website and hopefully this tutorial has proved to be of help. If you have any query or suggestion about this tutorial, leave a comment below and we’ll sort it out!
Start Creating Web Apps on Managed Cloud Servers Now!
Easy Web App Deployment for Agencies, Developers and E-Commerce Industry