Generate Pricing Table Section

Create a pricing table with 2-4 tiers, feature lists, highlighted recommended plan, monthly/yearly toggle, and CTA buttons.

View as Markdown

Sidekick writes it — you put it live

Sidekick produces the content or code for this, but doesn't apply it to your store itself. You'll paste or publish the result yourself — the prompt tells Sidekick to explain exactly where it goes.

📋 Prompt

Run in Sidekick

Create a pricing table block:

Layout:

  2-4 pricing tiers side by side
  Highlighted/recommended tier option
  Monthly/yearly toggle (optional)


Each tier includes:

  Plan name
  Price (with currency symbol)
  Price period (per month/year/one-time)
  Feature list (checkmarks/crosses)
  CTA button (customizable text and link)
  “Most Popular” badge option


Settings:

  Number of tiers (2-4)
  Toggle monthly/yearly prices
  Highlight tier index
  Badge text and color
  Background colors (per tier or global)
  Button styles
  Feature comparison rows


Requirements:

  Responsive: stack on mobile, side-by-side on desktop
  Smooth hover effects
  Accessible markup
  Monthly/yearly toggle with smooth price animation


Please generate the Liquid, CSS, and JavaScript for this pricing table as code I can paste into my own theme myself.

Where to add it: In the Shopify admin, go to Online Store > Themes > Edit code, create a new file under Sections (e.g. sections/pricing-table.liquid), and paste the generated code in. Save, then open the theme editor and use “Add section” to place it on the page you want.

How to Use

Copy the prompt above
Open Shopify Sidekick in your Shopify admin
Paste the prompt and replace the bracketed placeholders with your details
Review Sidekick's response and apply the suggestions