Knowledge center

1. Install Shopify plugin.
2. Copy code snippet in Shopify themes.
3. Setup ChargeBee account & create products in ChargeBee.
4. Copy & paste the Plan URL in the plugin to redirect to checkout page.
5. Complete the other configuration steps in ChargeBee (including hosted checkout page, invoice logo, emails & payment gateway). 
6. Go LIVE.

Shopify App Installation Steps:

In the next step, the list of products available in Shopify are listed with empty text boxes to map ChargeBee plan URL. 

Insert the following code snippet into your Themes, Product code.

Click on "Template Editor" to edit the code.

Look for Product.liquid or the code snippet under which the following code exists ("Add to cart"). Search for "Add to cart" in the code and add the following code snippet, as in the image:

              <!--ChargeBee code snippet - starts-->
              
              {% assign cb = product.metafields.chargebee %}
              {% unless cb == empty %}
              <a href="{{cb.cb_url}}" class="btn">Subscribe</a>	
              {% endunless %}
              
              <!--ChargeBee code snippet - ends-->
              

Here is a quick hack to verify if the integration setup is correct:

Copy the following URL and paste it in the text box, against one of the products in plugin.

https://labs-test.chargebee.com/hosted_pages/plans/m_s_socks 

Save and refresh your website. You should be able to see the Subscribe button as below. Clicking on that should redirect you to a secure URL page that can be customized to look exactly like your website. 

Now let us get started with setting up the ChargeBee Account:

https://www.chargebee.com/trial-signup.html

Complete the email verification and "claim your account" to complete the signup process. You will be redirected to a TEST site to complete the configuration.

Email ChargeBee customer support for completion of setup, with the name of your Shopify & ChargeBee site and we will assist you with the process.

Email: support@chargebee.com

Hi there,

Glad to know your interest in Shopify Integration! 

We have plans to revamp our Shopify integration in the future and I'm tagging this discussion internally to step up the priority for the feature request. While we don't have a firm ETA on this, we'll let you know when this is released.