Pricing Block

Display pricing tiers from your space in a responsive card grid layout.

Data Block

Preview

All Pricing Tiers

Showing all tiers with title

Our Pricing

Drop-In

฿500

Perfect for trying out a single class or occasional visits.

Get Started

Monthly

฿3,500

Unlimited access to all group classes. Best value for regular training.

Get Started

Private Session

฿1,500

One-on-one training with our experienced instructors. Personalized attention.

Get Started

Selected Tiers

Only showing specific tiers

Popular Options

Drop-In

฿500

Perfect for trying out a single class or occasional visits.

Get Started

Monthly

฿3,500

Unlimited access to all group classes. Best value for regular training.

Get Started

Properties

Property	Type	Default	Description
title	string	-	Optional heading above pricing
source	'all' | 'selected'	'all'	Show all tiers or selected ones
selectedTierIds	string[]	-	IDs of tiers to show (when source is 'selected')
showFeatures	boolean	true	Show feature list for each tier

Data Dependencies

This block pulls pricing data from your space settings:

interface PricingTier {
  id: string
  name: string
  description: string
  price: number
}

Usage

// Show all pricing tiers
<PricingBlock
  content={{
    title: 'Pricing',
    source: 'all',
  }}
  pricingTiers={pricingData}
/>

Best Practices

• Highlight value - Make the most popular option stand out
• Clear descriptions - Explain what's included in each tier
• Consistent pricing - Use the same currency format throughout