How to Create a Pricing Table for WooCommerce

Right out of the box WooCommerce creates a shop page and displays a grid of products which works quite nicely for stores with dozens of products. But what about the stores that only have one or two products? Or just one product with a couple different levels? Sometimes it's best to have a single page that lays out the pros and cons of each product rather than a grid of products. You can easily add a pricing table to WooCommerce with Easy Pricing Tables freely available on WordPress.org.

Adding a Pricing Table

Adding a New Pricing TableOnce you install the plugin you'll see a new menu item called Pricing Tables. The pricing tables work just like WordPress pages and posts so you can easily add a new one and then add the pricing table content.

Add Your Product Information

Once you've created your table you have to add the features of your product. Add one feature per line and the plugin will format them on the front end. A key to creating good pricing tables is to only show differences between plans. If there are similarities between all plans then it's best to describe that feature in the content above or below the pricing table.Pricing Columns

Add Your Button URL

WooCommerce Product IDWriting the name, pricing, & plan features should be pretty easy since you can copy what you already have on the product page. But the button url is a bit different. The first step is to find the product ID. You can find this on the product page in the url. It will look something like http://mysite.com/?post={number}.

Once you have the product ID you can then make your button URL by adding ?add-to-cart={product-id} to any url in your store. So if your site is patricksawesomeblog.com and your product ID is 101 then your button url would be http://patricksawesomeblog.com?add-to-cart=101.

I would suggest using your cart URL for this. It's a nicer experience to add something to your cart and then be redirected back to the cart rather than stay on that product page.Product Added to Cart

Feature Your Preferred Plan

Featured Pricing ColumnYou want to make things easy for your users right? Then guide them to the option that's best for them. This plugin gives an option to feature one plan. The plugin has prebuilt special styling for the featured plan.

Organize Your Columns

You can add up to 10 columns and drag & drop the columns to organize them any way you want. A good practice is to order them highest to lowest.

Order your pricing plans from left to right by most expensive to least expensive, so that you’ll immediately expose users to the high pricing plans that they would otherwise ignore.
UXMovement

Create a Product Page

Now that we have the table ready to go we need to save it, copy the shortcode, and put it on a page. Create a new page add some content about your plans and then paste the shortcode on the page.

Easy Pricing Table Shortcode Now you can preview the page and see your table. Looks pretty awesome right?

Pricing Tables

Change the Appearance of the Table

The pricing tables look pretty good already but you may want to tweak them to make them match your brand. The awesome news is that all of this is possible via the plugin settings. Just switch to the Design tab and tweak away. There are dozens of settings. In my case I like purple so I wanted to add that in there and I also wanted to change “Most Popular” to “Best Deal”.Pricing Table Design Options

Going the Extra Mile

The pricing table looks pretty great already but we can do a few extra things to make the whole experience even nicer.

Hide the Product on the Shop Page

Hiding the Product from the StoreIf you only have this one product then make sure to hide the shop page. Remove that page from your menus entirely. If you still have other products then you can't hide the shop page but you can still hide the product itself from the shop page. There's Catalog visibility setting in the Publish window on the Edit Page page.

Using Products with Variations

If you want to use a variable product instead of using multiple simple products you'll have to add a little bit extra information to the url. Remi Corson has a great tutorial on adding a variation to the cart.

The Final Product

After all of the installing, writing, creating, and tweaking here's the final product. Pretty awesome.

Pricing Table with Updated Colors (Purple!)

Easy Pricing Tables Pro

If you like the idea of using pricing tables but you want additional styles there's a pro version available with five extra styles and a couple extra really nice features like Google Analytics event tracking.

