# Customer accounts

> The login, register, account, order, address, activation and password reset pages – used by stores with classic customer accounts.

Tally theme documentation · HTML version: https://themelab.page/tally/docs/sections/customer-accounts/

## At a glance

- **In the editor:** Login, Register, Account, Order, Addresses, Activate account, Reset password
- **Where it goes:** Its own template – open that kind of page in the editor
- **In the presets:** Every preset: Customer account pages
- **Settings:** 7 on each page
- **App blocks:** No

## Classic or new customer accounts

Shopify offers two kinds of customer accounts, chosen in **Settings › Customer accounts**:

- **New customer accounts** are hosted by Shopify, with one-time codes instead of passwords. The theme's account pages are not used; style the account pages in the checkout and accounts editor. The account link in the header leads there automatically.
- **Classic customer accounts** use the seven pages below, designed by Tally.

## The pages

| Section | Page |
| --- | --- |
| **Login** | Sign in, with a link to reset the password. |
| **Register** | Create an account. |
| **Account** | Order history and the default address. |
| **Order** | One order with its items, totals and status. |
| **Addresses** | Add, edit and remove addresses. |
| **Activate account** | Set a password from an invitation email. |
| **Reset password** | Choose a new password from a reset email. |

Each page has a color scheme, its spacing, and **Hide on mobile** and **Hide on desktop**. Their text comes from the theme's translations.

## All settings

Every setting in the order of the theme editor, with its options and its default value.

### Login

**Section: Login** (7 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 80px |
| **Bottom padding** | 0–160px (step 4) | 80px |
| **Top padding on mobile** | 0–120px (step 4) | 56px |
| **Bottom padding on mobile** | 0–120px (step 4) | 56px |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |

### Register

**Section: Register** (7 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 80px |
| **Bottom padding** | 0–160px (step 4) | 80px |
| **Top padding on mobile** | 0–120px (step 4) | 56px |
| **Bottom padding on mobile** | 0–120px (step 4) | 56px |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |

### Account

**Section: Account** (7 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 80px |
| **Bottom padding** | 0–160px (step 4) | 80px |
| **Top padding on mobile** | 0–120px (step 4) | 56px |
| **Bottom padding on mobile** | 0–120px (step 4) | 56px |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |

### Order

**Section: Order** (7 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 80px |
| **Bottom padding** | 0–160px (step 4) | 80px |
| **Top padding on mobile** | 0–120px (step 4) | 56px |
| **Bottom padding on mobile** | 0–120px (step 4) | 56px |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |

### Addresses

**Section: Addresses** (7 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 80px |
| **Bottom padding** | 0–160px (step 4) | 80px |
| **Top padding on mobile** | 0–120px (step 4) | 56px |
| **Bottom padding on mobile** | 0–120px (step 4) | 56px |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |

### Activate account

**Section: Activate account** (7 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 80px |
| **Bottom padding** | 0–160px (step 4) | 80px |
| **Top padding on mobile** | 0–120px (step 4) | 56px |
| **Bottom padding on mobile** | 0–120px (step 4) | 56px |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |

### Reset password

**Section: Reset password** (7 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 80px |
| **Bottom padding** | 0–160px (step 4) | 80px |
| **Top padding on mobile** | 0–120px (step 4) | 56px |
| **Bottom padding on mobile** | 0–120px (step 4) | 56px |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |

## Related

- [Header](https://themelab.page/tally/docs/sections/header.md): Logo, menu, search, account and cart in three layouts, with a full-width shop panel, a transparent mode and a mobile drawer.