Make sure you are running the latest version of Avada and the latest version of WordPress. Always check the Important Update Information first. Check our Full Online Documentation for the answer to your question. Disable any additional 3rd party plugins you may be using to see if it fixes the issue. In this video I will show you how to add Ecommerce (Shop) Element to your WordPress website using WordPress Theme Avada as an example. Contact me if you need. Free Download WooCommerce Page Builder For Avada (Nulled) Latest Version is the ideal Fusion Builder add-on to effortlessly layout for WooCommerce and more. This plugin provides a full set of easy-to-use WooCommerce shortcodes.

• Avada Woocommerce Shortcodes
• Wordpress Avada
• Avada Website
• Avada Woocommerce

Variable products are a product type in WooCommerce that lets you offer a set of variations on a product, with control over prices, stock, image and more for each variation. They can be used for a product like a shirt, where you can offer a large, medium and small and in different colors.

Adding a Variable Product ↑ Back to top

Step 1. Set the Product Type

To add a variable product, create a new product or edit an existing one.

1. Go to: WooCommerce >Products.
2. Select the Add Product button or Edit an existing product. The Product Data displays.
3. Select Variable product from the Product Data dropdown.

Step 2. Add Attributes to Use for Variations ↑ Back to top

In the Attributes section, add attributes before creating variations — use global attributes that are site-wide or define custom ones specific to a product.

Global Attributes

To use a global attribute:

1. Create global attributes.
2. Select one from the dropdown and click Add.
3. Choose Select all to add all attributes to the variable product (if applicable).
4. Enable the Used for variations checkbox to tell WooCommerce it’s for your variations.
5. Click Save attributes.

Custom Attributes

To add a new attribute specific to this product:

1. Select Custom product attribute and click Add.
2. Name the attribute (e.g., Size).
3. Set values separated by a vertical pipe, | (e.g., Small | Medium | Large).
4. Enable the Used for variations checkbox.
5. Click Save attributes.

Step 3. Add Variations ↑ Back to top

To add a variation, go to the Variations section in the Product Data meta box.

Manually Add a Variation

1. Select Add variation from the dropdown menu, and select Go.
   
2. Select attributes for your variation. To change additional data, click the triangle icon to expand the variation.
   
3. Edit any available data. The only required field is Regular Price.
4. Click Save changes.

Creating All Possible Variations

Select Create variations from all attributes to have WooCommerce create every possible combination of variations and click Go:

It will create a new variation for each and every possible combination of variation attributes (max 50 per run). If you have more possible combinations you can run it again.

If you have two attributes – color (with values blue and green) and size (with values large and small) it creates the following variations:

• Large Blue
• Large Green
• Small Blue
• Small Green

Editing Many Variations

If you have more than 15 variations, use the buttons to navigate forward and backward through the list. Each time you navigate to a new set of variations, the previous set is saved. This ensures that all data is saved.

Setting Defaults ↑ Back to top

Set defaults you prefer on variations. In the example, no default form values were set, so users can pick any color and size right away from the product page.

If you want a certain variation already selected when a user visits the product page, choose the default form values. This also enables the Add to Cart button to appear automatically on variable product pages.

You can only set defaults after at least one variation has been created.

Adding Variation Data ↑ Back to top

Each variation can have the following properties.

General

• Enabled – Enable or disable the variation.
• Downloadable – If this a downloadable variation.
• Virtual – If this product isn’t physical or shipped, shipping settings are removed.
• Regular Price (required) – Set the price for this variation.
• Sale Price (optional) – Set a price for this variation when on sale.
• Tax status – Taxable, shipping only, none.
• Tax class – Tax class for this variation. Useful if you are offering variations spanning different tax bands.
• Stock quantity – Shows if Manage stock? is selected. Allows to set the current stock level for the variation.
• Allow backorders? – Shows if Manage stock? is selected. Allows to set if backorders are allowed for the variation; if enabled, stock can go below zero.
• Low stock threshold – Shows if Manage stock? is selected. When the stock for the variation reaches this level you will get a notification email. If not set, the product-wide threshold will be used (see Inventory Management below).
• Downloadable Files – Shows if Downloadable is selected. Add file(s) for customers to download.
• Download Limit – Shows if Downloadable is selected. Set how many times a customer can download the file(s). Leave blank for unlimited.
• Download Expiry – Shows if Downloadable is selected. Set the number of days before a download expires after purchase.