45 thoughts on “How to Create a Pricing Table for WooCommerce

  1. Very cool tutorial, Patrick! Thanks for sharing 🙂

    I like Easy Pricing Tables as well – I think it’s the best of any free pricing table plugin out there, as I’ve gone through a few. Another interesting read on pricing tables is this case study using the Mad Mimi signup page. Might be something you find interesting: http://copyhackers.com/2014/05/optimized-madmimi-pricing-page/

  2. […] How to Create a Pricing Table for WooCommerce – Another great post from Patrick about how to create cool pricing tables in WooCommerce. This is really cool. Patricks WooCommerce book should be super if this is a sign of things to come. […]

  3. […] However, I’m not going to write up a quick tutorial on this one because Patrick Rauland already did a great job with this. You can read his tutorial here. […]

  4. I have two vendors, and I would like have different Pricing Tables for each vendor.

    I would like see a different table in the page of each vendor. Can I make it?

  5. Hi Patrick,

    I am selling prints of artwork in limited editions of 200. There are 4 options to how the artwork is delivered:

    • Canvas Gallery wrap
    • Canvas Traditional
    • unstretched canvas
    • watercolor paper

    I want the inventory to count against the edition size, but I can’t figure out how to allow these different options in easy pricing tables to do that. No matter which option the collector chooses it is entered into the inventory of that product until the edition sells out.

    Should I inventory the options? Like Gallery Wrap $60, Traditional $40, etc.

    That way I can use only one sku for the image and upsell the options. What are your thought?

  6. After fudging around a few hours, I found out thru attributes and variables you can just have all the variable options access only one sku or have individual skus for each one. So, not assigning skus shows inventory counts in the parent sku regardless of variable. Hope I am making sense!

    • Hey Terry – glad you figured it out! Sounds like you are using a variable product and counting inventory at the product level (and not the variation level). Smart! 🙂

      From the WooCommerce product variation docs:

      If the sku, weight, dimension and stock fields are not set, then it simply inherits the values assigned to the variable product.

      Another solution that’s probably easier is to use WooCommerce Product Add-ons. It’s made for this exact scenario of having a core product and then adding extra costs on top.

  7. I can’t get this to work, it just keeps going back to my front page, on the page it’s inserting a / between my .com and the question mark which is what I assume is doing it., e.g. example.com/?add-to-cart=101

    Any ideas?

    • Hey Jared,

      It looks like your comment didn’t come through quite right. WordPress automatically strips out anything that looks like code. I tried to fix it up a bit. :/

      Having example.com/? vs example.com? doesn’t make a difference. It should work either way. If you manually go to example.com?add-to-cart=101 in your browser what happens?

      • Same issue with me. By any chance can this be a permalink issue ? when i just enter example.com?add-to-cart=101 it redirects to homepage.

      • Similar issue to above on adding multiple instances of the item to the cart.

        I set it up verbatim and it does this:

        #1 – If I have the product set to “Enable this to only allow one of this item to be bought in a single order” in inventory section of product setup, when I click the pricing table button, it gives me the error

        “You cannot add another “Membership Product Name” to your cart.”

        #2 – If a allow multiple instances of the product to be added to the cart, it adds THREE instances of the product to the cart before redirecting.

        UPDATE – tried your suggestion of going directly to the URL in a browser instead of using EPT (an unfortunate acronym) plugin to click the button. So the plugin is somehow submitting the request 3 times to my Woo store.

      • I’m having the same issue with this. All my links that should add the product to the cart and automatically direct to the cart keep directing to the Home page. Have you found a solution?

  8. Great write up. Is there a way this plugin can be integrated with WooCommerce Bookings plugin ?

    • It wouldn’t be quite that easy. You’d have to write some fancy JS to automatically select the right date range and extra fields that Bookings sometimes uses.

      You could create the pricing table that shows the prices but when the user clicks through they’d still have to select a few fields themselves.

  9. I got the same problem like AKramkhan.

    Could you please give support to solve that problem?

    Thank you very much!

  10. Is it possible to use the WooCommerce product attributes to dynamically create the pricing table? That would be much better if the data is already in the product table.

    • Hey Shawn,

      That not possible at the moment. The pricing table input it all manual. I’d reach out to the pricing table developer and see how hard this would be. Maybe it could be an extension to his plugin.

  11. Great tutorial. I am getting 2 products in the cart when I choose a plan. What could be the problem? And the alerts are also showing twice for “product added to cart”.

    • Could be a theme or permalinks issue. Try with TwentyTwelve. If it works normally then it’s your theme. If it’s still broken you could set up a test site and use default permalinks and see if it still happens.

  12. Hi Patrick,

    Great, thanks for the hint on how to make pricing tables for WooCommerce. Now I have the next dilemma:

    How can I incorporate the button to go with WC paid listing ( Wp Job Manager by Mike Jolly )

    • Should be the same process; packages are just a type of product.

      • This will work to add the package to the cart, but you would still be required to select a package in the normal workflow either at the start or end of the listing process.

        Is there a way to use replace the existing workflow packages page with the newly established pricing table? It would seem odd to a user to have to select the package twice.

  13. Very nice tutorial. You explain really well to how to add pricing table for products in website.

  14. I seem to always end up on your blog when I google the issues I’m running into. This is a great tip!

  15. The older versions of the easy pricing tables used to worked with woocommerce shortcodes for displaying pricing and add to cart buttons in the price field but the current version doesn’t support shortcodes. Could this be a bug or removed functionality by the plugin developer

  16. Hello Patrick,

    Facing some issue with Pricing Table and woocommerce.

    My scenario is Lets say I have product Sim card having variable attributes Country : USA , Australia & So on.. and variable attribute Sim type : prepaid, postpaid. now based on user selection lets say country USA and sim type prepaid and based on that it should show pricing Plans.

    Is it possible how can I achive the same ?

    Thanks,
    VIcky

  17. Hi Patrick,
    Thanks for this tutorial, I prefer Arprice Pricing table. Do you think it can work for that plugin?

    Thank you

  18. hello Patrick Rauland!
    I installed pricing table and woocommerce and in the pricing at bottom order now button when we click on order now button then add-to-cart=101 order added in the cart page when we click on order now button then order add and page redirect to home page not on cart page i want that when we click on order now button then order added and open cart page automatically so let me know how to do thanks

    • Copy and paste developer

      Is it possible because you use variable in pricing? For example, annually, monthly pricing. I run into same issue for a product that has different pricing, but it’s working for product that has only one price.

      • copy and paste developer

        Hi, my previous reply was wrong. I think it’s due to you can not add that subscription product twice “if you have a code that disable ‘quantity’ in functions. If you go to /cart/ after getting prompted to homepage, you will see a message that said ‘You can not add xxx product twice’. Ideally I would still want to keep this code because I don’t want user to update quantity to 2 or 3. It would be good anyone has a solution that we can disable quantity and prompt user to /cart/ page so that user see the warning message instead of not getting prompted to /cart/ page.

  19. Very useful information about the pricing list. I have been finding it for a while.

  20. Hi dear,

    Im using another pricing table but with same method for adding products to cart, the issue is when I use the pricing table for with “Woocommerce subscription” extension and after checkout complete the user will have an active subscription but without any privilege, while using the normal store front of woocommerce will give the user the privilege of the selected subscription, do you have any idea why would that happen ?

  21. Copy and paste developer

    Thank you very much. Really appreciate this!

  22. but not work Ajax load function

  23. Hello,

    Is it possible to specify a quantity before adding to cart?

    Just a field with ‘Quantity’ in the table would work?

    Is this an option?

    I was hoping to use it to order variable products, using a custom url – presumably this can link up in that way?

Leave a Reply

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