Membership Pricing

What this section does

Lists membership tiers with their prices and starts a subscription

Where it goes

• Can be used as many times as you like on one page.
• This section comes with the Membership Tiers & Subscriptions plugin.

Styles

Different looks for the same section. You can change the style later; your content stays as it is.

The first 2 styles of every section are open on every store. The rest unlock with the Page Editor plugin — all at once, not style by style.

• Rows

  Freerows

  One full-width row per tier; use instead of the grid from four tiers up

  Specific to this style: title, subtitle, tierIds, defaultInterval, showIntervalToggle, yearlyBadgeText, cardBg, cardBorderColor, priceColor, benefitIconColor, highlightTierId, highlightBadgeText, highlightColor, ctaText, currentPlanText, ctaBg, ctaTextColor

• Spotlight

  Freespotlight

  The recommended tier large in the middle, the others quiet beside it

  Specific to this style: title, subtitle, tierIds, defaultInterval, showIntervalToggle, yearlyBadgeText, cardBg, cardBorderColor, priceColor, benefitIconColor, highlightTierId, highlightBadgeText, highlightColor, ctaText, currentPlanText, ctaBg, ctaTextColor

• Minimal List

  Page Editorminimal

  A divided list with no card chrome

  Specific to this style: title, subtitle, tierIds, defaultInterval, showIntervalToggle, yearlyBadgeText, cardBg, cardBorderColor, priceColor, benefitIconColor, highlightTierId, highlightBadgeText, highlightColor, ctaText, currentPlanText, ctaBg, ctaTextColor

• Cards

  Page Editorcards

  Side-by-side price cards with tier name, price, benefits and a subscribe button

  Specific to this style: title, subtitle, tierIds, defaultInterval, showIntervalToggle, yearlyBadgeText, cardBg, cardBorderColor, priceColor, benefitIconColor, highlightTierId, highlightBadgeText, highlightColor, ctaText, currentPlanText, ctaBg, ctaTextColor

• Comparison Table

  Page Editorcomparison-table

  Row-by-row benefit comparison; for three or more tiers

  Specific to this style: title, subtitle, tierIds, defaultInterval, showIntervalToggle, yearlyBadgeText, cardBg, cardBorderColor, priceColor, benefitIconColor, highlightTierId, highlightBadgeText, highlightColor, ctaText, currentPlanText, ctaBg, ctaTextColor, rowStripeColor

Settings

The fields you see in the Section Settings panel on the right when this section is selected.

Shared by every style

• bg
• contentMaxWidth
• sectionMaxWidth
• horizontalPadding
• verticalPadding
• verticalAlignment
• horizontalAlignment
• horizontalMargin
• verticalMargin
• spacingOverrides
• animationType
• animationDuration
• animationDelay
• animationEasing
• animationStagger
• animationRepeat
• animationParallax
• imageParallax
• animationScrollEffect
• height