Tiercraft tutorial

Build a monthly and yearly pricing table with Tiercraft

A billing switch is useful only when the amounts and labels mean what a reader expects. Enter monthly prices and total yearly prices separately, compare the plan details, and test the page you will actually publish.

This walkthrough uses Tiercraft, Nishvault’s free responsive pricing table builder, to create three practice plans and export a working table. It builds a display with your links; it does not collect payments, create subscriptions, or configure a checkout.

Start with a clearly labeled practice table

Open the Tiercraft builder. Its initial Fieldnote example is synthetic. Save any work you want to keep before loading or replacing a project.

In Content & style, set Heading to Practice Workspace plans and Subtitle to A fictional table for testing monthly and yearly displays. Choose USD, Paper theme, cards layout, and Monthly as the default billing period. Leave the comparison table enabled.

The example below is made-up content for learning the builder. These are not Tiercraft charges, an active offer from a company, or recommended prices for your business. Enter only plans, features, and destinations you can accurately describe when making your real table.

1. Enter monthly prices and yearly totals

Under Plans, select each existing plan, edit its name and prices, and choose Apply changes. Use these practice values:

The Yearly field is the amount for the whole year. In this example, Studio should show $24 per month in Monthly mode and $240 per year in Yearly mode. Tiercraft does not infer a yearly price, calculate a discount, or add a savings claim for you.

Zero displays a zero price. Leave a price empty when you want the custom-quote text “Let’s talk” for that period. Do not use an empty field when you mean zero.

Give each plan a short description and a button label that matches its intended destination. The practice anchors above need matching sections on your host page to go anywhere useful. Replace them with working destinations you control before sharing your table. A CTA link alone does not set up an account, payment, or subscription.

2. Make the comparison rows specific

Expand Comparison features. For a compact practice table, keep three rows and remove the unused example rows:

• Active projects: Solo 3, Studio 20, Team 100.
• Collaborators: Solo 1, Studio 5, Team 15.
• Priority support: Solo Not included, Studio Not included, Team Included.

These quantities and support descriptions are fictional too. The words Included and Not included render as readable text alongside decorative icons. Other values remain ordinary text.

You can add, duplicate, remove, or move plans left. Feature values stay attached to their plan IDs when a plan moves. The builder supports one to five plans and one to twelve comparison features. Choose Studio as the recommended plan if you want to practice its visual emphasis; the badge is your selection, not an automatic assessment of value.

3. Apply changes and test both billing periods

Choose Apply changes and read the status line. Invalid values leave the last valid table in place. Fix any error before saving or exporting. Switching plans, saving, copying, and exporting also apply pending form changes first.

In the actual preview, select Yearly and confirm the Studio amount is 240 and Team is 590. Switch back to Monthly and confirm 24 and 59. Changing the preview’s billing switch does not set the exported initial period; use Default billing in the form for that.

Use Desktop/Mobile to inspect the preview at different widths. Cards stack on small screens. A comparison table uses its own labeled horizontal scrolling region, so check the feature labels and prices while scrolling. The width controls are layout aids; also test the final output in the browsers and devices your audience uses.

4. Keep JSON for editing and HTML for presentation

Choose Save JSON to download your editable project. Reopen that exact file with Open JSON and check the heading, plans, prices, features, and default billing period. A browser draft is convenient, but the downloaded project gives you a separate backup. JSON contains all your plan and link content, so share it intentionally.

Export HTML downloads a complete page with its styles and billing behavior. Open that file and repeat the Monthly/Yearly check. A generated HTML page is presentation output; reopen the JSON when you want to change the table in the builder.

5. Place the scoped embed on your own page

Download embed saves the fragment shown in Embed code. Copy embed is another delivery option when your browser permits clipboard writing; verify the actual pasted content before using it. If clipboard access is restricted, the downloadable fragment remains a separate route.

Keep the generated style, section, and following script together in your host page’s custom HTML area. The fragment contains scoped CSS and an instance-local billing script, with no external runtime assets. Your CMS must allow those tags and your existing content-security policy must authorize the code through your site’s reviewed integration process. Tiercraft does not install a native CMS plugin.

The two-component host example demonstrates independent billing switches. After adding your own fragment, test the actual host page for its styles, both billing periods, keyboard focus, narrow layout, and destinations. Review the builder and embedding guide for details.

What stays local and what the hosted pages count

Pricing and project content are edited in your browser. Nishvault’s hosted Tiercraft product page and builder separately send limited anonymous page-view and export events. Their fixed payloads exclude table text, prices, links, projects, filenames, query strings, visitor IDs, and session IDs. The adapter omits cookies and referrers, and browser Do Not Track or Global Privacy Control disables it.

The downloaded builder, standalone HTML, and scoped embeds do not load that hosted adapter. A download request or resolved clipboard-write diagnostic does not establish that someone kept, pasted, or used the output. Anonymous event counts are not unique people, verified visits, or sales.

Use the free tool within its stated scope

The free-product use terms allow personal and commercial use and the sharing, embedding, or sale of outputs you create. Redistribution or resale of the builder/package is restricted. Optional custom integration requires a separately agreed scope; no paid checkout, recurring charge, guaranteed support, or update schedule is included.

Get Tiercraft and its editable example · Inspect the standalone example