Configuration

The CrispConfig class is the central configuration object for the Flutter Crisp Chat plugin. It defines your website ID, user details, session settings, and notification preferences.

CrispConfig

CrispConfig config = CrispConfig(
  websiteID: 'YOUR_WEBSITE_ID',       // [required] Your Crisp Website ID
  tokenId: 'unique_user_token',        // [optional] Unique token to identify returning users
  sessionSegment: 'premium',           // [optional] Segment to categorize users
  user: crispUser,                     // [optional] User details (see User & Company)
  enableNotifications: true,           // [optional] Enable push notifications (default: true)
  modalPresentationStyle: ModalPresentationStyle.fullScreen, // [optional] iOS modal style (default: fullScreen)
);

Parameters

Parameter	Type	Required	Default	Description
websiteID	String	Yes	—	Your Crisp Website ID from the dashboard
tokenId	String?	No	null	A unique token to identify returning users across sessions
sessionSegment	String?	No	null	A segment string to categorize users (e.g., "premium", "trial")
user	User?	No	null	User details like email, name, phone, avatar, and company
enableNotifications	bool	No	true	Whether to enable push notifications for this site
modalPresentationStyle	ModalPresentationStyle?	No	fullScreen	iOS modal presentation style (iOS only)

Website ID

Your Website ID is found in the Crisp Dashboard under Settings > Website Settings.

Token ID

The tokenId is used to identify returning users. When a user opens the chat with the same tokenId, Crisp will restore their previous conversation history. This is useful for:

• Maintaining chat history across app reinstalls
• Linking a user's chat session to your backend user ID
• Ensuring the same user always sees their conversation

CrispConfig config = CrispConfig(
  websiteID: 'YOUR_WEBSITE_ID',
  tokenId: 'user_12345', // Your internal user ID
);

TIP

Use a stable, unique identifier for tokenId — such as your app's user ID or a UUID. Don't use email addresses, as they may change.

Session Segment

Segments help you categorize users in the Crisp dashboard:

CrispConfig config = CrispConfig(
  websiteID: 'YOUR_WEBSITE_ID',
  sessionSegment: 'beta_testers',
);

Opening the Chat

Pass the config to openCrispChat:

await FlutterCrispChat.openCrispChat(config: config);

This launches the native Crisp chat UI. The method validates the email and company URL (if provided) before opening.

WARNING

openCrispChat will throw an ArgumentError if:

• The user email is provided but is not a valid email format
• The company URL is provided but is not a valid URL

Full Example

final config = CrispConfig(
  websiteID: 'YOUR_WEBSITE_ID',
  tokenId: 'user_12345',
  sessionSegment: 'premium',
  user: User(
    email: 'john@example.com',
    nickName: 'John Doe',
    phone: '+1234567890',
    avatar: 'https://example.com/avatar.png',
    company: Company(
      name: 'Acme Inc',
      url: 'https://acme.com',
      companyDescription: 'Building great products',
      employment: Employment(title: 'CTO', role: 'Engineering'),
      geoLocation: GeoLocation(city: 'San Francisco', country: 'USA'),
    ),
  ),
  enableNotifications: true,
);

await FlutterCrispChat.openCrispChat(config: config);

iOS Modal Presentation Styles

The modalPresentationStyle parameter controls how the Crisp chat view is presented on iOS devices. This is particularly important for preventing touch events from passing through to the underlying Flutter UI.

Available Styles

Style	Description
fullScreen	Covers the entire screen (default)
pageSheet	Standard page sheet with dimmed background
formSheet	Centered form sheet
overFullScreen	Full screen with transparent overlay
overCurrentContext	Over current context
popover	Popover style (iPad only)

Example Usage

final config = CrispConfig(
  websiteID: 'YOUR_WEBSITE_ID',
  modalPresentationStyle: ModalPresentationStyle.pageSheet,
);

await FlutterCrispChat.openCrispChat(config: config);

Platform Specific

The modalPresentationStyle parameter only affects iOS devices. On Android, Crisp chat always opens as a full-screen activity. See iOS Features for detailed iOS-specific configurations.

Next Steps

• User & Company — Detailed guide on setting user and company information
• Session Management — Set custom session data, segments, and events