Customizing customer accounts pages
You can provide a more personalized customer experience by customizing your store's customer accounts pages. Most customizations are made in the checkout and accounts editor, and apply across your customer account and Sign-in pages.
You can customize your customer accounts in the following ways:
- Apply your store's branding and style to your customer accounts and Sign-in pages.
- Customize where customers are redirected after they sign in.
- Customize your customer accounts menu to give customers easier access to parts of your store and their account.
- Create a subdomain so customer accounts use your store's primary domain.
- Add blocks and pages to customer accounts using apps, to add more features to customer accounts.
- Tailor your customer accounts pages for specific markets and regions.
On this page
Customizing your customer accounts branding and style
You can customize the branding for your customer account pages by editing your shared branding settings in the checkout and accounts editor. Changes that you make to your shared branding settings automatically apply to customer account and sign-in pages as well. For example, if you upload a logo to the shared branding settings, then the logo is displayed on your checkout pages, customer accounts pages, and sign-in page.
You can override some inherited settings from the shared branding on the customer accounts pages and Sign-in page directly to give you more control over your customer accounts pages' style:
- Customize the logo on your customer account pages.
- Customize the colors on your customer account pages.
- Customize your Sign-in page style.
- Customize the Orders page for customers with no orders.
Customize the logo on your customer account pages
If you upload a logo to your main shared branding settings, then the logo is also displayed on your customer accounts and Sign-in pages. You can override the inherited logo image and size on the customer accounts and Sign-in pages page directly.
Steps:
From your Shopify admin, go to Settings > Checkout.
In the Configurations section, click Edit next to the configuration that you want to customize.
In the checkout and accounts editor, select any customer account page that you want to change the logo for from the page selector menu.
Click
and then click Header.
In the Logo section, click the Image field and select a new logo.
Optional: Adjust the size of the logo using the Width slider.
Click Save.
Customize the colors on your customer account pages
If you add a background and accent color to your main shared branding settings, then the colors are also used on your customer accounts and Sign-in pages. You can override the inherited color settings on the customer accounts and Sign-in pages directly. Each page's colors can be overridden independently.
Steps:
From your Shopify admin, go to Settings > Checkout.
In the Configurations section, click Edit next to the configuration that you want to customize.
In the checkout and accounts editor, select any customer account page that you want to change the color settings for from the page selector menu.
Customize the background color of the page header:
- Click
, and then click Header.
- In the Color section, click the Background setting and select a new background color for the header.
- Click
Customize the background or accent color of the page body:
- Click
, and then click Main.
- Click the Background setting and select a new background color for the main page body.
- Click the Accent setting and select a new accent color for the main page body.
- Click
Click Save.
Customize your Sign-in page style
The Sign-in page is a separate landing page for customers to sign in to their accounts in your online store. You can make this page more distinct with your branding by customizing the logo and colors independently of the settings that you choose for your checkout and customer account pages. You can also upload an image to act as a hero image on desktop devices.
Steps:
From your Shopify admin, go to Settings > Checkout.
In the Configurations section, click Edit next to the configuration that you want to customize.
In the checkout and accounts editor, select the Sign in page from the page selector menu.
Click
and then click Main.
You can adjust any of the following style elements of the Sign-in page:
- In the Logo section, upload a new logo in the Image field. You can also manually adjust the logo width.
- In the Color section, use the Background or Accent fields to customize the colors of the Sign-in page.
- In the Media section, use the Image field to upload a hero image for the Sign-in page. This image is displayed only on desktop devices.
Click Save.
Customize the Orders page for customers with no orders
A customer can create an account without ever having placed an order on your store. For signed-in customers with no orders, the Orders page displays a Shop now button that directs to your store's homepage because there's no existing order history to display.
To build interest and prompt customers to explore your products, you can select a collection from your store to display on the Orders customer account page in addition to the default Shop now button.
Steps:
From your Shopify admin, go to Settings > Checkout.
In the Configurations section, click Edit next to the configuration that you want to customize.
In the checkout and accounts editor, select the Orders page from the page selector menu.
Click
, and then click Main.
In the No orders section, configure the empty state:
- Optional: Click Preview to display an empty Orders page in the preview window.
- In the Collection menu, click Select collection.
- Select an existing collection, or click Create collection to create a new collection for the empty state.
Click Save.
Customizing customer account sign-in redirection
You can configure where customers are redirected after they sign in to their account on your store. For example, you might want to redirect customers back to the page they were on when they signed in, or redirect to a specific product collection.
Follow this guide to customize the customer account sign-in redirects.
Customizing your customer accounts menu
The customer account main menu is displayed in the customer account Main section for customers who are signed in. The menu is displayed in different locations depending on the device the customer is using:
- Desktop: The menu is displayed on the left side of the page, arranged vertically. This is optimal for rendering menus with a larger number of menu links, including up to 3 levels of nested navigation options, making it easier for desktop users to scan.
- Mobile: The menu is displayed along the top of the page, arranged horizontally. This makes it easier for customers to switch between pages of their customer account. When the menu has 5 or more items, then a
icon is displayed instead.
A customer account menu is created automatically on your store when you use the latest version of customer accounts, and by default includes a link to your store’s homepage and a link to your customer’s orders. You can replace the default customer-account-main-menu customer account menu with an existing menu, or you can edit the default menu.
Edit your default customer account menu
You can edit your customer account menus from the Content > Menus section in your Shopify admin, or from the checkout and accounts editor.
Consider adding any of the following links to your customer account main menu to give customers easy access to their account-related information:
- Profile: The customer's profile page, where they can manage their personal information, such as name and addresses.
- Apps: App pages associated with the customer's account, such as loyalty rewards and subscription apps.
- Other templates on your online store.
- External links.
URL redirects aren’t supported on customer account menus.
Steps:
In the Shopify admin
- From your Shopify admin, go to Content > Menus.
- In the Menus list, click Customer account main menu.
- Make changes to your customer account menu. Learn more about editing menus and links.
- Click Save.
In the checkout and accounts editor
From your Shopify admin, go to Settings > Checkout.
In the Configurations section, click Edit next to the configuration that you want to customize.
In the checkout and accounts editor, select Orders from the page selector menu.
In the sections sidebar, click Main.
In the Main sidebar, click the Navigation menu, and then click Edit.
In the Edit dialog, make changes to your customer account menu. Learn more about editing menus and links.
Click Save, and then click X to close the menu editor and preview your updated menu.
Create a subdomain for your customer account pages
Your customer account pages use your store's primary domain as their base domain. For example, if your primary domain is your-store.com, then your customer account subdomain is created as account.your-store.com. If you change your primary domain, then your customer account domain updates accordingly. To check or change your primary domain, go to Settings > Domains in your Shopify admin.
You can create a subdomain for customer accounts that uses your online store's primary domain and directs customers to their account pages. The domain name that you create is a subdomain of your primary domain name that you use for your store. The subdomain becomes the primary domain name for all customer account pages, providing a consistent branded experience from sign-in through to account management. For example, if your subdomain is account.your-store.com, then customers will access the sign-in page at account.your-store.com/authentication/login.
Learn more about subdomains for customer accounts pages.
Customize customer accounts with apps
Customizing customer accounts with apps lets you provide customers with a more robust experience on your store. Use apps to add helpful self-service features, such as returns, subscriptions, upsells, reviews, and wishlists, and keep your branding consistent and the sign-in process simple. You can use blocks to add features to existing customer account pages, or add new pages to customer accounts. For example, if you use a wishlist app that supports app pages, then you can add a wishlist page to customer accounts, where customers can manage their wishlists.
You can make the following customizations using the checkout and accounts editor:
- Add blocks to existing customer account pages, such as order page, order summary, and profiles.
- Add new app pages to customer accounts. After you add a new app page to customer accounts, if the app supports direct linking, then you can add it to your customer accounts menu.
Check out the Shopify App Store for a full list of customer account apps. Learn more about customizing your checkout and customer accounts with apps.
Add a page to customer accounts using blocks
Some apps offer blocks that let you add a new page to your customer accounts header. For example, a wishlist app might offer a block that lets you add a new wishlist page to customer accounts.
You can create app pages from the Apps sidebar in the checkout and accounts editor. Some app pages support direct linking, which lets you link the page to your customer accounts menu from the checkout and accounts editor, or from the Menus page in your Shopify admin.
After you add a new page, you can access it from the Added tab of the Apps sidebar, or from the page selector menu in the checkout and accounts editor.
Steps:
From your Shopify admin, go to Settings > Checkout.
In the Configurations section, click Customize next to the checkout configuration that you want to customize.
In the Apps
section, find the app that you want to create a page for.
Click the + icon, and in the Add page to section, click Accounts.
In the Block settings, configure the settings for your app.
Click Save.
Optional: To display the app page to your customers in your customer accounts menu, click Add to menu. In the Customer account main menu dialog, do the following:
- Review the Label and Link that automatically populate from the checkout and account editor. If you want to rename the link, then update the Label field**.
- Optional: Add any other menu items that you want to add to the Customer account main menu.
- Click Save.
Customizing your customer accounts pages for specific markets
You can customize the customer accounts pages for specific markets and regions by using the checkout and accounts editor. This allows you to tailor your customer accounts pages to specific regions, such as including extra account features for customers in your domestic market, or displaying custom messaging regarding shipping delays to customer accounts for an international region.
In addition to market-specific overrides for branding, settings, and blocks, customer account pages also support market-specific overrides for the following customization types:
- Adding or removing full-page extensions, such as a subscriptions management page provided by a third-party app.
- Changing customer account menus, such as changing from the default
customer-account-main-menuapplied to the Header section of customer accounts pages. - Adding or removing order actions, such as a button to request returns.
Learn more about adapting checkout and accounts pages for specific markets.