Skip to content

Quick Start

Open your first Crisp chat in under 5 minutes.

Prerequisites

  1. You have installed the crisp_chat package
  2. You have completed platform setup for the targets you use (Android/iOS permissions, Web CSP if needed, desktop main() + entitlements). For iOS video calls, see Enable video calls (iOS only) — optional and build-time only.
  3. You have a Crisp Website ID from your Crisp Dashboard

Get Your Website ID

Go to your Crisp Dashboard, navigate to Settings > Website Settings, and copy your Website ID:

Crisp Dashboard

Android and iOS

Before testing on Android or iOS, disable Lock the chatbox to website domain (and subdomains) in the Crisp dashboard (SettingsWebsite SettingsChatbox & Email SettingsChatbox Security). With domain lock enabled, chat fails with "Error starting chat" even when the Website ID is valid. See Configuration — Chatbox Security.

Minimal Example

dart
import 'package:flutter/material.dart';
import 'package:crisp_chat/crisp_chat.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('Crisp Chat')),
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              final config = CrispConfig(
                websiteID: 'YOUR_WEBSITE_ID', // Replace with your Website ID
                enableNotifications: true, // Optional: Control notification prompts
                // iOS only: Control how the chat is presented
                modalPresentationStyle: ModalPresentationStyle.fullScreen,
              );
              FlutterCrispChat.openCrispChat(config: config);
            },
            child: const Text('Open Chat'),
          ),
        ),
      ),
    );
  }
}

Replace YOUR_WEBSITE_ID with your actual Website ID from the Crisp dashboard. Tap the button:

  • Android / iOS — opens the native Crisp chat UI
  • Web — opens the Crisp chatbox overlay on the page
  • Desktop — opens an embedded WebView window (or the system browser if WebView is unavailable)

Run on Web or desktop

bash
# Web (Chrome)
flutter run -d chrome --dart-define=websiteId=YOUR_WEBSITE_ID

# macOS (after platform setup + entitlements)
flutter run -d macos --dart-define=websiteId=YOUR_WEBSITE_ID

Use the same openCrispChat call; no separate Web API. See Supported Platforms for the full API matrix.

Mobile-only options

enableNotifications and modalPresentationStyle apply to Android/iOS only. On Web and desktop they are ignored.

Next Steps

Now that you have a basic chat working, explore the full capabilities:

  • Configuration — Customize CrispConfig with user details, tokens, and segments
  • iOS Features — iOS-specific modal presentation and notification settings