Inventory Management

Inventory for variable products can be managed on product and variation level.

Сhoose how to manage stock by toggling Enable stock management at product level on the Inventory tab:

The following settings are available if you choose to manage stock on a product level:

• SKU – If you use SKUs, set the SKU or leave blank to use the product’s SKU.
• Manage Stock? – Tick the box to manage stock at the variation level.
• Stock Quantity – Shows if Manage Stock is selected. Input the quantity. Stock for the specific variation, or left blank to use the product’s stock settings.
• Allow Backorders – Choose how to handle backorders.
• Low stock threshold – When the stock for the variation reaches this level you will get a notification email.
• Sold Individually? – Allow only one to be sold in one order. (This setting is used for the product itself. You cannot set a specific variation to only be sold once per order)

If Low stock threshold isn’t set then the store-wide default will be used. This default can be set in the Products – Inventory tab of WooCommerce settings:

Choosing to manage stock for variations individually allows you to edit the same properties for each variation.

Set Stock Status can be applied to all variations at once to In stock or Out of stock. Bulk-update under Variations:

Shipping

• Weight – Weight for the variation, or left blank to use the product’s weight.
• Dimensions – Height, width and length for the variation, or left blank to use the product’s dimensions.
• Shipping class – Shipping class can affect shipping. Set this if it differs from the product.

Linked Products

• Upsells
• Cross-sells
• Grouped

If the SKU, weight, dimensions, and stock fields are not set, then it inherits values assigned to the variable product. Price fields must be set per variation.

Add an Image to the Variation ↑ Back to top

1. Expand the variation.
2. Click the blue image placeholder (screenshot).
3. Select the image you wish to use.
4. Save.

Bulk Editing ↑ Back to top

You can bulk-edit variations by selecting the specific piece of data you want from the dropdown. In this example, I want to edit prices for all variations:

What Customers See ↑ Back to top

On the frontend, when viewing a variable product, the user is presented with dropdown boxes to select variation options. Selecting options will reveal information about the variation, including available stock and price.

If the user tries to click the greyed out add to cart button before choosing an attribute, a message will appear asking them to select some attributes.

In the product archive page, Add to Cart does not display because a variation must first be chosen before adding to cart on the product page.

Questions

Do you still have questions and need assistance?

Avada Woocommerce Shortcodes

• Get in touch with a Happiness Engineer via our Help Desk. We provide expert priority support for WooCommerce.com and Jetpack customers but not other third-party plugins.
• If you are not a customer at WooCommerce.com, we recommend finding help on the WooCommerce Support Forum or hiring a recommended expert on our customizations page.

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

How to use shortcodes ↑ Back to top

Where to use ↑ Back to top

Shortcodes can be used on pages and posts in WordPress. If you are using the block editor, there is a shortcode block you can use to paste the shortcode in.

If you are using the classic editor, you can paste the shortcode on the page or post.

Args (or Arguments) ↑ Back to top

Several of the shortcodes below will mention “Args”. These are ways to make the shortcode more specific. For example, by adding id='99' to the [add_to_cart] shortcode, it will create an add-to-cart button for the product with ID 99.

Page Shortcodes

WooCommerce cannot function properly without the first three shortcodes being somewhere on your site.

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

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

Checkout ↑ Back to top

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

Args: none

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:

Order Tracking Form ↑ Back to top

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

Args: none

Products ↑ Back to top

The [products] shortcode is one of our most robust shortcodes, which can replace various other strings used in earlier versions of WooCommerce.

The [products] shortcode allows you to display products by post ID, SKU, categories, attributes, with support for pagination, random sorting, and product tags, replacing the need for multiples shortcodes such as [featured_products], [sale_products], [best_selling_products], [recent_products], [product_attribute], and [top_rated_products], which are needed in versions of WooCommerce below 3.2. Review the examples below.

Available Product Attributes ↑ Back to top

The following attributes are available to use in conjunction with the [products] shortcode. They have been split into sections for primary function for ease of navigation, with examples below.

Display Product Attributes

• limit – The number of products to display. Defaults to and -1 (display all) when listing products, and -1 (display all) for categories.
• columns – The number of columns to display. Defaults to 4.
• paginate – Toggles pagination on. Use in conjunction with limit. Defaults to false set to true to paginate .
• orderby – Sorts the products displayed by the entered option. One or more options can be passed by adding both slugs with a space between them. Available options are:
  • date – The date the product was published.
  • id – The post ID of the product.
  • menu_order – The Menu Order, if set (lower numbers display first).
  • popularity – The number of purchases.
  • rand – Randomly order the products on page load (may not work with sites that use caching, as it could save a specific order).
  • rating – The average product rating.
  • title – The product title. This is the default orderby mode.
• skus – Comma-separated list of product SKUs.
• category – Comma-separated list of category slugs.
• tag – Comma-separated list of tag slugs.
• order – States whether the product order is ascending (ASC) or descending (DESC), using the method set in orderby. Defaults to ASC.
• class – Adds an HTML wrapper class so you can modify the specific output with custom CSS.
• on_sale – Retrieve on sale products. Not to be used in conjunction with best_sellingor top_rated.
• best_selling – Retrieve the best selling products. Not to be used in conjunction with on_sale or top_rated.
• top_rated – Retrieve top-rated products. Not to be used in conjunction with on_saleor best_selling.

Content Product Attributes

• attribute – Retrieves products using the specified attribute slug.
• terms – Comma-separated list of attribute terms to be used with attribute.
• terms_operator – Operator to compare attribute terms. Available options are:
  • AND – Will display products from all of the chosen attributes.
  • IN – Will display products with the chosen attribute. This is the default terms_operator value.
  • NOT IN – Will display products that are not in the chosen attributes.
• tag_operator – Operator to compare tags. Available options are:
  • AND – Will display products from all of the chosen tags.
  • IN – Will display products with the chosen tags. This is the default tag_operator value.
  • NOT IN – Will display products that are not in the chosen tags.
• visibility – Will display products based on the selected visibility. Available options are:
  • visible – Products visible on shop and search results. This is the default visibility option.
  • catalog – Products visible on the shop only, but not search results.
  • search – Products visible in search results only, but not on the shop.
  • hidden – Products that are hidden from both shop and search, accessible only by direct URL.
  • featured – Products that are marked as Featured Products.

• category – Retrieves products using the specified category slug.
• tag – Retrieves products using the specified tag slug.
• cat_operator – Operator to compare category terms. Available options are:
  • AND – Will display products that belong in all of the chosen categories.
  • IN – Will display products within the chosen category. This is the default cat_operator value.
  • NOT IN – Will display products that are not in the chosen category.

• ids – Will display products based on a comma-separated list of Post IDs.
• skus – Will display products based on a comma-separated list of SKUs.

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

Special Product Attributes

These attributes cannot be used with the “Content Attributes” listed above, as they will likely cause a conflict and not display. You should only use one of the following special attributes.

• best_selling – Will display your best selling products. Must be set to true.
• on_sale – Will display your on-sale products. Must be set to true.

Examples of Product Scenarios ↑ Back to top

In the following scenarios, we’ll use an example clothing store.

Scenario 1 – Random Sale Items

I want to display four random on sale products.

This shortcode explicity states four products with four columns (which will be one row), showing the most popular on-sale items. It also adds a CSS class quick-sale, which I can modify in my theme.

Scenario 2 – Featured Products

I want to display my featured products, two per row, with a maximum of four items.

This shortcode says up to four products will load in two columns, and that they must be featured. Although not explicitly stated, it uses the defaults such as sorting by title (A to Z).

Scenario 3 – Best Selling Products

I want to display my three top best selling products in one row.

Scenario 4 – Newest Products

I want to display the newest products first – four products across one row. To accomplish this, we’ll use the Post ID (which is generated when the product page is created), along with the order and orderby command. Since you can’t see the Post ID from the frontend, the ID#s have been superimposed over the images.

Scenario 5 – Specific Categories

I only want to display hoodies and shirts, but not accessories. I’ll use two rows of four.

Alternatively, I only want to display products not in those categories. All I need to change is the cat_operator to NOT IN.

Note that even though the limit is set to 8, there are only four products that fit that criteria, so four products are displayed.

Scenario 6 – Attribute Display

Each of the clothing items has an attribute, either “Spring/Summer” or “Fall/Winter” depending on the appropriate season, with some accessories having both since they can be worn all year. In this example, I want three products per row, displaying all of the “Spring/Summer” items. That attribute slug is season, and the attributes are warm and cold. I also want them sorted from the newest products to the oldest.

Alternatively, if I wanted to display exclusively cold weather products, I could add NOT IN as my terms_operator:

Note that by using NOT IN, I exclude products that are both in “Spring/Summer” and “Fall/Winter”. If I wanted to show all cold-weather appropriate gear including these shared accessories, I would change the term from warm to cold.

Scenario 7 – Show Only Products With tag “hoodie”

Sorting Products by Custom Meta Fields ↑ Back to top

When using the Products shortcode, you can choose to order products by the pre-defined values above. You can also sort products by custom meta fields using the code below (in this example we order products by price):

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

Product Category ↑ Back to top

These two shortcodes will display your product categories on any page.

• [product_category] – Will display products in a specified product category.
• [product_categories] – Will display all your product categories.

Available Product Category attributes ↑ Back to top

• ids – Specify specific category ids to be listed. To be used in [product_categories]
• category – Can be either the category id, name or slug. To be used in [product_category]
• limit – The number of categories to display
• columns – The number of columns to display. Defaults to 4
• hide_empty – The default is “1” which will hide empty categories. Set to “0” to show empty categories
• parent – Set to a specific category ID if you would like to display all the child categories. Alternatively, set to “0” (like in the example below) to show only the top level categories.
• orderby – The default is to order by “name”, can be set to “id”, “slug”, or “menu_order”. If you want to order by the ids you specified then you can use orderby='include'
• order – States whether the category ordering is ascending (ASC) or descending (DESC), using the method set in orderby. Defaults to ASC.

Examples of Product Category Scenarios ↑ Back to top

Scenario 8 – Show Top Level Categories Only

Imagine you only wanted to show top level categories on a page and exclude the sub categories, well it’s possible with the following shortcode.

Product Page ↑ Back to top

Show a full single product page by ID or SKU.

[product_page sku=”FOO”]

Related Products ↑ Back to top

List related products.

Args:

[related_products limit=”12″]

limit Argument ↑ Back to top

Add to Cart ↑ Back to top

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

Args:

Add to Cart URL ↑ Back to top

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

Wordpress Avada

Args:

Display WooCommerce notifications on pages that are not WooCommerce ↑ Back to top

Avada Website

[shop_messages] allows you to show WooCommerce notifications (like, ‘The product has been added to cart’) on non-WooCommerce pages. Helpful when you use other shortcodes, like [add_to_cart], and would like the users to get some feedback on their actions.

Avada Woocommerce

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:

Another common problem is that straight quotation marks (') are displayed as curly quotation marks (“). For the shortcodes to work correctly, you need straight quotation marks.