Search

Shortcodes included with WooCommerce

WooCommerce comes with several shortcodes that can be used to insert content inside posts and pages. The following shortcodes are inserted into pages upon installation and should not need to be used anywhere else.

WooCommerce > 2.1.x Shortcodes:

  • [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
If you would like to learn more about the new WooCommerce 2.1 setup, see: Endpoints documentation.

WooCommerce < 2.1.x Shortcodes:

  • [woocommerce_edit_account] – Edit account pages
  • [woocommerce_change_password] – shows the change password page
  • [woocommerce_view_order] – shows the user account view order page
  • [woocommerce_logout] – shows the logout page
  • [woocommerce_pay] – shows the checkout pay page
  • [woocommerce_thankyou] – shows the order received page
  • [woocommerce_lost_password] – shows the lost password page
  • [woocommerce_edit_address] – shows the user account edit address page

The arguments array (labelled “Args”) shown above each of the following shortcodes displays valid parameters and default values.

Note: Use CTRL/CMD + Shift + V to paste any of the shortcodes below into your WordPress editor to avoid errors!

Cart ↑ Back to Top

Used on the cart page, the cart shortcode displays the cart contents 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 or order to show, it’s set by default 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 Page ↑ Back to Top

Show a full single product page by ID or SKU.

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

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' => 'name',
      '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 paramater to 0 to only display top level categories. Set IDs to a comma separated list of category IDs to only show those.

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"]

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']

Related Products ↑ Back to Top

List related products.

Args:

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

[related_products per_page="12"]

The ‘per_page’ Argument

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

Messed-Up 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.

Back to the top