Your prices are probably somewhere already: in a PDF you email out, a paragraph on the services page, or only in your head and on quotes. You want a clear section on the website where someone can compare options at a glance, without it breaking on a phone or showing last year’s figures.
There are three practical ways to add a pricing table in WordPress: plan cards built with Columns, a plain price list in the Table block, or a ready-made pricing element from a plugin or page builder. None of them is difficult to build. Deciding what to show, and keeping it correct after your next price change, takes more thought.
First, decide what kind of pricing you are showing
“Pricing table” means different things to different businesses, and the right layout follows from what you sell.
| What you sell | Layout that fits |
|---|---|
| Two to four packages or plans | Plan cards side by side, each with a short list of what is included and a button |
| Many individual items or services | A price list: one row per item, built with the Table block |
| Work you quote for each job | “From” prices with a line on what changes the price, plus a quote button |
| Plans with many features to compare | A comparison table with plans as columns and features as rows |
If your honest answer is “it depends”, do not force your services into three neat plans. A short explanation of what affects the price, with typical starting points, is more useful than packages nobody actually buys.
How to add a pricing table in WordPress with Columns
Plan cards are the classic pricing section. You can build them from core blocks in a few minutes.
- Open the page in the block editor and add a Columns block. Choose the layout with the number of columns you need, usually two or three.
- In each column, add a Heading for the plan name, such as “Basic” or “Standard”.
- Below it, add a Paragraph with the price and what it covers, for example “[amount] per month, plus GST”. Make the price stand out with bold text or a larger font size from the sidebar.
- Add a List block for what is included. Keep each item short, and keep the lists in the same order across plans so people can compare line by line.
- Finish each column with a Buttons block linking to your contact, booking or checkout page. Our post on adding a button in WordPress covers the link and style settings.
- Select each Column (not the whole Columns block) and give it a background colour and padding in the sidebar, so each plan reads as a separate card.
- If one plan is the one most people choose, give it a different background or a small label above the heading. Only do this if it is true.
Lists of different lengths leave the buttons at different heights. The neatest fix is to keep the lists similar in length. If that is not possible, accept the uneven look rather than padding a list with filler items.
A price list with the Table block
For a salon, a repair shop or anyone with a long menu of services, a simple two- or three-column table is clearer than cards.
- Add a Table block and choose the number of columns and rows. You can add or remove rows later from the block toolbar.
- In the block settings, turn on the header section and label the columns, for example “Service”, “Time” and “Price”.
- Fill in the rows. If you are copying from a spreadsheet, pasting a selection of cells into the first cell usually fills the table, but check every row afterwards.
- Split a long list into several smaller tables under subheadings (“Cuts”, “Colour”, “Treatments”) rather than one table of fifty rows.
More on header rows, captions and pasting data is in our guide to the WordPress Table block.
Pricing blocks from plugins and builders
Many block collections and page builders include a pricing table or price list element with built-in spaces for the plan name, price, features and button. What is available depends on the builder and the version you have, so look through its element list before installing anything. These elements save some layout work and can look more polished out of the box.
They are worth it if you already use that builder or block plugin elsewhere on the site. They are rarely worth installing on their own for a single section, because the core blocks above do the same job and you avoid one more plugin to update. If you do use one, check how it behaves on a phone before you publish; some pricing elements were clearly designed for wide screens only.
Keep every price in one place
Layout problems are easy to spot. The old figure that survives on one page after you changed it on another is not, and a visitor who finds two prices for the same thing will trust neither.
- Use a synced pattern. If the same pricing section appears on several pages, build it once, select it, and create a synced pattern from the block options menu. Edit the pattern and every copy updates.
- Do not put prices in images. A graphic with prices is easy to forget and cannot be searched when you update. It is also unreadable to screen readers.
- Search before and after a price change. Use the search box on the Pages and Posts screens in the dashboard to look for the old figure, and check FAQs, blog posts and popups too.
- Remember the places outside WordPress. Your Google Business Profile, ads, PDFs and social posts may show prices as well.
Making it work on a phone
Columns stack on small screens by default, so three plans become one long scroll. That is fine, but it changes how people compare. A few checks help:
- Preview the page in the editor’s mobile view, then on a real phone.
- Keep the plan name and price at the top of each card, so someone scrolling can tell where one plan ends and the next begins.
- For a wide comparison table, see whether your theme lets it scroll sideways or squeezes the columns. If it squeezes them until the text breaks, split it into one short table per plan.
- Make sure each button is large enough to tap and that the text on coloured backgrounds is still readable outdoors.
The Columns block has a “Stack on mobile” setting, which is on by default. Leave it on for pricing; side-by-side cards on a phone are too narrow to read.
Wording that avoids awkward conversations
- Say whether tax is included. “Plus GST” or “including VAT” next to the price stops a surprise later.
- Show the currency. If you serve customers abroad, say which currency the price is in.
- Explain “from” prices. A starting price without a line on what moves it up feels like a trick.
- Date-limited offers need a real end date. If you show a discount, remove it when it ends.
- Keep the small print short and on the page. If there is a minimum term or setup fee, show it near the price, not only in your terms.
Whether a pricing section needs a plugin at all is the kind of call our guide on what to add to a WordPress site and how helps with. If you are newer to looking after a site, the beginner’s guide to running WordPress covers the routine around it.
Frequently asked questions
Should I show prices on my website at all?
Many visitors want at least a rough idea of cost before they contact you, and some will leave if they find nothing. If every job is different, starting prices with a short note on what changes them still help. You know your market best, but hiding all prices usually means more enquiries that do not fit.
Can I add a monthly and yearly price switch to my pricing table?
Core blocks cannot switch prices with a toggle on their own. Some pricing blocks in page builders and block plugins include this. A simpler option is to show both prices on each card, such as the monthly figure with the yearly total underneath, which also avoids hiding information behind a click.
How do I highlight one plan without misleading people?
Give it a different background colour or a short label such as the plan most customers choose, but only if that is true. Do not mark a plan as popular just because it earns you more. A plain highlight with an honest reason is enough to guide the eye.
My pricing columns look different in the editor and on the live page. Why?
The editor and the front end can load slightly different styles, especially with classic themes or when a caching or optimisation plugin changes the CSS. Always judge from the preview or the live page. If the live page looks wrong after you clear the cache, the theme may be overriding the block styles.
Core blocks will take most pricing sections a long way. When you want the cards to follow your brand more closely than the theme’s own styles allow, that becomes styling work, which is what our WordPress theme customization service covers.
Next in this series: How to Add an Events Calendar in WordPress
