Customer accounts

Lapels ships every classic customer account page Shopify can render. That covers sign in, password recovery, create account, the account home with order history, the address book, a full order page, account activation, and password reset.

They are styled to match the rest of the theme, with the same fonts, the same ruled register, and the same buttons and fields.

Which account system your store uses, and therefore which of these pages a customer ever sees, is a setting in your Shopify admin rather than in the theme. That distinction runs through this whole page, so it comes first.

Two account systems, and which one you have

Set the system under Settings → Customer accounts in your Shopify admin. Shopify offers two, and they divide the work differently:

Account system	What customers get	What the theme renders
Customer accounts (the current system)	Customers sign in with a one-time code sent to their email. No password. The account area, covering orders, profile and addresses, is hosted by Shopify on its own pages.	The header account control opens Shopify’s sign-in sheet in place. The account pages themselves are Shopify’s, not the theme’s, so Lapels’ account templates are not used.
Classic customer accounts	Customers sign in with an email and a password. The account area is rendered by the theme.	Every page documented below: sign in, register, account home, addresses, order, activate, and reset password.

Lapels supports both, and nothing in the theme needs changing when you switch. Pick the system that suits your store.

Note

On the current system, the pages a signed-in customer lands on are Shopify’s own. Their colors and fonts follow the theme where Shopify allows it, but their layout, their wording, and the fields they show are Shopify’s to change, not the theme’s. If you need the account area to look exactly like the rest of your storefront, classic customer accounts is the system that gives you that.

Customers can also be optional, meaning shoppers may check out as guests. When your checkout allows it, Lapels’ sign-in page adds a Continue as a guest panel below the form, so a shopper who does not want an account is never stuck on one.

The header account control

The person icon in the masthead is Shopify’s own account component, placed by the theme. On the current account system it opens a sign-in or account sheet over the page instead of navigating away. It is anchored top right on desktop, and appears as a bottom sheet on a phone. On classic accounts the same element renders as a plain link to the sign-in page.

It is governed by one setting in the header section:

Setting	What it does	Default
Show the account link	Shows the account control in the masthead. It appears only when your store has customer accounts turned on.	On

The links inside that sheet come from Shopify’s Customer account main menu, which you edit under Content → Menus in your admin. Editing it there is also what keeps the sheet and Shopify’s hosted account pages saying the same thing.

Caution

Turning Show the account link off hides the control everywhere, including on mobile. If your store has accounts enabled, leave it on. A customer with an order to check has no other way in from the storefront.

What you can configure, and what you cannot

The account pages are the one part of Lapels that is not built from sections. That has one consequence worth knowing up front: there is nothing to arrange for them in the theme editor, and an app cannot add a block to them.

What they do inherit, with no setup at all:

• Your fonts, type sizes, letter spacing, and case, from Theme settings → Typography.
• Your page width and page margins, from Theme settings → Layout.
• Your corner radius on buttons, fields, and cards.
• The page bed painted by the first color scheme in Theme settings → Colors.

Every label and every line of the theme’s own copy on these pages is theme text. Change the wording under Online Store → Themes → … → Edit default theme content, and it carries into each of Lapels’ bundled languages the same way the rest of the storefront does. Form validation messages are Shopify’s own and are not edited there. Those include a password that is too short, or an email already on an account.

The password-recovery form and every address form unfold in place. Every form submits, reports its errors, and confirms itself on the page, and every control is reachable and operable by keyboard.

Where each page lives

Page	Default URL	What it does
Sign in	/account/login	Email and password, with password recovery and, where allowed, guest checkout.
Create account	/account/register	First name, last name, email, password.
Account home	/account	Order history and the default address.
Addresses	/account/addresses	The address book: add, edit, delete, set a default.
Order	/account/orders/…	One order in full.
Activate account	from the activation email	Set a password on an invited account, or decline.
Reset password	from the reset email	Set a new password.

Sign in

The sign-in page is an email and password form with a primary Sign in button and a Create an account link beside it.

Forgot your password? below the form unfolds in place. Open it and a second form asks for the email on the account. Submitting it sends a reset link. The page then confirms that a link is on its way, worded so it never reveals whether an email is on an account. It also reopens the disclosure on its own, so the confirmation is where the customer is looking.

