# Customise My Account

URL: https://docs.sparklayer.io/help/customers/account-and-addresses

Customise the SparkLayer My Account area: add custom My Details fields, rename order statuses, control address editing, show tracking and set login redirects.

> **Quick summary**
>
> - The [My Account](https://docs.sparklayer.io/help/storefront/interfaces/my-account.md) is where B2B customers see their details, orders and addresses. This page covers the settings that change what it shows and how it behaves.
> - Address editing is set per customer group, under **Address management** at **Customers > Groups** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/customers/groups)), or **SparkLayer Wholesale > Customers > Customer groups** in the Shopify app. Order tracking details come from your eCommerce platform when you fulfil an order.
> - Most other options, such as custom fields and order status names, are set in your [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting) or, on Shopify, with customer metafields. Your developer or agency usually does these. See [For developers](#for-developers).
> - Available on every plan.

## How it works

My Account brings together a customer's **My Details**, **Recent Activity** (orders, quotes and their statuses), **Shopping Lists**, **Address Book** and, if turned on, **Company Users**. Its data comes from your eCommerce platform. For example, on Shopify, tracking numbers you add when fulfilling an order appear on the customer's order details.

You change My Account in three ways:

| Where | Used for |
| --- | --- |
| The SparkLayer app | [Address editing](#allow-address-editing) per customer group, and [payment status](#show-payment-status) at **Settings > Configurations** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/configuration/settings/general)), or **SparkLayer Wholesale > Settings > Configurations** in the Shopify app. |
| Core Script | [Custom My Details fields](#add-custom-fields-to-my-details), [order status names](#rename-order-statuses), the [shipping address summary](#show-the-shipping-address-on-orders) and the [account redirect](#change-where-customers-go-after-signing-in). See [Frontend integration](https://docs.sparklayer.io/developers/frontend.md). |
| Your platform | [Tracking details](#show-order-tracking-details), [custom order IDs](#show-a-custom-order-id) and [advanced account settings](#advanced-account-settings) such as accounting IDs. |

## Allow address editing

Address editing is on by default. Customers manage their own address book in My Account: they click **Add new address** to add one, or use the icons next to an address to edit or delete it.

To change it, edit the customer group's **Address management** settings at **Customers > Groups** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/customers/groups)), or **SparkLayer Wholesale > Customers > Customer groups** in the Shopify app. You can turn off address editing completely. Or you can stop customers adding and changing billing addresses only, and still let them manage other addresses. See [Allow customers to edit addresses](https://docs.sparklayer.io/help/customers/customer-groups.md#allow-customers-to-edit-addresses).

| Setting in **Address management** | What it does |
| --- | --- |
| **Allow address editing in My Account** | Buyers can add or edit their addresses. |
| **Allow buyers to add and edit billing addresses** | Buyers can set a default billing address. |

## Show order tracking details

Customers see tracking details on an order's details page, including for orders shipped in parts. They see a **Track shipment** link, the carrier and the tracking number.

**Shopify:**

When you fulfil an order in Shopify, enter the **Tracking number** and **Shipping carrier** under **Tracking information (optional)**. A third-party app can do this for you automatically. The details then appear in My Account.

**Other platforms:**

See the [developer docs](https://docs.sparklayer.io/developers.md).

## Show payment status

Alongside the order status, customers can see a **Payment** column showing whether each order is **Paid** or **Unpaid**. It's on by default. Turn it on or off with **Payments visibility** at **Settings > Configurations > Ordering** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/configuration/settings/general)), or **SparkLayer Wholesale > Settings > Configurations > Ordering** in the Shopify app ("Show the payment status of orders in the My Account area."). See [Payment methods](https://docs.sparklayer.io/help/ordering/payment-methods.md).

## Change where customers go after signing in

When a signed-in B2B customer opens your store's own account page (for example `/account`), SparkLayer sends them to the SparkLayer My Account interface. You can send them somewhere else instead, such as a collection page.

**Shopify only:**

On Shopify with customer accounts (new accounts), you can do this without code:

1. In your Shopify admin, go to **Settings > Checkout** ([open in the Shopify admin](https://admin.shopify.com/settings/checkout)).
2. Under **Configurations**, click **Customize**.
3. Go to the **Orders** page, click **Apps** and turn on the **B2B Account Redirect** extension.
4. Optionally, add placeholder text to show customers while they're redirected, and the URL to send them to, such as a collection or landing page.

On any platform, including Shopify with legacy (classic) customer accounts, your developer or agency can add an `accountRedirect` to your [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting) instead.

**Code for your developer**

```javascript title="Core Script"
accountRedirect: {
  urlRegex: /\/account/g,
  goTo: "/index", // page to redirect logged in users to
},
```

**Shopify only:**

**Different pages for different customer groups (Shopify legacy accounts)**

With Shopify's legacy (classic) customer accounts, you can send each customer group to its own page, for example group ABC to `/collections/wholesale-page` and group XYZ to `/collections/wholesale-vip`. Replace the code above with Liquid code like this and change the tags and pages to suit:

```javascript title="Core Script"
accountRedirect: {
  urlRegex: /\/account/g,

  {% assign goTo = "/index" %}
  {% for tag in customer.tags %}
    {% if tag == "b2b-group-1" %}
      {% assign goTo = "/collections/wholesale-page" %}
    {% elsif tag == "b2b-group-2" %}
      {% assign goTo = "/collections/another-wholesale-page" %}
    {% endif %}
  {% endfor %}

  goTo: {{ goTo | json }},
},
```

## Other My Account features

These features also show in My Account, and have their own guides:

| Feature | What it does | See |
| --- | --- | --- |
| Account credit and balances | Shows the customer's credit, balance and payment terms. | [Credit limits and net terms](https://docs.sparklayer.io/help/ordering/credit-net-terms-and-invoicing.md) |
| Timeline and communications | Brings messages, internal notes, order events and email notifications for orders and [quotes](https://docs.sparklayer.io/help/ordering/quoting.md) into one place on the order details page. | [Order timeline and messages](https://docs.sparklayer.io/help/customers/timeline.md) |
| Links straight to an order | Takes a customer straight to an order's or quote's details from a link. | [My Account](https://docs.sparklayer.io/help/storefront/interfaces/my-account.md) |
| Invoices on orders | Attaches invoices, such as PDFs, to a customer's orders. | [Credit limits and net terms](https://docs.sparklayer.io/help/ordering/credit-net-terms-and-invoicing.md) |
| Imported and manual orders | Shows orders created outside the SparkLayer checkout, such as Shopify admin draft orders or imported history, in the customer's order history (Shopify). | [Show imported or manual orders in My Account](https://docs.sparklayer.io/help/guides/show-imported-orders.md) |

## For developers

The settings in this section are made in your SparkLayer [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting), or with metafields (extra fields on a customer or order record in your store). Your developer or agency usually makes them.

### Add custom fields to My Details

The **My Details** section shows the customer's email address, name, company and financial details, such as their account balance and payment terms. You can add your own fields, such as a website, phone number or account manager's email.

Add a `customAccountDetails` list to your [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting). It works like [custom checkout fields](https://docs.sparklayer.io/help/ordering/checkout-fields.md).

```javascript title="Core Script"
customAccountDetails: [
  {
    title: "Website",
    value: "{{ customer.metafields.global.company_website }}",
    type: "website",
    displayText: "Visit Website",
  },
  {
    title: "Phone",
    value: "01234567890",
    type: "phone",
  },
  {
    title: "Email",
    value: "contact@sparklayer.io",
    type: "email",
    displayText: "Click to email",
  },
  {
    title: "Some normal text",
    value: "This is a normal value with no formatting",
  },
],
```

| Key | What it does |
| --- | --- |
| `title` | The label the customer sees, for example "Website". |
| `value` | The value. Set it directly or generate it, for example from a metafield or setting. |
| `type` | Optional. Turns the value into a link: `email` makes a `mailto:` link, `phone` makes a `tel:` link and `website` makes a link to the value. |
| `displayText` | Optional. Text to show instead of the value, for example `displayText: "Click here"` for a link. |

If you use [sales agent ordering](https://docs.sparklayer.io/help/sales-ordering.md), fields based on a customer metafield show the sales agent's value, not the customer's, when an agent is signed in as a customer.

### Rename order statuses

My Account shows each order's status, such as **Processing**, **Shipped**, **Part-Shipped**, **Cancelled** or **Requires Review**. See [My Account](https://docs.sparklayer.io/help/storefront/interfaces/my-account.md) for what each status means.

To change the names, add translations to your [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting) (see [Languages and international](https://docs.sparklayer.io/help/storefront/languages-and-international.md)):

```javascript title="Core Script"
translations: {
  en: {
    "account.order-status.incoming": "Incoming",
    "account.order-status.returned": "Returned",
    "account.order-status.cancelled": "Cancelled",
    "account.order-status.shipped": "Shipped",
    "account.order-status.part_shipped": "Part-shipped",
    "account.order-status.part_returned": "Part-returned",
    "account.order-status.varied": "Varied",
    "account.order-status.processing": "Processing",
    "account.order-status.awaiting_approval": "Requires approval",
    "account.order-status.awaiting_merchant": "Awaiting merchant",
    "account.order-status.archived": "Archived",
  }
},  
```

### Show the shipping address on orders

To show each order's shipping address under it in the order list, add this to the `display` object in your [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting):

```javascript title="Core Script"
display: {
  orderListShowShippingAddress: true,
},
```

### Show a custom order ID

You can replace the order number customers see with your own (a "visible ID"), so order numbers match across your systems.

**Shopify only:**

On Shopify, this is set with a metafield: see [Shopify metafields and data mapping](https://docs.sparklayer.io/help/platforms/shopify/metafields.md).

### Add custom content with slots

Custom slots (or targets) are places in My Account, such as above **Recent Activity**, where you can add your own HTML. See [Custom slots](https://docs.sparklayer.io/help/storefront/interfaces/custom-slots.md).

### Advanced account settings

Customer metafields give you finer control over account and address data, for example when a backend system such as an ERP needs specific customer IDs. Each one uses the namespace `sparklayer` with the key below.

| Setting | Key | Type | What it does |
| --- | --- | --- | --- |
| **Accounting ID** | `accounting_id` | Single line text | A unique account ID for the customer, for example from your ERP or accounts package. When set, it's added to the order's metadata in your eCommerce platform. |
| **Title** | `title` | Single line text | A title for the customer. |
| **Company Name** | `company_name` | Single line text | The customer's company name. |
| **Shipping Address ID** | `shipping_address_id` | Single line text | A unique shipping address ID. When set, it's the customer's default shipping address. |
| **Billing Address ID** | `billing_address_id` | Single line text | A unique billing address ID. When set, it's the customer's default billing address. |
| **Available Shipping Addresses by ID** | `available_shipping_address_ids` | JSON | The shipping addresses the customer can use, by Shopify address ID, as a list. For example `[9840404758756,9840404758756]`. |

To add them on Shopify, go to **Settings > Metafields and metaobjects > Customers** ([open in the Shopify admin](https://admin.shopify.com/settings/custom_data/customer/metafields)), as [Shopify metafields](https://docs.sparklayer.io/help/platforms/shopify/metafields.md) describes. On other platforms, see [Metafields](https://docs.sparklayer.io/developers/data/metafields.md).

**Lots of customers? Fill them in one table (Shopify):** in your Shopify admin, go to **Customers**, tick the customers and click **Edit customers**. Click **Columns**, tick the SparkLayer field under **Metafields**, type the values and click **Save**. See [Shopify's guide](https://help.shopify.com/en/manual/custom-data/metafields/bulk-edit-metafields).

**Build the list of shipping address IDs**

Enter each Shopify address ID the customer can use, and copy the value into **Available Shipping Addresses by ID**:

## FAQs

**Can I stop customers editing their addresses?**

Yes. Turn off address editing in the customer group's **Address management** settings. See [Allow customers to edit addresses](https://docs.sparklayer.io/help/customers/customer-groups.md#allow-customers-to-edit-addresses).

**Why does a sales agent see their own value in a custom field?**

Custom My Details fields based on a customer metafield show the signed-in account's value. When a sales agent acts as a customer, that's the agent's account.

**Where do tracking numbers come from?**

From your eCommerce platform. On Shopify, add them when you fulfil the order.
