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

# Quickstart

> Create your first AI chatbot and embed it on your website in under 3 minutes.

<Info>
  You can complete this entire guide on the **Free plan** — no credit card needed.
</Info>

## 1. Create Your Account

<Steps>
  <Step title="Go to app.fife.bot">
    Open [app.fife.bot](https://app.fife.bot) in your browser.
  </Step>

  <Step title="Sign up">
    Create an account with your email, or sign in instantly with **Google** or **Microsoft**.
  </Step>

  <Step title="Confirm your email">
    Check your inbox for a confirmation link. You'll be redirected to the dashboard.
  </Step>
</Steps>

## 2. Create a Chatbot

<Steps>
  <Step title="Click + New Chatbot">
    From the dashboard, click the **+ New Chatbot** button in the top right.
  </Step>

  <Step title="Name your chatbot">
    Give it a name visitors will see (e.g. "Support Bot", "Sales Assistant").
  </Step>

  <Step title="Pick a model">
    Select an AI model. Not sure? Start with **GPT-4o Mini** — fast, cheap, and capable.

    | Tier     | Example models                                              | Credits/msg |
    | -------- | ----------------------------------------------------------- | ----------- |
    | Free     | GPT-OSS 120B, GPT-4o Mini                                   | 0           |
    | Budget   | Llama 4 Maverick, Gemini 2.0 Flash, DeepSeek V3, Qwen3 235B | 1           |
    | Standard | Claude Haiku 4.5, Gemini 2.5 Pro                            | 5           |
    | Premium  | Claude Sonnet 4, GPT-4o                                     | 10          |
    | Ultra    | GPT 5.3, Claude Sonnet 4.6                                  | 22          |
  </Step>

  <Step title="Save">
    Click **Create**. Your chatbot is ready.
  </Step>
</Steps>

## 3. Add Knowledge

Your chatbot needs content to answer questions. Open the **Knowledge Base** tab and pick a source:

<Tabs>
  <Tab title="Website">
    <Steps>
      <Step title="Click Add Source → Website">
        Enter your website URL (e.g. `https://example.com`).
      </Step>

      <Step title="Discover pages">
        FIFE.BOT crawls your sitemap and lists all found pages. Select the ones to include.
      </Step>

      <Step title="Scrape">
        Click **Scrape selected**. Pages are crawled, chunked, and embedded automatically.
      </Step>
    </Steps>
  </Tab>

  <Tab title="Documents">
    <Steps>
      <Step title="Click Add Source → Document">
        A drag & drop dialog opens.
      </Step>

      <Step title="Upload files">
        Drop your **PDF**, **DOCX**, or **TXT** files (max 50 MB).
      </Step>
    </Steps>
  </Tab>

  <Tab title="Text Entry">
    <Steps>
      <Step title="Click Add Source → Text">
        A rich text editor opens.
      </Step>

      <Step title="Write or paste content">
        Enter your FAQ, product descriptions, policies, etc. Click **Save**.
      </Step>
    </Steps>
  </Tab>

  <Tab title="Integrations">
    <Steps>
      <Step title="Connect your account">
        Go to **Integrations** in the sidebar and connect Notion, Confluence, Google Drive, or SharePoint.
      </Step>

      <Step title="Add integration source">
        Back in your chatbot's Knowledge Base, click **Add Source** and pick the connected integration.
      </Step>

      <Step title="Select content">
        Browse and select the pages or files you want to include.
      </Step>
    </Steps>

    <Tip>
      Integrations are connected **per-user**, not per-chatbot. Connect once, use across all chatbots.
    </Tip>
  </Tab>
</Tabs>

## 4. Customize the Widget

Go to the **Settings** tab → **Appearance** sub-tab:

| Setting             | Description                                                                                                 |
| ------------------- | ----------------------------------------------------------------------------------------------------------- |
| **Primary color**   | Widget accent color (12 presets or custom hex)                                                              |
| **Font family**     | Choose from 10 fonts                                                                                        |
| **Theme mode**      | Light, dark, or auto (follows user's system)                                                                |
| **Header style**    | Branded or simple                                                                                           |
| **Corner radius**   | 0–32px slider                                                                                               |
| **Widget language** | One of **14** UI locales (default **English**); see [Widget appearance](/widget-appearance#widget-language) |

Use the **live preview** on the right to see changes in real time.

## 5. Embed on Your Website

Go to the **Publish** tab → **Embed Widget** sub-tab. Copy the script tag:

```html theme={null}
<script
  src="https://app.fife.bot/widget.js"
  data-agent-id="YOUR_AGENT_ID"
  defer
></script>
```

Paste it before the closing `</body>` tag on your website:

```html theme={null}
<body>
  <!-- Your website content -->

  <!-- FIFE.BOT Widget -->
  <script
    src="https://app.fife.bot/widget.js"
    data-agent-id="YOUR_AGENT_ID"
    defer
  ></script>
</body>
```

<Check>
  **Done!** A chat bubble appears in the bottom-right corner of your site. Visitors can now ask questions and get instant answers from your knowledge base.
</Check>