Embedding Customer Portal

You can Embed our customer portal inside your website or web application easily through embedding an iframe that is rendered on a per customer basis.

If you decide to embed the customer portal, the authentication of the users will be your application/website's responsibility, where you act as the authentication authority that confirms the user's identity.

Customer Portal Features

Customer Portal enables your customers to:

  • View or cancel active subscriptions
  • Manage add-ons
  • Upgrade or downgrade plans
  • View payment history
  • Manage payment methods
  • Manage profile and billing information

Implementation

  • First, you need to get a Server Token.
    The server token should not be leaked to the front-end as it gives full access to your Subsbase account.
  • Second, get a Customer Token.
    The token is returned in the "value" field, token could be used for embedding the customer portal.
  • Once you obtain the customer token, you can insert the token in the following iframe:
<html>
  <iframe
    src="{customerPortalURL}?token={customerToken}&[show|hide]={[paymenthistory,paymentmethods,subscriptions,info]}"
    width="920px"
    height="1200px"
  >
  </iframe>
</html>
  • Where
    • customerPortalURL is your customer portal URL which is provided by Subsbase. Example: https://siteId.customers.subsbase.com. It is found within the Admin Portal in Settings > Customer Portal Settings > Site URL.
    • customerToken is the customer token obtained in the second step.
    • show/hide Optional you can choose either to show or hide certain pages in the embedded customer portal. Can be one or more of the following 'subscriptions','paymentmethods','paymenthistory','info'. If more than one tab is passed, then tab names have to be passed in a comma separated list without spaces. All pages are on by default.
      Example: &hide=paymenthistory,subscriptions or &show=paymentmethods
You have to set the width and the height for the Container Element and the injected iFrame will fill the entire container i.e. the iframe's height and width default to 100%.

Customer Portal Version

(Optional)

You have the option to specify the Customer Portal version you want to use. By including the following, you can choose to use Customer Portal Version 2:

<html>
  <iframe
    src="{customerPortalURL[v2]}?token={customerToken}&[show|hide]={[dashboard,subscriptions,schedules,paymentmethods,paymenthistory,profile]}"
    width="920px"
    height="1200px"
  >
  </iframe>
</html>
  • Where
    • customerPortalURL[v2] is your customer portal URL V2, which is provided by Subsbase. Example: https://customers.subsbase.com/v2/subscriptions. It is found within the Admin Portal in Settings > Customer Portal Settings > Site URL.
      • Ensure that you specify "v2" to use Customer Portal Version 2.
    • customerToken is the customer token obtained in the second step.
    • show/hide Optional you can choose either to show or hide certain pages in the embedded customer portal. Can be one or more of the following 'dashboard','subscriptions','schedules','paymentmethods','paymenthistory','pprofile'. If more than one tab is passed, then tab names have to be passed in a comma separated list without spaces. All pages are on by default.
      Example: &hide=paymenthistory,subscriptions or &show=paymentmethods
You have to set the width and the height for the Container Element and the injected iFrame will fill the entire container i.e. the iframe's height and width default to 100%.
If you do not specify a version, the system will default to Version 1.
Table of Contents