> ## Documentation Index
> Fetch the complete documentation index at: https://docs.digifist.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Account Dashboard

> Customer account dashboard template displaying order history and account information

The Main Account template creates the customer account dashboard page where logged-in customers can view their order history, manage account details, and access account-specific features. This primary landing page after login serves as the central hub for customer self-service, rendering order history, customer information, and account navigation automatically. Use this template to provide customers with easy access to their purchase history and account management tools, reducing support inquiries and improving customer satisfaction.

***

## Template Purpose

The account dashboard serves as the central hub for customer self-service:

<CardGroup cols={2}>
  <Card title="Order History" icon="clock-rotate-left">
    Displays past orders with clickable links to view order details
  </Card>

  <Card title="Account Details" icon="user-circle">
    Shows customer name, email, and default address information
  </Card>

  <Card title="Address Management" icon="location-dot">
    Provides quick access to address book management page
  </Card>

  <Card title="Account Actions" icon="gear">
    Links to view/edit addresses and logout functionality
  </Card>
</CardGroup>

***

## Template Settings

The Main Account template provides minimal customization, focusing on section-level styling:

<AccordionGroup>
  <Accordion title="Section Width" icon="left-right">
    * **Page Width** (default) - Contained within page margins
    * **Fluid Width** - Extends to container edges

    <Note>
      Full width is not available for account pages to maintain comfortable reading width for text-heavy content.
    </Note>
  </Accordion>

  <Accordion title="Color Scheme" icon="palette">
    * Select from available theme color schemes
    * **Default:** scheme-1

    <Tip>
      Use a consistent color scheme across all account templates (account, addresses, order, login, register) for cohesive user experience.
    </Tip>
  </Accordion>

  <Accordion title="Spacing" icon="arrows-up-down">
    * **Top Spacing**: 0, 1, 2 (default), 4, or 6
    * **Bottom Spacing**: 0, 1, 2 (default), 4, or 6
  </Accordion>

  <Accordion title="Borders" icon="border-top-left">
    * **None** (default)
    * **Top Border**
    * **Bottom Border**
    * **Both Borders**
  </Accordion>
</AccordionGroup>

***

## Account Dashboard Content

While the template itself has limited settings, the `account-dashboard` snippet automatically displays:

### Order History Section

<AccordionGroup>
  <Accordion title="Order List" icon="list">
    * Displays all customer orders from newest to oldest
    * Each order shows: order number, date, payment status, fulfillment status, total
    * Click any order to view full order details
    * Automatically handles pagination for customers with many orders
  </Accordion>

  <Accordion title="Order Status Indicators" icon="circle-info">
    Visual indicators for order states:

    * **Paid/Unpaid** - Payment status
    * **Fulfilled/Unfulfilled/Partially Fulfilled** - Shipping status
    * **Canceled** - Canceled orders
    * **Refunded** - Fully or partially refunded orders
  </Accordion>

  <Accordion title="Empty State" icon="box-open">
    When customer has no orders:

    * Displays friendly message
    * Suggests browsing collections or continuing shopping
    * Provides CTA button to product pages
  </Accordion>
</AccordionGroup>

### Account Information Section

<AccordionGroup>
  <Accordion title="Customer Details" icon="id-card">
    * Customer name
    * Email address
    * Account creation date (if theme displays it)
  </Accordion>

  <Accordion title="Default Address" icon="house">
    * Default billing/shipping address
    * Link to "View addresses" page
    * Quick access to manage address book
  </Accordion>

  <Accordion title="Account Actions" icon="sliders">
    * **View Addresses** - Navigate to address management
    * **Logout** - Sign out of customer account
  </Accordion>
</AccordionGroup>

***

## Customer Access Requirements

<Warning>
  The Main Account template is only accessible to **logged-in customers**. Visitors who are not logged in will be redirected to the login page.
</Warning>

**Customer Login States:**

| Customer State | Access  | Result                                  |
| -------------- | ------- | --------------------------------------- |
| Logged In      | Granted | Views account dashboard                 |
| Not Logged In  | Denied  | Redirected to `/account/login`          |
| Guest Checkout | Denied  | Redirected to login (no account exists) |

***

## Best practices

