J2Store Documentation
DownloadFeaturesApps
  • Introduction to J2Store
  • Getting Started
    • Introduction to J2Store
    • Getting started with J2store
    • Technical Requirements
    • Installation
    • Update
    • Upgrade from FREE version to PRO version of J2Store
    • Migrating from 2.x to3.x
  • Migration from J2Store 3 to 4
  • Set up
    • Content plugin settings
    • Configuration
    • Currency
    • Custom fields
    • Set up multi-currency
  • Quickstart guide
  • Product Types
    • Simple product
    • Variable product
    • Configurable product
    • Flexible variable product
    • Downloadable product
  • Layout
    • Product layout
    • Product tag layout
    • Usecases
    • Category Tree for displaying filters
    • Special module positions
  • Catalog
    • Assigning a product to multiple categories
    • Product description
    • Short codes
    • Adding specifications to your products
    • Advanced pricing
    • Setting up tax for your products
    • Options
      • Import product options
      • How to create options and add them to your products
    • Filters
      • Product filters
      • Translating filters to your language
    • Manufacturers
    • Vendors
    • Adding related products
    • Ordering products on your storefront
  • Subscriptions and Memberships
    • Introduction to subscriptions and memberships in J2Store
    • Quickstart
    • Requirements and Installation
    • Basic Settings
    • Creating subscription based products
    • Simple Subscription Product
    • Paypal Reference Transactions for Subscriptions
    • Usecases
    • Customizing the subscription mail templates
    • Frequently asked questions
  • Partial Payments
    • Introduction to Partial payments
    • Basic Settings
    • Setting up plans for Partial Payments
    • Instances
    • Usecases
  • Booking and Reservations
    • Limitation of the booking products type
    • Requirements and Installation
    • Basic settings and Booking Management
    • Booking and Reservations
    • Creating a Bookable Product
    • how to restrict multiple booking for a product person based restriction
    • Usecases
  • Localisation
  • Translation
    • Translate J2Store into your language
    • Setting up the store in your Language
    • How to write language override for plugin in multilingual site
    • Language overrides in Joomla with examples
    • Translating Product Options
  • Design
    • Email templates
    • Invoice Template (Pro Feature)
  • Tax configuration
    • Untitled
    • Recommended Tax configuration for US States
    • Recommended Tax configuration for Canadian Stores
    • Recommended Tax Configuration for EU stores
    • Setting up European VAT Rules for selling Physical Goods with J2store
    • A simplified guide for New EU VAT rules 2015 for digital goods and setting them up in J2Store
    • How Tax is Calculated
  • Easy Checkout
    • Easy checkout
    • Trouble shooting issues
  • Shipping methods
    • Free Shipping
      • How to create coupons for free shipping
    • How to set up local store pick up shipping method
    • Australia post shipping plugin
    • Bring shipping plugin
    • Canadapost shipping plugin
    • FedEx shipping plugin
    • Purolator
    • Postal Code shipping plugin
    • Royal Mail Shipping
    • Standard shipping methods
    • Table Rate Shipping
    • UPS Shipping
    • USPS Shipping
    • United States postal service Shipping Plugin
    • USPS Advanced
  • Payment Methods
    • AliPay Payment Plugin
    • Authorize.Net plugin
    • Bank Transfer
    • Barclays Payment plugin
    • Braintree payment plugin
    • Cash on Delivery
    • CardSave Payment plugin
    • CCAvenue payment plugin
    • CECA Payment
    • Checkout fi¨
    • Culqi Payment
    • DIBS payment plugin
    • Direcpay Payment Plugin
    • EBS Payment Plugin
    • Elavon Coverage/Virtual Merchant Payment Plugin
    • eway Payment Gateway for j2store
    • First Data Plugin
    • Flo2Cash for J2Store
    • GestPay
    • Heartland Payment Plugin
    • Icepay Payment Plugin
    • Interpay
    • Klarna Payment Plugin
    • Mollie payment plugin
    • Money Order
    • Moneris eselectplus Hosted Paypage
    • MultiSafe Payment Plugin
    • Nochex Payment Plugin
    • NMI Payment Gateway
    • Ogone Payment plugin
    • Pagseguro Payment plugin
    • Paybox Payment plugin
    • Payeezy
    • Payfast Payment plugin
    • Paygate Payment
    • Paymate
    • Paypal Sandbox
    • Paypal Adavnced Payment plugin
    • Payment Express for J2Store
    • Payment Sense
    • Paypal Express Checkout
    • Paypal payment plugin
    • Paypal Pro Payment Plugin
    • Payseal Payment Plugin
    • Paysera Payment Plugin
    • Payson Payment Plugin
    • Payson Invoice Payment Plugin
    • Pay U Latam
    • PayUMoney plugin
    • Poli Payment Plugin
    • Post Finance
    • QuickPay
    • Razorpay
    • Rabobank Omnikassa
    • RealEx Payment Plugin
    • Redsys/Servired/Sermepa Payment Plugin
    • Sagepay Form Payment Plugin
    • Secure Trading Plugin
    • Sepa Payment
    • Sisow Payment for J2Store
    • Skrill Payment Plugin
    • Sofort Banking
    • Stripe
    • Squareup Payments
    • Tranzila Payment Plugin
    • USAePay Payment Plugin
    • Voguepay Payment Plugin
    • Worldpay Payment Plugin
    • 2Checkout Plugin
  • Sales
    • Coupons
    • Vouchers
    • Customers
    • Orders
  • Report Sales
  • Modules
    • Product search module
    • J2store Detailed Cart
    • Product categories module
    • Product display module
  • Apps
    • Add to user group
    • Additional fee
    • Ask question / quote
    • Availability-notification
    • Bundled Products
    • Bulk discounts
    • Change Password
    • Checkout Redirect
    • Custom Tabs
    • Data validation
    • Donation
    • Drop-box
    • Email basket Plugin
      • Email basket issues
    • GDPR compliance
    • Google-analytics-ecommerce-tracking
    • Group Products
    • How to send download links through email notifications
    • Image Popup
    • Invoice Prefix Generator
    • Open hours (time based restriction)
    • Pay later/Pay against invoice
    • Points and Rewards
    • Re-Order
    • Shipstation
    • Simple CSV import and export tool
    • Tax Utilities
    • Upload file in checkout
    • Quantity dropdown
  • Frequently Asked Questions
    • Where can i find my sub-template
    • Products not aligned properly on list view
    • SCA support for payment plugins
    • To show the base price instead of price range in flexivariable products
    • Where do I add the CSS on my site
    • Unable to save the settings in any app
    • Difference between product types
    • Commonly found issues
    • Frequently Asked Questions
    • Quantity Restriction
  • Troubleshooting Guide
    • Products not visible on storefront
    • Cart not Working
    • Troubleshooting Cart related Issues
    • Moving the description
    • Troubleshooting Checkout Issues
    • Troubleshooting Common Issues
    • How to disable shipping address and payment in checkout
    • Joomla Article Error decoding json data
    • Troubleshooting Email Issues
    • Troubleshooting Paypal related Issues
    • Troubleshooting Product Display Module Issues
    • How to create a custom thank you message
    • Troubleshooting Shipping Issues
    • Troubleshooting Tax Issues
    • Troubleshooting Translate related Issues
  • Common Overrides
    • To add options to downloadable products
    • Moving additional image list to the left of the main image in product view page
    • To display the UPCE/BAN/ISBN on the product page
    • To Display Both the main Image and the additional image in the product view page
  • Video Tutorials
    • Quick Start
    • Catalog Management
    • Subscriptions
    • Booking and Reservation
    • Partial Payments
    • Tax
    • Shipping Methods
    • Discounts
    • Language
    • Apps
    • Email and Invoice Template
    • Checkout and Payment
    • Sales and Orders
    • J2Store CPanel
  • General
    • How to set cron job on your server
    • How to create an FTP account and super user account in Joomla
  • Developer Guide
    • Introduction
    • Queue System
    • App for J2store
    • Sub-templates
    • Creating an integration plugin for your component
    • Payment plugin
    • Templates
  • Canonical URL Plugin
