Shortcodes are a type of macro code that can be used in your post/page editor to include dynamic shop content.
Your shop offers two shortcodes designed for use in posts (and pages) to allow you to include products [product] or entire categories [category].
Other shortcodes are:
[catalog]
[cart]
[account]
[checkout]
Contents |
[product]
The product shortcode includes product information directly into a post or page.
There are a few ways to specify the product you want included in your post:
- By Product Name
Include the product using the exact name of the product. You’ll need to use the exact same letter-case as you entered for the product name in the product editor.[product name="Product Name"] - By Product Slug
The product slug is a url-friendly version of the product name used primarily for building “pretty URLs”. Generally the product slug is an all lowercase version with spaces changed to hyphens ( – ).[product slug="product-name"] - By Product ID
This is probably the fastest most accurate way to include a product, but it is a bit less obvious of how to find the product’s ID. You can usually find this in your browser’s location/address bar when editing a product where ...&edit=ID[product id="1"]
[category]
The category shortcode allows you to include the products of any category into your posts. The category shortcode supports the same options of the shop() category tag.
Like the [product] shortcode, the category shortcode has a couple of ways to specify the category you want to include:
- By Category Name
Include a category using the exact name of the product. You’ll need to use the exact same letter-case (uppercase and lowercase letters) as it is listed in the category editor.[category name="Category Name"] - By Category Slug
The category slug is a url-friendly version of the category name used primarily for building “pretty URLs”. Generally the category slug is an all lowercase version of the name with spaces changed to hyphens ( – ).[category slug="category-name"] - By Category ID
Like the product ID, this method is probably the fastest most accurate way to include a category, but it is a bit less obvious how to find the product’s ID. You can usually find this in your browser’s location/address bar when editing a category where the category ID is found after...&edit=##[category id="1"]
Smart Categories
Additionally, you can include smart categories built-in to shop, but you can only use the category slug method to do so. Here is a reference for including each smart category available:
- Newest Products
[category slug="new"]
- Featured Products
[category slug="featured"]
- On Sale Products
[category slug="onsale"]
- Bestseller Products
[category slug="bestsellers"]
If you need to apply shop styling to non-shop pages, simply put the shortcode in a containing div that calls the shop CSS element:
-
< div id="shop" > [Shortcode] < /div >
Pre-defined Searches
You can also include pre-defined searches into your posts or pages: