Tilda Help Center
How To Add Product Variants
How to add color, size, and other parameters for a product on the website
Before adding a product to a shopping cart, your customer can select a product variant, for example, an A1-sized poster or an A0-sized poster. Each product variant may have its own price.
You need to have a shopping cart to use this option. Find out how to set up a shopping cart.
On Tilda, you can add products to your website using a Product Catalog or via the Content panel of the block. The way you specify product parameters will differ for these methods.
In the Product Catalog, you can add product variants and provide each one with unique parameters and images. You can also specify additional options that affect the final cost, such as gift-wrapping or accessories.
In the Content panel of the block, you can only add options (parameters) similar to the additional options you create using the Product Catalog. However, they can be used as product parameters, too.
In the Product Catalog, you can add product variants and provide each one with unique parameters and images. You can also specify additional options that affect the final cost, such as gift-wrapping or accessories.
In the Content panel of the block, you can only add options (parameters) similar to the additional options you create using the Product Catalog. However, they can be used as product parameters, too.
How to add product variants and options using a Product Catalog
Watch the video tutorial on how to add product variants and options or read the detailed guide below
What is the difference between product variants, additional options and product parameters?
Product variants are unique sets of product options that differ from each other. To add a unique product variant, you need to specify its parameters such as color, size, price, etc. by adding options.
Additional options are parameters that can apply to any product variant when selected. For example, you can provide your customers with the option of ordering gift-wrapping or other services. Additional options can affect the final price of the product.
Product characteristics are parameters that are shared by all product variants but do not affect the final price. For example, it could be the country the product was made in or the product's material.
Additional options are parameters that can apply to any product variant when selected. For example, you can provide your customers with the option of ordering gift-wrapping or other services. Additional options can affect the final price of the product.
Product characteristics are parameters that are shared by all product variants but do not affect the final price. For example, it could be the country the product was made in or the product's material.
Before setting parameters for a product, you must first create it in the catalog. To do this, click on the "Add Product" button and fill in its title, description, and upload images.
Product Variants
If the product has variants, first add options (such as color or size) using the "Manage options" button.
Click on the "Add a new option" button.
Enter the option title. Then select how the option should be displayed in the product card; it can be a dropdown list, radio buttons, or buttons.
If you are creating a "Color" option, select the "Color option" box. To link the color to the product image, also select the "Link to variant image" box. Click on "Add" to display the option in the card.
If you are creating a "Color" option, select the "Color option" box. To link the color to the product image, also select the "Link to variant image" box. Click on "Add" to display the option in the card.
To view all options for a specific product, go back to its card and click on the "Manage options" button. A pop-up will open showing all available options, which you can edit, delete, or rearrange in the list.
To quickly add a new product option—click on the plus sign in the product card. This feature will be available after you have added one product variant at least.
To add a variant, for example, "Black pants size M," click on the "Add a new product variant" button. Each product variant can have its own set of options, separate price, and quantity available for sale.
The product card will display the set of options, if this set corresponds to a unique variant, it will show the other options—unique photo, price, and stock availability status.
Additional options
Additional options are common to all product variants. You can use them when you need to add gift-wrapping or an additional service.
Each additional option can affect the final price of the product. Each option value must be entered in a new line, if the option is paid, it should be specified in the format: Additional service =+100, where 100 is the option price that will increase the final price.
Each additional option can affect the final price of the product. Each option value must be entered in a new line, if the option is paid, it should be specified in the format: Additional service =+100, where 100 is the option price that will increase the final price.
You can add up to 5 additional options to the product card. More options cannot be added.
For additional options, you can configure the usage mode: single choice (dropdown list) and multiple choice (checkboxes).
Product characteristics
Characteristics do not affect the product price and are common for all product variants. For example, brand or country of manufacture.
You can add a characteristic in the product card under the Characteristics tab. Click on the "Add a new characteristic" link, specify its title and value.
Characteristics "Brand", "Dimensions and weight" do not need to be created separately. They are already created by default, and you can use them to specify values.
You can add a characteristic in the product card under the Characteristics tab. Click on the "Add a new characteristic" link, specify its title and value.
Characteristics "Brand", "Dimensions and weight" do not need to be created separately. They are already created by default, and you can use them to specify values.
The product variant is a separate product item with a set of options. Each variant can have its own SKU, image, price, quantity. Characteristics and additional options are common for all product variants in one card.
Adding options via block Content
You can also specify additional options for a product created in a block, not via the catalog. Any block from the "Store" category will do.
For example, add the ST200 block and in the Content tab, upload the product image and provide the title, description, and price.
For example, add the ST200 block and in the Content tab, upload the product image and provide the title, description, and price.
Next, click on the "Add option (e.g., size, color..)" link.
To add the options in the ST3** blocks, go to the block Content and click on the Show more: button, label, options link in the product card.
In the field on the left, specify the Option name; in the field on the right—Option values, each in a new line.
If the product is created manually in the block without linking to the catalog, up to 3 options can be added.
It will not be possible to set the usage mode for additional options in this case. The single choice (dropdown menu) will be applied by default.
In the field on the left, specify the Option name; in the field on the right—Option values, each in a new line.
If the product is created manually in the block without linking to the catalog, up to 3 options can be added.
It will not be possible to set the usage mode for additional options in this case. The single choice (dropdown menu) will be applied by default.
If the option has its own price, put the = sign and specify the price (just numbers, no currency symbol). For example: Gift-wrapping $5 = 5
If you need the additional product price to be added to the main price, specify the =+ symbol and specify the sum to be added to the price.
If you need the additional product price to be added to the main price, specify the =+ symbol and specify the sum to be added to the price.
If a number with a plus sign is specified after the "=" sign, this number will be added to the initial cost of the product.
For example, if the product costs $40, if "gift-wrapping =+$5" is specified for the option—the product will be added to the shopping cart at a price of $45.
If "S size = $80" is specified, then when this option is selected, the product will be added to the shopping cart at a price of $80.
For example, if the product costs $40, if "gift-wrapping =+$5" is specified for the option—the product will be added to the shopping cart at a price of $45.
If "S size = $80" is specified, then when this option is selected, the product will be added to the shopping cart at a price of $80.
Save the changes. Now the options that were specified will be displayed in the product card, along with a dropdown menu where you can choose variants.
If a product is created manually in a block without being linked to the Catalog, you can add up to three parameters.
In this case, you cannot set the Usage Mode for additional options. Single Choice (drop-down list) is used by default.
In this case, you cannot set the Usage Mode for additional options. Single Choice (drop-down list) is used by default.