When your checkout allows guest checkout, a Continue as a guest panel follows, with its own button.

Sign-in errors are shown in an alert above the form, using Shopify’s own messages.

Create an account

First name, last name, email, and password. First and last name are optional. Email and password are required, and a hint under the password field states the minimum length. Below the button, a link returns customers who already have an account to the sign-in page.

On success Shopify either signs the customer in or sends an activation email, depending on your store settings.

Account home

The signed-in customer’s home. It opens with an Account heading under a small “Your account” label, with the customer’s email address below it. Beside two panels sits a navigation rail, carrying a saved-address count that links to the address book, plus Log out.

Orders is a real table: order number, date, payment status, fulfillment status, and total, with the order number linking to the order page. It paginates at 20 orders per page. On a narrow screen the table scrolls sideways inside its own container rather than breaking the columns apart, so a row stays readable as a row. A customer with no orders sees a single line saying so.

Default address shows the customer’s default shipping address formatted for its own country, with a Manage addresses link under it. With no address saved, it says so instead.

Addresses

The address book lists every saved address as a card, with the default one titled Default and the rest numbered. Each card carries the formatted address, an Edit control that unfolds that address’s own form, and a Delete button. Add an address sits at the top and opens on its own when the book is empty, since adding the first one is the only thing there is to do.

Every form holds the same fields: first and last name, company, two address lines, city, postal code, country or region, province, and phone, plus a Set as the default address checkbox.

The address list paginates at six per page.

Note

The country control is a dropdown and the province is a text field. That pairing is deliberate: a province dropdown that refills itself whenever the country changes can silently drop a value the customer had already saved. A text field keeps what they typed, and the country dropdown opens with their saved country already selected.

Order

One order in full. It opens with the order number and the date it was placed, and a rail beside it holds the payment status and the fulfillment status. A canceled order carries a notice at the top with the date and the reason.

Items is a table of the order’s lines: the item title linking to the product where the product still exists, its SKU, the price, the quantity, and the line total. A fulfilled line adds the date it shipped and, when the carrier provided one, a Track this shipment link. Line-level discounts are named under the item they applied to.

The table’s footer is the money: subtotal, each cart-level discount by name, each shipping line by name, tax, and the total in full currency. Below it, the shipping and billing addresses sit side by side, each formatted for its own country.

Back to account returns to the account home.

Activate account

Reached from the activation email Shopify sends when an account needs activating, such as after you invite a customer. The customer sets a password and confirms it, then chooses either Activate account or Decline the invitation. Both are real submissions, and neither is a dead control. Errors are shown above the form.

Reset password

Reached from the password-reset email raised by the recovery form on the sign-in page. The customer enters a new password, confirms it, and saves. This is the second half of the “forgot password” journey. The first half is the disclosure on the sign-in page.

The gift card page

Separate from customer accounts, and separate from the gift-wrap option in the cart, Lapels styles the page a recipient lands on when they open a gift-card link. It is a full-page template of the theme’s own, with no header, no footer, and kept out of search engines. It carries no settings, so there is nothing to set up and nothing to configure. Issue a gift card in Shopify and the page is there.

The page shows all of the following.

• The current balance, with the original value beside it once part of the card has been spent.
• The gift-card code as plain text, with a one-tap Copy gift card code control.
• A QR code the recipient can scan to redeem in store.
• Any expiry date, or a notice that the card has expired or been disabled.
• A Shop now link.
• A Print button, with a print layout designed for paper.
• An Add to Apple Wallet button, when Shopify supplies a wallet pass.

Everything a recipient needs is plain text, so a card that is printed or forwarded is still redeemable.

The storefront password page

The store-level lock screen shown while your whole storefront is password-protected is a separate template with its own settings, and it has nothing to do with customer accounts. It is documented in 404 & password.

Note

The storefront password is the whole-store lock, set in your admin. A customer’s account password is a different thing entirely, set and reset by the customer through the activate and reset pages above.

Related: 404 & password · Blog & pages · Sections · Lapels support replies within 12 hours.