Powered by GitBook
On this page
  • Introduction
  • How variable products work:
  • When to use Variable product type:
  • Disadvantage of Variable Product Type:
  • How can i overcome this disadvantage ?
  • Creating a variable product
  • General
  • Images
  • Variants
  • Filters
  • Relations
  • A step-by-step guide to create a variable product
  • Creating an Article
  • General
  • Images
  • Variants
  • Filters
  • Relations
  • Apps
  • Video Tutorial:

Was this helpful?

  1. Product Types

Variable product

Introduction

Variable is a complex product type. It lets you define variations of a product where each variant may have a different attributes, e.g. SKU, price and stock level.

Since this is a complex product type, it might take some time (quite some time) to create it. You will need a lot of patience and also require quite some work. So be prepared.

A perfect example for a variable product is: T-Shirts. T-Shirts always come with the size and colour combination. Example: Small-Blue, Small-Red, Small-Green.

You will be adding a price, sku and stock PER combination.

NOTE: If your product does not require a combination or stock / price management for each variation, then a simple product will suit your requirements.

How variable products work:

Variable type product uses a Matrix algorithm to generate combinations.

Example:

Say you have two options: Size, Colour

Size has: Small, Medium

Colour has: Red, Blue

This forms a 2x2 matrix - 4 possible combinations

