accountcraft Install free
All articles

AccountCraft Journal

Shopify Account Page Examples: 7 Layouts to Copy in 2026

Seven Shopify account page layouts for New Customer Accounts, with the tiles, fields and consent blocks each one needs, plus design rules from Shopify and Baymard.

14 min read

The best Shopify account pages do one job fast: they let a customer finish a specific task, such as tracking an order, fixing an address or updating a preference, in one or two taps. Below are seven account page layouts you can build on New Customer Accounts, with the tiles each one needs, the Shopify admin steps to set it up, and the design rules from Shopify and Baymard behind each choice.

These are layout patterns, not screenshots of named stores. Each one is built from components that exist in Shopify’s customer account system, so you can reproduce it without touching your theme.

AccountCraft
Build a Shopify Account Page That Fits
Create a tailored Shopify account page with AccountCraft’s no-code Block Builder, adding components such as wishlists and personalized data fields.
Install AccountCraft

TL;DR

  • New Customer Accounts use a single-column, mobile-first layout, so the strongest examples put the most-used action at the top and keep everything else to a few scannable cards.
  • Customers arrive with one goal. Task-oriented pages beat deep menus, according to Baymard’s account dashboard research.
  • Common tiles: order actions, profile fields, saved addresses, wishlist, loyalty status, and a consent or preferences card.
  • You can build every layout below with AccountCraft’s block builder, with no code and no theme edits. The free plan is enough to start.
  • Consent blocks help you collect and record customer choices through Shopify’s privacy APIs. Compliance stays your responsibility.

Table of Contents

What a good Shopify account page looks like now

Shopify refreshed the look of customer accounts in 2026. The updated design uses a single-column layout with mobile-first optimizations, inline navigation for up to four links, and order actions placed at the top of each order summary instead of behind a menu. Branding is applied through the checkout and accounts editor.

That tells you what the default canvas looks like. Your job is to decide what goes on it.

Three principles hold across the good examples:

  1. One task per tile. A card for addresses, a card for communication preferences, a card for the wishlist. Never a card that does three things.
  2. The frequent action sits at the top. Baymard’s research notes that account visitors are rarely browsing. They come to update a card, check a delivery or change a detail. Dashboards work best as a few somewhat long, task-oriented pages, not as deep, multilayered navigation.
  3. Familiar beats clever. Shopify’s UX guidelines for customer accounts ask extensions to stay consistent and avoid unfamiliar patterns, especially when several apps share the same account area.

Where the default accounts stop

Out of the box, New Customer Accounts cover orders, profile and addresses. Apps extend them at defined points: the order index, order status, the profile page, and entirely new pages through full-page extensions. According to Shopify’s developer documentation, that is where order actions, loyalty points, reviews, tracking, wishlists, subscriptions and rewards can live.

Unlike legacy customer accounts, New Customer Accounts are managed independently from your theme. That is why old advice about editing templates/customers in the theme no longer applies to stores that have migrated. If you are still on legacy customer accounts, treat that as a migration task, and read our guide to restoring legacy account features on New Customer Accounts.

Example 1: The order-first dashboard

Best for: stores where most visits are “where is my order?”

Layout:

  • Top: order list with status and the main action (track, reorder, return) on each row.
  • Below: one card with the default shipping address and a link to edit it.
  • Footer card: contact options, such as a text block with your support hours and a button to your help page.

This is the closest to what Shopify’s refreshed design already does, so it is the safest starting point. The order actions belong at the top of each order summary, and Shopify surfaces both native and extension-based actions there. If you add a post-purchase offer or a reorder prompt, keep it to one per order. For ideas on what to show after a purchase, this walkthrough of post-purchase upsell offers covers the logic behind timing and placement.

Build it: keep the default order pages, then add a profile-area page in AccountCraft with a card block for the address summary and a button block for support.

Example 2: The profile-and-preferences page

Best for: stores that collect data for personalization, such as size, skin type, birthday or dietary needs.

Layout:

  • A short banner or text block explaining why you ask (“Tell us your size and we will filter what you see”).
  • An update form block with four to six fields, grouped logically.
  • A single field block for a high-value item, such as birthday, placed on its own so it is easy to find.
  • A privacy consent block at the bottom for marketing preferences.

Shopify’s UX guidance encourages personalization with authenticated data, such as a birthday offer or the customer’s name, as long as privacy is respected. A common mistake is asking for ten fields at once. Ask only what you will use.

The fields that show up most often in popular merchant guides are names, birthday, delivery and billing addresses and email. Those are a sensible baseline. Everything else should earn its place by powering something the customer can see.

How to set up the fields

