How to integrate "Ask Cookbook" into your website

Step 1. Contact us to get an API Key

You likely already have one, but if you don't, please contact us at tyler@cookbook.dev

Step 2. Pick one of the integration methods below

Having troubles or need something custom? Contact us

Integration methods

Basic integration

Suitable for static websites, outlines the general idea of how to integrate the bot into your website. As long as you can directly edit the HTML of your website, you can use this method.

``html







`

React integration

Install the package

`bash
yarn add @cookbookdev/docsbot
`
OR
`bash
npm install @cookbookdev/docsbot
`
OR
`bash
pnpm install @cookbookdev/docsbot
`

Import and add our component to something that wraps the content, for example in Next.js it could be _app.js or layout.js

`jsx
import AskCookbook from "@cookbookdev/docsbot/react";

export default function App() {
return (
<>

{/ Your content /}

);
}
`

Webflow integration

1. Go to the Dashboard
2. Get to the "Site settings" (see picture below)

3. Get to the "Custom code" tab (see picture below)

4. Put the following code into the "Head code" text area

`html

`
5. Put the following code into the "Footer code" text area

`html



`
6. Save both of them

!image
7. Publish website

!image

Gitbook Integration

The good news is that we know how to integrate the "Ask Cookbook" into Gitbook! The bad news is that we yet to write a guide on it. If you need it, please contact us

API of

element


`html
id="__cookbook"
data-always-open
data-no-fast
data-api-key="API_KEY_GOES_HERE"
/>
`

API of React component

`jsx
apiKey="API_KEY_GOES_HERE"
alwaysOpen={false} // Optional. If you want to have modal always open, usually for the showcase purposes
noFastMode={false} // Optional. Disables fast mode switch, forces dosbot into the detailed mode
/>
``

---