More Tutorials
Published on

Effortlessly create a no-code SaaS pricing page in Notion

Atomic Pricing
No Code
Checkout
Notion

Introduction

As online businesses continue to thrive, having a seamless and transparent pricing structure becomes paramount. Chargebee, a leading subscription and billing platform, offers an intuitive and robust pricing table that allows businesses to display their service offerings and subscription plans clearly. If you're using Notion, a versatile workspace tool, embedding Chargebee's pricing table can streamline your business management and enhance customer experience. In this blog post, we'll guide you through the steps to embed Chargebee pricing table in Notion effortlessly.

Prerequisites

To follow along with this tutorial, you will need the below steps:

  • An active Chargebee account: Sign up for a Chargebee account if you don't have one already.
  • An Atomic Pricing account. Signup for a an Atomic Pricing account if you don't have one already.
  • A Notion account. Signup here, if you don't have one already.

Building the Pricing Page

Building the Pricing Page is a critical step in presenting your products or services to potential customers in a way that resonates with them and drives conversions. Let's explore the details of this process and discover the key to a successful pricing presentation.

Step 1: Configuring Product Catalog and Plans in Chargebee

In your Chargebee site, you need to create plans and set up the pricing plans that align with your business model. Here's how to create a plan:

  1. Create product families and categorize your plans and addons under these product families.

    1. To create a new product family, follow these steps:

      1. Click Product Catalog > Product Families > + Create Product Family.

      2. In the Create a Product Family page, enter the product family name, description, and modify the product family id(if required).

      3. Click Create

  2. Creating a Plan. To create a new plan on your Chargebee site, follow these steps:

    1. Click Product Catalog > Plans > + Create Plan.

    2. In the Create a New Plan page, click the Product Family dropdown and select the product family to which you want to associate the plan.

  3. Save the plan.

  4. Fill in the details for your plan, such as plan name, pricing, billing frequency, etc.

Chargebee Pricing Page
Chargebee Pricing Page

Step 2: Obtain the Atomic Pricing Embed Code

Once you've successfully configured your pricing plans, it's time to proceed to Atomic Pricing.

Follow the steps below to obtain the Embed code from Atomic Pricing.

  1. Log in to Atomic Pricing.
  2. Click Add new connection.
  3. Enter your Chargebee domain and Full-Access API key.
    Atomic Pricing Connection
    Atomic Pricing Connection
  4. Click Create new site. Your product catalog information from Chargebee will be pulled into the Atomic Pricing dashboard.
  5. Customize the table based on your preferences, such as the theme, order of the plans, features, etc.
  6. Click Publish changes once you are satisfied with the customization.
  7. Click Embed/Copy Pricing Page to get the pricing page URL.
    Atomic Pricing Customizations
    Atomic Pricing Customizations
  8. Finally, click Copy URL to complete the process.

Example: No code Pricing page url

https://hosted.atomicpricing.com/sites/01GV57EG6A1V28QR8KYBK8FE3J/pricing/default

Step 3: Open Notion and Create a New Page

Enhance your Notion workspace by embedding the Chargebee pricing table in just a few simple steps:

  1. Log in to your Notion workspace.
  2. Create a new page where you'd like to embed the Chargebee pricing table.
  3. Name the page accordingly to indicate that it contains the pricing information.
  4. Proceed to embed the Chargebee pricing table on the newly created page.

Step 4: Add an Embed Block

Here are the steps to embed external content in Notion:

  1. Within the page, click the + icon to add a new block.
  2. Search for Embed in the block options.
  3. Click Embed to insert the block into your page.
  4. Once the "Embed" block is added, you'll see an empty field.
  5. Paste the embedded link into the empty field.

Step 5: Optional Adjust the Embed Settings

Notion allows you to customize the appearance and size of embedded content.

  1. Click on the three dots located in the upper right corner of the "Embed" block.
  2. Access the settings by clicking on the three dots. In the settings, you can adjust the width, height, and visibility options according to your preferences.
  3. Customize the pricing table to match your Notion page's aesthetics, as mentioned earlier.

Step 6: Save and Preview

Now, save your Notion page. You can preview it to see how the pricing table looks and functions within your workspace by publishing the page.

Notion Page
Notion Page

Benefits of Embedding Chargebee Pricing Table in Notion

  • Seamless Business Management: By integrating Chargebee pricing table into Notion, you can manage your subscription plans and pricing details from a centralized location. This simplifies the process of updating and modifying your offerings as your business evolves.

  • Enhanced Customer Experience: Transparent pricing table help your customers understand the value of your services and make informed decisions. With Chargebee's professional and attractive pricing presentation, you can build trust and credibility with your audience. You can also run pricing & package experiments for targetted specific customer segments. with ease.

  • Real-time Updates: Any changes made in your Chargebee account will automatically reflect in the embedded pricing table on your Notion page. This ensures that your customers always have access to the most up-to-date information.

Integrating Chargebee no-code pricing table into your Notion workspace is a smart move to streamline your business management and provide a clear overview of your subscription plans and pricing options. By following the steps outlined in this blog post, you can embed the pricing table easily and efficiently. Embrace the power of Chargebee and Notion to simplify your business operations and create a delightful experience for your customers. Happy embedding!

Was this tutorial helpful ?
Need more help?

We're always happy to help you with any questions you might have!

support@chargebee.com