In AccountCraft, customer fields are bound to customer metafields, so the data stays in Shopify and there is no separate customer database. The steps:

  1. In your Shopify admin, go to Settings > Custom data > Customers and create a metafield definition for each field (for example, preferences.shoe_size, type single line text or integer).
  2. Open AccountCraft from Apps and create a new page.
  3. Add an update form block and choose the metafields it should edit.
  4. Add a single field block for anything you want to isolate, such as a birthday.
  5. Preview on mobile before publishing.

Our step-by-step guide to customizing Shopify accounts walks through the editor in more detail.

Example 3: The garage, the pet shelf or the family list

Best for: stores selling things that attach to something the customer owns: vehicle parts, pet supplies, baby products, gifts for named people.

Layout:

  • Heading text block: “Your pets” or “Your vehicles”.
  • A record list block where each entry holds a few fields (name, type, birth year, size).
  • An “add another” action inside the list.
  • Optional banner that only appears once the list has at least one entry, pointing to relevant products.

This is the pattern that most clearly separates a useful account page from a generic one. A customer who has saved two dogs and a vehicle has given you the information you need to make the next visit relevant, and they can correct it themselves when something changes.

AccountCraft’s repeatable record lists are built for exactly this. Entries are stored in Shopify, so you can use them in segments, flows and storefront personalization the same way you use other customer data.

Example 4: The wishlist-forward account

Best for: fashion, home, gifting and any catalog where people browse now and buy later.

Layout:

  • Top card: wishlist, shown as a visual grid with image, title and a buy button.
  • Second card: recent orders.
  • Third card: profile and sizes.

Shopify lists wishlists among the features that full-page extensions can support. A wishlist gives a customer a reason to sign in even if they usually check out as a guest. We cover that angle in keeping guest checkout while adding no-code wishlists.

AccountCraft includes a built-in wishlist block, so you do not need a separate wishlist app and a separate account page. Put it above the fold on mobile. If it sits below the orders list, many customers will never scroll to it.

Example 5: The B2B or wholesale account

Best for: stores with both retail and wholesale customers.

Layout:

  • A banner shown only to B2B customers with payment terms or a rep contact.
  • A card with company details and a reorder button.
  • A record list for ship-to locations or purchasing contacts.
  • Hidden from retail customers entirely.

The point here is conditional visibility. AccountCraft can show or hide blocks by customer tag, metafield, market, B2B status and account age. One page can therefore serve several audiences without cluttering any of them.

Use the same rule for loyalty tiers. A customer tagged vip sees a banner with their perk. Everyone else sees nothing, not a greyed-out advertisement for a tier they have not reached.

Example 6: The multi-market, multilingual account

Best for: stores selling in more than one country or language.

The layout can stay the same as Example 1 or 2. What changes is the text: headings, field labels, button copy and consent wording should all be translated, and some blocks may only apply to one market. AccountCraft supports translations for block content and conditional rendering by market, so a US customer can see a CCPA-related preferences card while an EU customer sees a different consent block.

For the US side, see our walkthrough of CCPA admin steps using the Customer Privacy API. For EU stores, consent expiry in Shopify explains what Shopify does and does not enforce.

Best for: every store, but especially those selling into the EU, UK or California.

Layout:

  • Text block in plain language: what you collect and why.
  • Privacy consent block for marketing and data processing choices.
  • SMS consent block, separate from email, with clear wording.
  • A button linking to your privacy policy and any data request page.

Shopify provides tools to help you comply with GDPR, including configurable cookie banners under Settings > Customer privacy, and options for data deletion or opt-out. According to Shopify’s GDPR help page, merchants remain responsible for configuring their store to meet the data protection laws that apply to them.

That is the right framing for any consent block, including ours. AccountCraft’s consent blocks help you collect, record and honor customer choices through Shopify’s customer privacy APIs. They do not make a store compliant by themselves, and nothing here is legal advice. Ask your counsel which wording and which records your situation needs. For a practical setup, read adding account consent without code.

Design rules that make any example work

Use the grid Shopify recommends

Shopify’s customer account UX guidance recommends a 12-column grid with set breakpoints: 375 dp for mobile in one column, 750 dp for tablet in one column, and 1000 dp for small laptops in two columns. In practice that means a layout that reads top to bottom on most devices, and only splits into two columns on wider screens. If you are rethinking your whole storefront for small screens, responsive web design guidance is a good companion to this, and our own mobile-friendly account page guide covers the account area specifically.

Account layout columns across three screen breakpoints

Group with cards, not walls of text

The Card component groups related content, such as an address block or subscription details, into a contained surface with consistent padding and borders. Use one card per topic. For arrangements, Shopify’s Grid component handles multi-column matrices, while Stack suits simple horizontal or vertical runs. Default to a vertical stack and use a grid only when two tiles are genuinely equal in weight.

Bring the most-used action to the surface

