How-to show your pricing table with plans on your marketing website

Introduction #

In another how-to, we explained how you can create a pricing table with multiple plans in SaaSBuilder. We also showed how you can enable certain features for certain plans.

The main reason to have your pricing table & plans in SaaSBuilder is to have a single source of truth for your pricing. From here it can be used to show your pricing table:

  1. On your marketing website
  2. In your apps & software

Whenever you change your pricing in SaaSBuilder, it should automatically be reflected everywhere: on your marketing website & inside your apps.

In this how-to, we will illustrate how you can visualize your pricing table in a WordPress website, but the same mechanism (iframe’s) can be used for any other type of website (non-Wordpress).

Before we dive into details, we also want to mention that you could use specific pricing table plugins in WordPress to show your plans. The advantage could be that you have more layout options, but the disadvantage is that you need to maintain your pricing setup on multiple places (no more single source of truth).

Install the WordPress iframe plugin #

We will use an iframe to show your pricing table.

An iframe or inline frame is used to embed another document (your pricing table) within your current web page (being a page of your marketing website).

We will use a WordPress plugin to create the iframe. Therefore install the iframe plugin in your website: 

Configure the iframe #

Next, you need to configure the iframe with a valid URL (the location of your pricing table on the web). Since this URL is project-specific you can request it from our support (in the future you can copy/paste it from the settings page of your SaaSBuilder project).

Basically, the code needed to show your pricing table will look like:

You can change the width and height settings to get the best result on your website.

Other web technologies #

We illustrated the iframe concept for WordPress, but you can do exactly the same for any website framework:

Wix #

Wix Editor: Using iFrames to Display Visible Content on Your Site

Webflow #

How to embed a webpage into webflow page?

Summary #

This how-to illustrated how you can show your prices on your marketing website using iframes.

Powered by BetterDocs

Leave a Reply

Your email address will not be published. Required fields are marked *