Add selling plans
Show available selling plans on the product page
Selling plan groups and individual selling plans have a similar structure to products and variants. You can view selling plan groups like products, where there are multiple options available to comprise an individual selling plan, similar to variant options to comprise an individual variant.
You can access the available selling plan options through the
selling_plan_groups attribute of the product object. For each selling_plan_group, you should output each of its
options inside the product form.
To track the ID of the selected selling plan, you need to include an input with an attribute of
name="selling_plan" whose value will be the ID. If there’s no selected selling plan, the value should be empty.
Update selling plan information
There are two storefront interactions to consider around selling plans:
When a customer selects a variant, the selling plan options might need to be updated based on the newly selected variant. As such, you need to detect this change, and update which selling plan options are displayed.
To intercept a variant selection event, you can add a
change event listener to the general product form. You can access the selected variant ID through the form input with an attribute of
With the selected variant ID and the product object, you can access the selected variant object, and therefore any associated selling_plan_allocation objects to update your selling plan option display.
Selling plan option selection
When a customer selects a selling plan option, it also changes the selected selling plan, which means that you need to update the selling plan input. This input has an attribute of
name="selling_plan", and it’s value is the selling plan ID.
In order to find the selling plan ID of the selected selling plan, you need to compare the selected selling plan options with the available selling plans on the selected variant.
You can access the selected variant ID through the form input with an attribute of
With access to the selected variant ID and the product data, you can find the selected variant object and its available selling plans. This allows you to compare the selected selling plan options against the available selling plans to find the selected selling plan ID.
Show selected selling plans to customers
When a customer selects a selling plan, they should see the name of that selection in two places:
- In the cart
- On the customer order page
The selected selling plan, if there is one, is accessible through the
selling_plan_allocation attribute of the line_item object.