Quick Pricing Table Element Tips (+ New Templates)

Author
David Gavrilut   47

By now, you have probably heard about the Pricing Table element in Thrive Architect. If so, I'm here to give you some good news: We have added a bunch of new templates that come straight from our design team! 

In this article we're going to have a look at what makes the new templates so special and we'll reveal a few important tips regarding the Pricing Table element.

For the full experience, don't forget to check out the video at the top of the page.

More...

Not Just a Few Simple Templates

As I've said before, we've now added more than 10 new templates for the Pricing Table element.

But there is more to these templates than just their cool looks...

As you know, Thrive Architect comes with over 250  landing pages. Each Pricing Table template matches a certain Thrive Architect landing page.

This means that, for each Thrive Architect sales page template there is now a specific Pricing Table template that shares its exact design language: Same font, same color scheme, same vibe etc.

Let me give you an example: Open up a page with Thrive Architect and load up one of the sales page templates:

Choose a sales landing page

Once the landing page is loaded, go ahead and drag the Pricing Table element on the page and select the "Change Template" option: 

Change the template of the Pricing Table element

Now, look for the template that has the exact name as the landing page, in this case, "I Can't Believe it's Not PS":

Look for the template that has the exact name as the landing page

And, just like that, you have a Pricing table template that matches your landing page:

You now have a Pricing Table template that matches your landing page!

More Pricing Table Tips

Once your Pricing Table is in place, you need to learn how to make the most out of it, in Thrive Architect. 

The "Instance" Option

You have probably noticed the two buttons placed on top of the Pricing Table template above: 

The "Instance" option is given by the buttons placed on top of the Pricing Table

These buttons allow you to display multiple instances for your Pricing Table.

For example, if your products can be bought both through a monthly payment or a yearly payment, you can create two separate instances for this: 

Display Monthly and Yearly prices for your products

To select the instance, you need to select the Pricing Table (you can do this easily in the breadcrumbs), go on the sidebar and choose one of the instances:

Go on the sidebar and choose one of the instances

When a certain instance is selected, the changes that you bring to the Pricing Table will only apply to that instance. This will make the Pricing Table different from one instance to another. 

If you don't need multiple instances, simply delete the second instance from the template and the buttons will be removed too.

You're Not Limited to 3-Column Pricing Tables 

The default layout of the Pricing Table consists of 3 columns. (If you want to know why, you can check out this article on How to Build Pricing Tables That Look Good and Win Customers)

However, you can change that very easily and have a Pricing Table with 2, 4 or more columns. 

To set this up, you need to look for the "Price Boxes" section on the sidebar. As you can see, in our case, "Basic", "Fulltime" and "Private" are the names of the 3 columns:

Go on the sidebar to manage the Price Boxes (columns)

Then, if you want a 2-column layout, you can remove the Price Box that you no longer need.

On the other hand, if you want an extra column you can use the "Add New" button, or... If you don't want to build the new column from scratch you can use the "Duplicate" icon from another box.

One More Thing...

We're also planning on making a "Pricing Table from Scratch" video, where we will use Thrive Architect to create an entire Pricing Table from scratch to show you some cool design tricks.

Here's where we need your help...

Below, you can find 3 Pricing Table examples. Let us know in the comment section which one of these you would like to see us build with Thrive Architect:

Example A

Example B

Example C

Don't forget to vote with a thumbs up in the comments below! 

by David Gavrilut  August 14, 2018

47

Enjoyed this article ?

You might also like:

Leave a Comment

    • It would be nice if you also add the pricing tables with less votes as templates .
      Also it would be nice if you add the templates you created in a separate landing page several months ago ¿.remember Hanne ?

  • Excellent! Just wondering will they have in the future Pricing Tables specifically for the SQUARED theme. Didn’t see any in the templates. Thanks again.

  • Todas tienen excelentes diseños, pero me gustaría que construyan la A, porque permite personalizar con imágenes. Pero tengo la pregunta que como va con imágenes será que se hace mas pesada la web, en ese caso optaría por la C:

  • Would you consider creating a pricing table with a home decor theme? Love all of your products btw. Thanks for consistently adding new ones.

    • We could definitely put that on the map 🙂 Until then, you can experiment with the Pricing Table element and maybe come up with a really cool build!

    • Hi Marjolein,
      That’s right, we focused on the landing pages that have sales pages to add pricing tables first 🙂
      But it’s good to know you’re looking for this.

  • Thanks for the new ideas and application examples with price lists. I have just created my own price list for a donation project. Everyone can immediately see how many times a product has been taken.

  • Great article! Thanks for sharing such an awesome feature!

    Is there any way to re-order the pricing buckets based on what device someone is viewing from?

    Often on the desktop version I want the top choice in the middle because someone can see all 3 at once. But on mobile I don’t want the top choice to show up second as someone scrolls because it just seems illogical, the top choice should show up first.

    I’ve temporarily duplicated the pricing table and in the second table re-ordered the options. Then I’ve used the responsive function to make the table switch out based on the device. But this seems inefficient as the user downloads everything twice (I think?).

    Please advise!

    • Thanks for the comment, Craig!

      You did the right thing duplicating the pricing table and then using the Responsive option. Now, as far as downloads and loading speed is concerned, it depends.

      You might try to load the page on your phone and see if it takes too long for it to load. Although it shouldn’t take too long. Normally, it only takes too long if you have lots of content on the pricing table, images, animations and stuff like that.

      If you need any futher help with this, you can open a support ticket and send us the page where the pricing table is placed, so that we can also test how it behaves both on mobile and desktop 🙂

  • I have installed the Consultant Smart Confirmation with up sell. I can’t use the tables, there are not the options that you are showing here to edit the instances. I would appreciate your help understanding how to change the instances in these templates.

    • Hi Crystall,

      I’m not entirely sure where you’re getting stuck, but here’s how to change the instances: https://cl.ly/928bdc1d7492

      1. Make sure you have the pricing table element selected (this will bring up the options)
      2+3. In main options you’ll see the different instances

      All the other things can be changed by simply clicking on the element and changing it.

      Eg. If you want to change the price, click on the price and the text element will be selected so you can put in your own price.

      Hope this helps

  • {"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
    >