# Integration for Product Catalog 2.0

In Product Catalog 1.0, products are identified using plan_id and addon_id. However, in Product Catalog 2.0 products are identified using item_price_id.

Also, any associated analytics integrations like Google Analytics or Google Tag Manager start referring to products using item_price_id.

# Integrating Checkout

Similar to Product Catalog 1.0, you can copy Drop-in script from the Chargebee user interface and embed it in your website’s code. Only difference being the options to select before generating the Checkout Button code.

To generate the Checkout Button code, click Settings > Configure Chargebee > Checkout and Self-Serve Portal > Integrate with Chargebee and select the necessary Product family and Plan. Add Addons and Charges to it.

The Checkout Button code is updated with the selected options. Copy and embed it in the “Subscribe” button on your website or application.

# Options to select while generating Drop-in Script:

Options to select Available in Product Catalog 1.0? Available in Product Catalog 2.0?
Product family No Yes
Plan Yes Yes
Addons Yes Yes
Charges No Yes
  • html

# Cart Customization

Cart Customization feature is recommended if the cart is subject to dynamic quantity changes and additional details collection through custom fields. It offers complete JavaScript to add or remove plan, addons & coupons and update its quantity.

Again, the difference here is subtle. You need to set the flag isItemsModel = true in Product Catalog 2.0. This attribute need not be used while on Product Catalog 1.0.

Further, you can get the required values of Plan Price Point ID, Addon Price Point ID and many more from Chargebee, and use them as inputs while opening the checkout window.

# See also:

Cart Customization JS Reference

  • html