Designers who have rebuilt retail account areas often make the same point: put loyalty status and a recent-order snapshot on the first screen so customers do not have to dig through menus. It is an opinion from practice, not a rule, but it matches what Baymard’s data says about single-goal visits.

Shopify’s refreshed design allows up to four inline navigation links. Treat that as a design constraint. Orders, Profile, Wishlist and one custom page cover almost every store.

Handle empty states

A new customer will have no orders, no wishlist and no saved pets. Write a one-line empty state with a button, such as “Nothing saved yet. Browse new arrivals.” An empty card with no explanation looks broken.

How to choose your layout

If your customers mostly… Start with Add
Check delivery and reorder Example 1 One reorder or support button
Share preferences or sizes Example 2 Conditional banner by tag
Own something you sell for Example 3 Record list plus product banner
Browse and save Example 4 Wishlist above orders
Buy wholesale Example 5 B2B-only blocks
Shop in several markets Example 6 Translations, market rules
Need clear privacy choices Example 7 Privacy and SMS consent blocks

Most stores combine two. A common pairing is Example 1 for the first screen and Example 7 as a lower card or its own page.

Build any of these in AccountCraft

Build any of these in AccountCraft

AccountCraft is a Shopify app with a visual block builder for New Customer Accounts. It uses official Shopify Customer Account UI Extensions, so you do not edit theme code. The builder has 14 block types: text, banner, button, card, update form, single field, record list, SMS consent, privacy consent, wishlist, image, video, spacer and divider. Conditional rendering works by customer tag, metafield, market, B2B status and account age, and translations are supported.

There is a free plan, and the paid plans (Pro and Plus) are billed through Shopify. Check the Shopify App Store listing for current pricing. You can see how the plans compare on the AccountCraft site, and read the overview of all 14 blocks before you decide which ones you need.

AccountCraft

Ready to try one of the layouts above? Install AccountCraft free from the Shopify App Store, build your first page in the editor, and preview it on mobile before you publish. If you are still on legacy customer accounts, the New Customer Accounts page explains what changes.

Our perspective

Most account pages fail for a simple reason: they were designed around what the merchant wants to show, not what the customer came to do. We build around the opposite idea. The page should be a small set of useful tools, and the customer’s own data should be the engine.

That is why we keep customer data in Shopify. Fields are bound to customer metafields, so what a customer edits on the account page is the same data your flows, segments and storefront already use. There is no second database to sync, and nothing to explain to a customer or an auditor about where their information went.

We also think consent belongs inside the account, where customers already manage their details, and not only in a banner. A privacy or SMS consent block gives people a place to review and change a choice at any time, and gives you a record through Shopify’s privacy APIs. Compliance remains your responsibility, but the tooling should make the right behavior the easy one.

Finally, we believe merchants should not need a developer to change a headline. A visual builder on top of official extensions means a marketer can adjust a page on Tuesday and see it live the same day.

Ivan Signorile

Setup checklist

  1. Confirm you are on New Customer Accounts in your Shopify admin under Settings > Customer accounts. If you are upgrading from legacy customer accounts, review your old customizations first: custom sign-in or registration experiences may need theme edits, and legacy workflow triggers and automations are not supported.
  2. Define customer metafields in Settings > Custom data > Customers for every field you plan to collect.
  3. Pick one layout from this article and sketch the tiles on paper in order of use.
  4. Build the page in AccountCraft, using one card per topic.
  5. Add conditional rules only where a block truly applies to a subset.
  6. Add translations if you sell in more than one language.
  7. Review your privacy settings under Settings > Customer privacy and add consent blocks where customers should be able to change their choices.
  8. Test on a phone, with a customer who has orders and with one who has none.

FAQ

Can I customize Shopify’s account pages without editing my theme?

Yes, on New Customer Accounts. They are managed separately from your theme, so you brand them through the checkout and accounts editor and extend them with apps. AccountCraft adds pages and blocks through official extensions, with no code.

What should an account dashboard include?

Start with orders and their actions, profile details and saved addresses. Then add only what a customer will use: a wishlist, loyalty status, saved items such as pets or vehicles, and a consent card. Baymard’s research suggests keeping it task-oriented rather than burying features in menus.

Shopify’s refreshed customer account design supports inline navigation for up to four links. Orders, Profile, Wishlist and one custom page cover most stores.

No. A consent block helps you collect, record and honor customer choices through Shopify’s privacy APIs, but Shopify itself says merchants are responsible for configuring their store to meet applicable data protection laws. For legal questions, talk to a privacy lawyer.

Is there a free way to try this?

AccountCraft has a free plan, and Pro and Plus are billed through Shopify. Current pricing is on the app’s Shopify App Store listing, and you can install it free to build your first page.

Sources