> ## Documentation Index
> Fetch the complete documentation index at: https://docs.supercycle.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Membership plans

> Show your membership plans as cards on any page so customers can join

<Info>
  The Membership plans app block needs the [Supercycle Engine app embed](/documentation/setup/theme-setup) turned on in your theme.
</Info>

The Membership plans app block shows your membership plans as cards on the storefront, each with its pricing and an add to cart button. It's how customers join: the block adds the plan to the cart with the attributes Supercycle needs, and the membership activates when the order is paid.

<Warning>
  Customers must join through this block. A plan product bought directly, for example from its product URL, processes as an ordinary order and the membership doesn't activate. Refund the order and send the customer to your membership page.
</Warning>

***

## How it works

The block reads the plan products in a collection you choose and, for each one:

* Shows a card with the plan's price, billing interval, and description
* Adds the plan to the cart with the attributes Supercycle needs
* Connects the customer to Supercycle once the order is paid, so credits and plan management work

After joining, a customer can open any product with the Membership method turned on and rent it with their credits.

***

## Add the block

<Steps>
  <Step title="Create a collection of plan products">
    Create a collection in Shopify and add your membership plan products to it. The collection decides which plans the block shows. See [Plans setup](/documentation/methods/membership/plans-setup#create-a-membership-page).
  </Step>

  <Step title="Open the theme editor">
    On <Icon icon="shopify" iconType="solid" /> **[Themes](https://admin.shopify.com/themes)**, select **Customize** on your theme, then open the page where the plans should appear, or create a new page for them.
  </Step>

  <Step title="Add the block">
    Select **Add section** or **Add block**, then **Supercycle - Membership plans**.
  </Step>

  <Step title="Select the collection">
    In the block settings, select the collection you created.
  </Step>

  <Step title="Save">
    Select **Save**. The plans appear as cards on the page.
  </Step>
</Steps>

***

## Plan descriptions

To describe a plan on its card, open the plan product in <Icon icon="shopify" iconType="solid" /> **[Products](https://admin.shopify.com/products)** and add a description. The block shows it under the plan's name.

***

## Several blocks for different audiences

Add more than one block to show different plans to different audiences. For example, put 3 individual plans in a `Customer plans` collection and 3 business plans in a `Business plans` collection, then add a block for each on the same page or on separate pages. Each block connects to its own collection, so you control which plans appear where.

***

## Messages for existing members

When a logged-in customer already holds a membership, the block can show a note on each plan card before they add another plan to the cart. Set the messages in the theme editor under **Button settings** on the block:

| Setting                          | When it shows                                                 |
| -------------------------------- | ------------------------------------------------------------- |
| **Already on this plan message** | The customer already holds an active membership on this plan. |
| **Already a member message**     | The customer holds active memberships on other plans.         |

The defaults explain that buying the plan adds another membership. Leave either field blank to hide that message.

In **Already a member message**, use `[current_plan_title]` where you want the customer's newest active plan name to appear.

If you use a custom card layout, add `[plan_existing_membership_message]` to the **Template** field to place the note where you want it. When the template doesn't include that placeholder, the message appears below the button on the default layout.

Customers can add only one membership plan to the cart at a time. The add button stays disabled while a plan is already in the cart.

***

## What happens at checkout

<Steps>
  <Step title="Join the plan">
    The customer adds a membership plan to the cart and pays.
  </Step>

  <Step title="Activate the membership">
    Supercycle activates the membership and assigns the plan's credits to the customer.
  </Step>

  <Step title="Browse eligible products">
    The customer sees which products they can rent with their membership.
  </Step>

  <Step title="Add a product to the cart">
    When they add an eligible product, the block shows that it uses membership credits.
  </Step>

  <Step title="Check out">
    At checkout, the credits are deducted from the membership balance.
  </Step>

  <Step title="Return items">
    When items come back, the credits return to the customer's balance for the next rental.
  </Step>

  <Step title="Manage the membership">
    The customer views their credit balance and rentals, and manages the membership, from [customer accounts](/documentation/online-store/portal).
  </Step>
</Steps>

***

## Styling

The block inherits your theme's styles. Adjust it with the block's appearance settings in the theme editor, or override its CSS variables from your theme's stylesheet.