> For the complete documentation index, see [llms.txt](https://docs.roadmap.so/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.roadmap.so/subscriptions/storefront-and-accounts/configuring-the-subscription-management-block-new-customer-accounts.md).

# Configuring the Subscription Management block (new customer accounts)

Add and style the Subscription Management block on Shopify's new customer accounts — and understand why styling cascades from your theme rather than from Roadmap.

If your store is on Shopify's new customer accounts, you don't style the customer-side subscription widget from inside Roadmap. You add Roadmap's Subscription Management block to the customer-account template in Shopify's theme editor, and the styling — colors, logo, fonts — cascades from your Customer Accounts theme settings.

This article walks through that setup and what to expect.

If your store is still on legacy Shopify customer accounts, this article doesn't apply — see Configuring the Customer Subscriptions widget (legacy customer accounts) instead.

#### Am I on new customer accounts?

If your store's customer-account URLs look like `shopify.com/<store>/account/...`, you're on new accounts. If they look like `yourstore.com/account/...`, you're on legacy.

You can also check from the Shopify admin: Settings → Customer accounts. The active version is shown at the top.

#### How styling works on new customer accounts

The new accounts experience is rendered by Shopify, not by your theme — there's no Liquid template you can edit. Instead, Shopify gives you a Theme Editor for Customer Accounts where you control branding (logo, colors, footer, background), and any block you add — including Roadmap's Subscription Management block — inherits those settings automatically.

That means:

* You set your logo, accent color, button color, and footer once, in Shopify's Customer Accounts settings.
* The Subscription Management block then renders using those values — no separate Roadmap styling required.
* If you want the customer-account widget to look different, the change happens in the Shopify Theme Editor, not in Roadmap.

#### Adding the Subscription Management block

{% stepper %}
{% step %}
Open the Shopify Theme Editor for Customer Accounts

In Shopify, go to Online Store → Themes → Customize → Customer Accounts.
{% endstep %}

{% step %}
Open the Subscriptions template

In the template picker at the top, choose Subscriptions. You'll see the customer-account preview on the right (with header tabs like Orders, Profile, Subscriptions, etc.) and a sectioned outline on the left (Header / Main / Footer).
{% endstep %}

{% step %}
Add the Subscription Management block to Main

In the left outline, expand Main. Click Add block, then choose Subscription Management from the available blocks. Save.
{% endstep %}

{% step %}
Verify on the storefront

Open your storefront customer account (logged in as a real customer with at least one subscription). Navigate to the Subscriptions tab. The Subscription Management block should render the customer's subscription card(s) using your Customer Accounts theme settings.
{% endstep %}
{% endstepper %}

#### Customer Accounts settings that affect the block

Open the Settings tab in the Shopify Customer Accounts theme editor. The settings that influence how the Subscription Management block looks:

| Setting                                              | Effect on the block                                                                                                       |
| ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
| Header → Logo / Logo alignment / Logo position       | The logo and its placement appear at the top of every customer-account page, including the Subscriptions tab.             |
| Checkout footer → Footer alignment / Footer position | Footer placement applies across all customer-account pages.                                                               |
| Main → Color                                         | Background color for the customer-account form and content area, including the area that contains the subscription cards. |
| Order Summary → Image / Color                        | Background image and color used for customer account pages and the order summary in checkout.                             |
| Color → Accent                                       | The brand accent color used for highlights and emphasis on customer-account pages.                                        |
| Color → Buttons                                      | The button color — applies to the Manage Subscription button on the subscription card.                                    |

These settings are not Roadmap-specific. They apply to all of customer accounts and just so happen to also style anything Roadmap renders inside them.

#### What customers see

A subscription management section under the Subscriptions tab of their customer account, with one card per contract. Each card shows the same data as the legacy widget — status pill, cadence, address, upcoming dates, products, total, and the Manage Subscription button — rendered with your Customer Accounts theme styling.

The actions inside the Manage Subscription dropdown are identical to legacy and to the action list documented in What customers can do from their account page.

#### Why there's no Roadmap-side editor for this

On new customer accounts, Shopify owns the rendering surface. Apps add blocks; Shopify controls how the surrounding chrome and styling is set. Building a separate Roadmap styling editor would create two sources of truth for the same colors and fonts, and the Roadmap layer would never win against Shopify's theme cascade. The cleaner model is to honor the Shopify settings — which is what the Subscription Management block does.

#### Common scenarios

**"My customers see the customer accounts UI but not the subscription card"**

The Subscription Management block isn't added to the Subscriptions template. Open the Shopify Theme Editor, navigate to the Customer Accounts → Subscriptions template, and add the block under Main.

**"I changed my brand color but the Manage Subscription button is still the old color"**

Edit Color → Buttons in the Customer Accounts settings, not in your storefront theme. New accounts use a separate theme settings surface from the rest of your store; updates to one don't reflect in the other.

**"I just migrated from legacy to new accounts and the widget looks different"**

Yes — styling moved from Roadmap to Shopify's theme editor. Your old Customer Subscriptions widget settings in Roadmap no longer apply. Match your old look by replicating colors and fonts in Shopify Customer Accounts → Settings.

**"The empty state says 'No subscriptions found' even though the customer has a subscription"**

The block reads from the customer's logged-in account. If the customer's account doesn't have a subscription contract attached, the empty state is correct. If they should have one, check Subscriptions → Manage Subscriptions in the Roadmap admin, search for the customer's email, and confirm the contract exists and is associated with the right Shopify customer.

#### Related guides

* Configuring the Customer Subscriptions widget (legacy customer accounts)
* Configuring the Product Page subscription widget
* What customers can do from their account page


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.roadmap.so/subscriptions/storefront-and-accounts/configuring-the-subscription-management-block-new-customer-accounts.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.