Small - Red

Small - Blue

Medium - Red

Medium - Blue

If we add just one more size (Large) and one more colour (Green), this will make a 3x3 matrix - meaning 9 combinations

When to use Variable product type:

  • Only when you want to manage inventory at the variant level. Example: You want to maintain a stock for Small - Blue, Small - Red. (As you can see, when you sell a T-Shirt, you naturally maintain the stock based on the Size and the Colour… you cannot maintain an inventory just by Size or Colour)

  • Only when you want to set different prices for different variants (Example: Small - Blue costs $10, Medium - Red costs $15)

Disadvantage of Variable Product Type:

When you change any option values or want to introduce a new variant, then entire combination (matrix) changes. So you will have to re-generate the entire variants, and set the prices.

How can i overcome this disadvantage ?

As the name suggests, it is very flexible and is based on the cartesian set algorithm. So you can add, remove a variant anytime without re-generating the entire combinations.

Creating a variable product

General

  • Visible in Storefront - First select whether the product is to be displayed in front of the store. If it is, set the option to ‘Yes’

  • Brand or Manufacturer - Select the brand or manufacturer of the product from the available list

  • Vendor - Select the vendor from whom the product is available for purchase - This is J2Store PRO feature

  • Tax Profile - Specify whether the product is taxable and if it is, select the taxprofile relevant to the product

  • Cart button text - The unique text for cart button could be mentioned here.

Images

This feature is available for native Joomla articles and in J2Store Product Layouts

To display the thumbnail, main and additional images in Joomla articles, you should first configure the Content - J2Store plugin in Plugin Manager. Otherwise, you wont see these images in your products.

Lets assume that a customer would like to purchase a car. Now, car images need to be loaded in this tab.

  • Main Image - The main image will be a general photo image of the car, that has to be uploaded by clicking on the ‘Select an image’ button and select the appropriate image from the files.

  • Thumbnail Image - The thumbnail image would be something that represents the original product, but it would be a much smaller one to fit into a button, that will be shown up in the cart. By seeing this, the customer will understand that his product is displayed on the button and will click the button to see more details about the car.

  • Additional Images - Additional images help the customer to know more details about the car, which will be showing the car view in many angles, and the customer will understand it clearly how it looks like, what the technical details of the car, the colour, and so on.

Variants

Variants are products of same type and nature but with different attributes. For e.g., consider a Laptop of a particular brand with certain attributes, say

  • Colour - Metallic Grey

  • Screen - 15.6 inches

  • RAM - 2 GB

  • HDD - 500 GB

  • SKU - MTG8620

and so on. This is a variant of the particular brand. Now, the same product with same brand, will be another variant with some attributes changed, like

  • Colour - Black

  • Screen - 15.6 inches

  • RAM - 2 GB

  • HDD - 500 GB

  • SKU - BLK8640

For both the items, brand and model name may be same, but the attributes like colour and SKU differs. These are two variants of a particular laptop brand.

  • A variant defines how this product differs from other products of same type

  • It may be SKU no, price, stock level or color

Lets discuss it with some image illustrations:

If you select ‘Size’ from the list, your screen will look like this:

You can see the option you have selected from the list added down there. Now, save the form to proceed.

You can see ’Set Values’ near the option name Size and click it. You will get a pop-up window to add attributes as illustrated below:

Once you are done, save changes and close the pop-up window to get back to the main window. Now you have set the values for the variants to be generated. Why wait, just go and generate the variants like this:

The button you have clicked for variant generation will adjust itself to show you a message, ‘Generating variants… Please wait’.

And that’s it. You have your variants generated! Wonder how? Just check the image below for a surprise…

If you want to edit the properties of the variants, click the open all button and you will get the screen like below:

Now you know how to deal with variants, options, attributes, properties and how to edit them.

