Add Chat Button to Astro
Integrate Inkeep's chat button into your Astro site for real-time user assistance.
What is Astro
Astro is an all-in-one web framework for content-driven websites. With Inkeep, you can Add AI Search & Chat to your landing page, app, blog, or documentation site powered by Astro.
Get an API key
Follow these steps to create an API key for your web integration.
Copy and add the apiKey
to your environment variables:
Install the component library
Define React components
Install the @astrojs/react package to use React components:
Customize your settings
Define your Inkeep settings.
Define the component
Next, create an InkeepChatButton.tsx
file for the Chat Button
component.
Use the component
Now use the InkeepChatButton.tsx
component in your Astro based website.
Use the client:load
directive to load and hydrate the InkeepChatButton.tsx
component immediately on page load.
For a full list of customizations, check out the Chat Button documentation.