<CardGroup cols={2}>
  <Card title="Design consistency" icon="palette">
    Use the same color scheme across all account templates and match spacing values on account, addresses, order, login, and register templates. Maintain consistent header and footer across account pages and ensure navigation breadcrumbs or back links are available.
  </Card>

  <Card title="User experience" icon="user">
    Keep account pages simple and scannable with clearly labeled order history. Make "View Order" links obvious and clickable, provide clear logout button placement, and display empty state messages encouragingly rather than critically.
  </Card>

  <Card title="Mobile optimization" icon="mobile-screen">
    Test account dashboard on mobile devices to ensure order tables are readable on small screens. Verify CTA buttons have adequate touch targets and check that long order numbers don't break layout.
  </Card>

  <Card title="Performance" icon="gauge-high">
    Account dashboard loads customer-specific data dynamically, and Shopify handles pagination automatically for customers with 100+ orders. Keep additional sections minimal and avoid heavy media to maintain fast load times.
  </Card>
</CardGroup>

***

## Extending the Account Dashboard

While the core template is simple, you can enhance the account experience:

<CardGroup cols={2}>
  <Card title="Welcome Message" icon="hand-wave">
    Add a Rich Text section above with personalized greeting using liquid: "Welcome back, \{\{ customer.first\_name }}!"
  </Card>

  <Card title="Account Benefits" icon="star">
    Include Trust Indicators section highlighting loyalty program benefits or member perks
  </Card>

  <Card title="Recommended Products" icon="lightbulb">
    Add Product Recommendations section below showing personalized suggestions based on order history
  </Card>

  <Card title="Help Resources" icon="circle-question">
    Include FAQ Tile or Accordions section with common account questions
  </Card>
</CardGroup>

<Tip>
  Add sections to the account template in the Theme Customizer (Online Store → Themes → Customize → Customers → Account). Sections appear above or below the main account dashboard.
</Tip>

***

## Related Templates

<CardGroup cols={2}>
  <Card title="Main Addresses" icon="location-dot">
    Address book management page where customers add, edit, and delete shipping addresses
  </Card>

  <Card title="Main Order" icon="receipt">
    Individual order details page showing line items, shipping, and tracking information
  </Card>

  <Card title="Main Login" icon="right-to-bracket">
    Customer login form where users authenticate to access account dashboard
  </Card>

  <Card title="Main Register" icon="user-plus">
    New account creation form for first-time customers
  </Card>
</CardGroup>

***

## Common Customizations

### Adding a Welcome Section

Edit the account template to add a personalized welcome message:

1. Navigate to **Online Store → Themes → Customize**
2. Select **Customers → Account** from template dropdown
3. Click **Add section** above Main Account
4. Add **Rich Text** section
5. Use liquid to personalize: `Welcome back, {{ customer.first_name }}!`

### Displaying Loyalty Points

If using a loyalty app, many apps provide account page blocks:

1. Check if your loyalty app offers a section or block
2. Add it to the account template
3. Position above or below the main account dashboard

### Custom CSS for Order Table

For advanced styling, theme developers can target the account dashboard CSS classes in theme files.

<Warning>
  Direct theme file editing requires development knowledge. Test changes on a duplicate theme before publishing.
</Warning>

***

## Troubleshooting

<AccordionGroup>
  <Accordion title="Customer Can't Access Account" icon="lock">
    **Possible Causes:**

    * Customer not logged in
    * Customer account disabled
    * Customer trying to access with wrong email

    **Solutions:**

    1. Verify customer is logged in (check for customer object in theme)
    2. Admin: Check Customers page to verify account is active
    3. Reset password if authentication issues
  </Accordion>

  <Accordion title="Orders Not Showing" icon="eye-slash">
    **Possible Causes:**

    * Orders placed as guest (no account at time of purchase)
    * Customer logged into wrong account
    * Recent order not yet synced

    **Note:**
    Only orders placed while logged in OR orders later associated with the account will appear. Guest checkout orders don't automatically link to accounts created afterward.
  </Accordion>

  <Accordion title="Layout Looks Broken" icon="triangle-exclamation">
    **Check:**

    * Section width setting (ensure not conflicting with theme container)
    * Color scheme contrast (text readable on background?)
    * Browser cache (hard refresh: Cmd/Ctrl + Shift + R)
    * Theme updates (verify theme is updated to latest version)
  </Accordion>
</AccordionGroup>

***

## Quick Summary

* **Purpose:** Customer account dashboard landing page
* **Access:** Logged-in customers only
* **Core Content:** Order history, account details, address management links
* **Configuration:** Minimal (section width, color scheme, spacing, borders)
* **Content Source:** Automatic from Shopify customer object via `account-dashboard` snippet
* **Customization:** Add sections above/below for enhanced experience
* **Related Pages:** Addresses, Order, Login, Register templates

<Note>
  The account dashboard is automatically generated from customer data. No manual content entry needed - Shopify handles all order and account information display.
</Note>