Filters

Filters are certain attributes that help narrow the search of a particular product.

For e.g., assume that a customer searches for purple t-shirts in the store. Now, the productfilter is set as colour > purple, to narrow the search. See the image below:

Now the cart will display only the purple t-shirts.

Relations

  • In this tab page, relations are set for Upsells and Cross sells

  • An upsell is to get the customer to spend more money – buy a more expensive model of the same type of product considered for purchase.

  • A cross-sell is to get the customer to spend more money buy adding more products from other categories, additionally, along with the product intended for purchase.

  • Example:The terms cross-sell and upsell are often used interchangeably because, let’s face it, this gets confusing. Say the customer is viewing a Laptop with 2GB/500GB for $500.4GB/500GB-> $550 - Upsell, same product family, more expensive4GB/1TB -> $700 - Upsell, same product family, more expensiveLaptop Bag -> $25 - Cross sell, related product, additional sell

Custom fields / settings from applications will be displayed in this tab.

A step-by-step guide to create a variable product

J2Store implements an innovative concept in creating products. It uses the Joomla articles as products. So to create a product is to create an article.

So, lets create an article.

Creating an Article

Have a look at the image below:

As given in the above illustration, click in the top menu or in the left pane of the control panel. You will get a new screen like this.

  • Enter the name for your product.

  • Since you are creating article, you need to tell that the article be treated as product. So, select ‘Yes’.

  • Select the type of the product, i.e., ‘Variable’.

  • Now, click the ‘Save and Continue’ button.

Your product is successfully created and a message will be displayed like this.

General

Now you need to configure your product with necessary details. Begin with general tab.

  • If you select ‘Yes’ in the first option, your product will be displayed in the storefront

  • Select the brand or manufacturer of the product from the list

  • Select the vendor to order the product

  • Select the taxprofile that mathces the product profile

Now switch to Images tab.

Images

You can add main, thumbnail and additional images relevant to your product in this tab. Click the ‘select an image’ button to get a pop-up window to select the image.

Move on to variants tab.

Variants

If you select the option, then you need to set values for the option.

In the image, as you can see, you have added the option color. Now, save the configuration by clicking ONLY the green coloured button ‘Save’. DO NOT press any other button. Now, see the changes in the screen.

You can see the blue link, ‘Set Values’ adjacent to the option ‘Color’. Click this link to set some values for the option ‘Color’. Then only you can generate variants. Go ahead with setting values and see what happens…

If you select the value for the option and click the create button, you will get the resulting screen like this.

Close the window using the X in the top right corner and return to the tabs.

Now, as shown in the image, click on the ‘Generate Variants’, a green colored button, to generate variants for the products.

As you click the buttons to generate variants, the buttons adjusts itself to display the message ‘Generating variants… please wait’. Now its done. See the variants listed below, as shown in the image.

Once the variants are generated, you can edit the variants and add necessary details to the variant. When you edit a variant, you will have all the tabs in cart except variant tab. Fill in the required details for the product variant.

Having completed variants tab, now move on to filtes tab.

Filters

Here, you can set the filters to narrow product search. When you set filter value as ‘Mens’, all mens T-Shirts will be displayed. Likewise, women and kids. See the illustration below:

Relations

The next tab is Relations. Here, you can add products of higher value than the one being viewed by the customer and recommend the customer to buy that product, citing its advantages and additional features. This is an upsell.

Also, you can add some other products to convince the customer to buy theses products additionally. This is cross sell.

For more detailed explanation, refer to the Relations section of the Variable Product.

Apps

In this tab, you can add third party tools or plugins, that are available, to enhance the J2Store functionality, like adding additional fields, applications, functions or features.

Now, lets have a look on how your product is viewed in your online store. Check the image below:

Video Tutorial:

Here is a video that could help you create a product with variants:

To know how to manage inventory for variable products, follow the instructions given here:

PreviousSimple productNextConfigurable product

Last updated 3 years ago

Was this helpful?

In the latest versions of J2Store, we introduced a new product type :

General tab
Adding images
Adding variants
Saving variants
Click on set option values
Setting option values
List of variants
Open all variants
Filters
Relations
Article manager
Choosing product type
success message for creating variable product
General tab
Images
Select images
Variants
Variants of product
Variants creation
Set values
Set option values
Generate variants
Generating variants
Generated variants list
Editing variants
Filters
Relations
Apps section
Frontend view
Flexible variable product