WooCommerce Docs

Documentation, Reference Materials, and Tutorials for your WooCommerce products

Search

Shortcodes included with WooCommerce

WooCommerce comes with several shortcodes that can be used to insert content inside posts and pages.

Page Shortcodes: ↑ Back to Top

  • [woocommerce_cart] – shows the cart page
  • [woocommerce_checkout] – shows the checkout page
  • [woocommerce_order_tracking] – shows the order tracking form
  • [woocommerce_my_account] – shows the user account page

In most cases, these shortcodes will be added to pages automatically via our onboarding wizard and do not need to be used manually.

Cart ↑ Back to Top

Used on the cart page, the cart shortcode displays cart content and interface for coupon codes and other cart bits and pieces.

Args: none

[woocommerce_cart]

Checkout ↑ Back to Top

Used on the checkout page, the checkout shortcode displays the checkout process.

Args: none

[woocommerce_checkout]

Order Tracking Form ↑ Back to Top

Lets a user see the status of an order by entering their order details.

Args: none

[woocommerce_order_tracking]

My Account ↑ Back to Top

Shows the ‘my account’ section where the customer can view past orders and update their information. You can specify the number of orders to show. By default, it’s set to 15 (use -1 to display all orders.)

Args:

array(
     'current_user' => '',
     'order_count' => '15'
 )
[woocommerce_my_account order_count="12"]
Current user argument is automatically set using get_user_by( ‘id’, get_current_user_id() ).

The following shortcodes can be used anywhere you want:

Recent Products ↑ Back to Top

Lists recent products – useful on the homepage. The ‘per_page’ shortcode determines how many products to show on the page and the columns attribute controls how many columns wide the products should be before wrapping.

Args:

array(
     'per_page' => '12',
      'columns' => '4',
      'orderby' => 'date',
      'order' => 'desc'
 )
[recent_products per_page="12" columns="4"]
To learn more about the default ‘orderby’ parameters, see: WordPress Codex Class Reference

Featured Products ↑ Back to Top

Works the same as recent products but displays products that have been set as “featured.” In this example, the shortcode is saying: Show 12 featured products in 4 columns.

Args:

array(
     'per_page' => '12',
      'columns' => '4',
      'orderby' => 'date',
      'order' => 'desc'
 )
[featured_products per_page="12" columns="4"]

Product ↑ Back to Top

Show a single product by ID or SKU.

[product id="99"]
[product sku="FOO"]

*If the product isn’t showing, make sure it isn’t set to Hidden in the Catalog Visibility.

To find the Product ID, go to the Products screen, hover over the product and the ID appears as shown below.

WooCommerce-Product-ID

Products ↑ Back to Top

Show multiple products by ID or SKU. Make note of the plural ‘products.’

Args:

array(
      'columns' => '4',
      'orderby' => 'title',
      'order' => 'asc'
 )
[products ids="1, 2, 3, 4, 5"]
[products skus="foo, bar, baz" orderby="date" order="desc"]

*If the product is not showing, make sure it is not set to Hidden in the Catalog Visibility.

Add to Cart ↑ Back to Top

Show the price and add to cart button of a single product by ID.

Args:

array(
      'id' => '99',
      'style' => 'border:4px solid #ccc; padding: 12px;',
      'sku' => 'FOO'
 )
[add_to_cart id="99"]

Add to Cart URL ↑ Back to Top

Echo the URL on the add to cart button of a single product by ID.

Args:

array(
      'id' => '99',
      'sku' => 'FOO'
 )
[add_to_cart_url id="99"]

Product Category ↑ Back to Top

Show multiple products in a category by slug.

Go to: WooCommerce > Products > Categories to find the slug column.
Go to: WooCommerce > Products > Categories to find the slug column.

Args:

array(
     'per_page' => '12',
      'columns' => '4',
      'orderby' => 'title',
      'order' => 'asc',
      'category' => ''
 )
[product_category category="appliances"]

Product Categories ↑ Back to Top

Display product categories loop

Args:

array(
      'number' => 'null',
      'orderby' => 'title',
      'order' => 'ASC',
      'columns' => '4',
      'hide_empty' => '1',
      'parent' => '',
      'ids' => ''
 )

The `number` field is used to display the number of products and the `ids` field is to tell the shortcode which categories to display.

[product_categories number="12" parent="0"]

Set the parent parameter to 0 to only display top level categories. Set IDs to a comma separated list of category IDs to only show those.

To find the Category ID, go to the Product Categories screen, hover over the category and the ID appears in the URL.

Product Page ↑ Back to Top

Show a full single product page by ID or SKU.

[product_page id="99"]
[product_page sku="FOO"]

Sale Products ↑ Back to Top

List all products on sale.

Args:

array(
     'per_page' => '12',
     'columns' => '4',
     'orderby' => 'title',
     'order' => 'asc'
 )

[sale_products per_page="12"]

Best-Selling Products ↑ Back to Top

List best-selling products on sale.

Args:

array(
     'per_page' => '12',
     'columns' => '4'
 )

[best_selling_products per_page="12"]

Related Products ↑ Back to Top

List related products.

Args:

array(
     'per_page' => '12',
     'columns' => '4',
     'orderby' => 'title'
 )

[related_products per_page="12"]

Top Rated Products ↑ Back to Top

List top-rated products on sale.

Args:

array(
     'per_page' => '12',
     'columns' => '4',
     'orderby' => 'title',
     'order' => 'asc'
 )

[top_rated_products per_page="12"]

Product Attribute ↑ Back to Top

List products with an attribute shortcode.

Args:

array(
     'per_page' => '12',
     'columns' => '4',
     'orderby' => 'title',
     'order' => 'asc',
     'attribute' => '',
     'filter' => ''
 )

[product_attribute attribute='color' filter='black']

The ‘per_page’ Argument ↑ Back to Top

Note: the ‘per_page’ shortcode argument will determine how many products are shown on a page. This will not add pagination to the shortcode.

Troubleshooting Shortcodes ↑ Back to Top

If you correctly pasted your shortcodes and the display looks incorrect, make sure you did not embed the shortcode between <pre> tags. This is a common issue. To remove these tags, edit the page, and click the Text tab:

Remove Pre Tags from Shortcode

Sorting Products by Custom Meta Fields ↑ Back to Top

In many shortcodes like:

  • [recent_products]
  • [featured_products]
  • [products]
  • [product_category]
  • [sale_products]
  • [top_rated_products]
  • [product_attribute]
  • [related_products]

you can choose to order products by the following values

  • menu_order
  • title
  • date
  • rand
  • id

using the “orderby” attribute, for example:

[products skus=”foo, bar, baz” orderby=”date” order=”desc”].

But you can also sort products by custom meta fields using the code below (in this example we order product by price):

add_filter( 'woocommerce_shortcode_products_query', 'woocommerce_shortcode_products_orderby' );

function woocommerce_shortcode_products_orderby( $args ) {

	$standard_array = array('menu_order','title','date','rand','id');

	if( isset( $args['orderby'] ) && !in_array( $args['orderby'], $standard_array ) ) {
		$args['meta_key'] = $args['orderby'];
		$args['orderby']  = 'meta_value_num'; 
	}

	return $args;
}

You need to place this snippet in functions.php in your theme folder and then customize by editing the meta_key.

Note: We are unable to provide support for customizations under our Support Policy. If you are unfamiliar with code/templates and resolving potential conflicts, contact a WooExpert.

Back to the top