Pricing Table

The Pricing Table block creates a pricing grid with optional monthly/yearly toggle and multiple Pricing Plan cards.

What It Includes

• Section title + intro text
• Toggle for Monthly / Yearly (optional)
• Pricing Plan cards (child blocks)

Layout Controls

• Columns: 1–6
• Inner spacing (Top/Bottom): Small / Medium / Large
• Inner spacing (Left/Right): Small / Medium / Large
• Content alignment: Left / Center / Right
• Top margin: Use global / None / Small / Medium / Large
• Bottom margin: Use global / None / Small / Medium / Large

Typography Controls

• Heading tag: H1 / H2 / H3
• Heading size: Theme default, Small → 4XL
• Body size: Theme default, Small → 4XL
• Plan price size: Theme default, Small → 4XL

Toggle Controls

• Show toggle (on/off)
• Monthly label
• Yearly label
• Default billing cycle: Monthly / Yearly

Colour Controls

Section colours

• Heading text
• Body text
• Background

Plan card colours (global)

• Plan background
• Plan title
• Plan body text
• Plan button background
• Plan button text

Toggle colours

• Toggle background
• Toggle button background
• Toggle button text
• Toggle text

Pricing Plan (inside Pricing Table)

Each plan is a Pricing Plan child block.

Plan content

• Title
• Subtitle
• Monthly price
• Yearly price
• Feature list (InnerBlocks)
• CTA text + URL for monthly and yearly
• Optional badge
• Highlight toggle

Plan colors (per‑plan overrides)

• Plan title
• Plan body
• Price text
• Button background
• Button text

Tips

Use Highlight plan for the featured option.

If you want just one pricing mode, disable the toggle and fill only one price.