Tiptap Docs

Use the AI Suggestion extension with Tiptap Content AI Cloud

The fastest way to get started with the AI Suggestion extension is to let the suggestions be generated with the Tiptap Content AI Cloud API. This works out of the box, you only need to provide the authentication credentials to the extension.

This installation guide relies on using the Tiptap Content AI backend service, if you want to configure it with your own custom LLM you need to follow this guide instead.

Start your Content AI app

  1. Activate a plan: Begin a free trial or choose a subscription.
  2. Configure your AI app. Add your OpenAI API key to your Content AI app.
  3. Set up authentication: Generate a JWT (HS256 algorithm) with our provided secret to authenticate the extension against our service. Get your JWT secret.

Add Your Authentication Credentials to the Extension

Import the extension and configure it with your Tiptap Content AI app id and token.

import { Editor } from '@tiptap/core'
import StarterKit from '@tiptap/starter-kit'
import AiSuggestion from '@tiptap-pro/extension-ai-suggestion'

// Initialize the editor
const editor = new Editor{
  extensions: [
    StarterKit,
    AiSuggestion.configure({
      // Your Tiptap Content AI app id
      appId: 'APP_ID_HERE',
      // This needs to be your generated JWT and MUST NOT be the OpenAI API key!
      token: 'TOKEN_HERE',
      // Other configuration options...
    }),
  ],
})

Now, when the editor loads, the suggestions will be fetched from the Tiptap Content AI API.