Skip to Content

Pricing Section

The Pricing section displays pricing tiers or product plans in a clean card layout. Perfect for presenting your offers.

Pricing section example

Creating a Pricing Section

  1. Log in to Ghost admin
  2. Go to Pages, click New page
  3. Set the Page title (e.g., โ€œChoose Your Planโ€ or โ€œPricingโ€)
  4. Optionally add an Excerpt for a section description
  5. Add pricing cards to the content (see structure below)
  6. Open the Page settings sidebar
  7. Add these internal tags: #landing, #landing-pricing
  8. Click Publish

Required Tags

Internal TagDescription
#landingRequired for all landing sections
#landing-pricingEnables the pricing cards layout

Column Options

Control how many pricing cards appear per row:

Internal TagColumnsBest For
#landing-columns-22 columnsTwo main plans (e.g., Free/Pro)
#landing-columns-33 columnsThree-tier pricing (most common)
#landing-columns-44 columnsMultiple product tiers

Example: 3-Column Pricing

#landing #landing-pricing #landing-columns-3

Adding Pricing Cards

Add pricing tiers using Product Cards:

  1. Click the + button in the editor
  2. Select Product
  3. Add a Title for the plan name (e.g., โ€œFreeโ€, โ€œProโ€, โ€œEnterpriseโ€)
  4. Add a Description with the price and plan details
  5. Add a Button with a link to the signup/purchase page
  6. Repeat for each pricing tier

Integrating with Ghost Portal

Link your pricing buttons directly to Ghost Portal:

ActionURL
Free signup#/portal/signup/free
Paid signup#/portal/signup
Account login#/portal/signin
Account page#/portal/account

If you use Ghost Members/Portal, these links can open the signup/signin/account flows without needing a dedicated theme page.

Optional Settings

Combine with other settings:

Internal TagEffect
#landing-hide-titleHide the section heading
#landing-container-wideWider pricing layout