User Profile

Overview

Displays details of the currently logged-in customer, showing account information like name, email, and profile data. This block provides a read-only view of customer information for use in account dashboards and profile pages.

Requirements

Parent block: None (standalone block)
BigCommerce data: Customer profile data from BigCommerce
Authentication: Customer must be logged in to see data

Configuration

Attributes

settingsId (string) - Settings configuration identifier
- Default: ""

Block Support

HTML editing: Not supported

Usage

Placement

This block can be placed on any page or template where you want to display the logged-in customer’s profile information. It’s commonly used in account dashboards, profile pages, or personalized content areas.

Common Patterns

Account Dashboard Header

[Account Dashboard]
  → User Profile ← (Profile summary)
    Welcome back, John Smith!
    Email: john@example.com
    Customer since: Jan 2026
  Account Menu
  Account Orders
  Account Details

Profile Page

[My Profile Page]
  → User Profile ← (Full profile display)
    Name: John Smith
    Email: john@example.com
    Phone: (555) 123-4567
    Account Status: Active

  [Edit Profile Button] → Links to Account Details block

Personalized Welcome Block

[Homepage - Logged-in View]
  → User Profile ← (Greeting banner)
    Welcome back, John! 👋
    [View My Orders] [My Account]

Block Settings

Configure which customer information to display:

Customer name (first name, last name, or full name)
Email address
Phone number
Account creation date
Customer group or tier
Custom profile fields from BigCommerce

Customization

Add custom CSS to style the profile display:

Profile card layout
Typography and spacing
Color scheme
Responsive design for mobile
Icons or avatars
Status badges

Example CSS targets:

.wp-block-wpe-mustang-user-profile {
  /* Profile container */
}

.user-profile__name {
  /* Customer name */
}

.user-profile__email {
  /* Email display */
}

.user-profile__meta {
  /* Additional info like account age */
}

Technical Details

Interactive Behavior

The block includes a viewScript for client-side interactivity:

Dynamic content updates based on login state
Conditional rendering of profile fields
Integration with customer session management
Real-time reflection of authentication status

CSS Classes

The block includes editor-specific styling (index.css) for the block interface.

Data Source

The User Profile block communicates with BigCommerce’s Customers API to:

Retrieve current customer profile data for the authenticated user
Display customer information (name, email, phone, etc.)
Show read-only profile fields
Reflect customer tier or group status

All customer profile data is managed in BigCommerce. When the block loads:

Customer authentication is verified via WordPress® session
API request is made to BigCommerce for customer profile
Customer data is returned (name, email, phone, etc.)
Data is displayed in WordPress® UI as read-only fields
If customer is not logged in, block shows login prompt or is hidden

Customer information is NOT stored in WordPress® - it’s pulled from BigCommerce in real-time to ensure accuracy.

This block requires an active customer session. When used on a page:

Logged-in customers see their profile information
Anonymous visitors see nothing (block is hidden) OR a login prompt
Configure behavior in block settings:
- Hide completely when logged out
- Show “Please log in” message
- Redirect to login page

Block Context

The User Profile block can:

Stand alone on any page or template
Work alongside other account blocks (Account Details, Orders, Addresses)
Display in headers, sidebars, or page content
Integrate with personalization strategies

Unlike the Account Details block (which allows editing), User Profile is display-only. Direct customers to Account Details for profile updates.

Troubleshooting

Profile not displaying for logged-in customer

Verify the customer is logged in (check session cookie)
Check that BigCommerce API connection is active
Review browser console for API errors
Ensure customer account exists in BigCommerce

Customer data is empty or incomplete

Check that customer profile is complete in BigCommerce admin
Verify API permissions include customer data read access
Review API response for missing fields
Ensure customer record exists in BigCommerce

Profile shows stale or outdated data

Verify caching is not preventing fresh data from loading
Clear any WordPress® or CDN caching
Check that BigCommerce data is current in admin
Review API response timestamps

Profile shows for anonymous visitors

Check block settings for login requirement enforcement
Verify authentication check is working correctly
Review conditional rendering logic
Test in incognito/private browsing mode

Profile displays wrong customer’s data

CRITICAL SECURITY ISSUE - Report immediately
Verify authentication token is being validated correctly
Check that customer ID is properly scoped to authenticated user
Review API request parameters for customer filtering
Test with multiple customer accounts

Block appears but shows loading state indefinitely

Check for JavaScript errors in browser console
Verify API request is completing successfully
Review network requests for failed API calls
Check for timeout or rate limiting issues
Ensure customer session token is valid

Customization styles not applying

Verify CSS selector specificity is sufficient
Check that custom styles are loading after block styles
Review browser inspector for CSS conflicts
Test with browser cache disabled

Account Details - Allows customers to edit their profile information
Account Orders - Displays customer order history
Account Login - Customer authentication form
Account - Parent container for account-related blocks