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

# Ghost

> Add your Invent assistant to Ghost sites

## Overview

Add your Invent AI assistant to any Ghost site with a floating bubble. Perfect for blogs, newsletters, and content-focused websites.

## Installation

<Steps>
  <Step title="Access Ghost Admin">
    Log in to your Ghost admin panel at `yourdomain.com/ghost`
  </Step>

  <Step title="Open Code Injection">
    Navigate to **Settings** → **Code injection**
  </Step>

  <Step title="Add to Site Footer">
    In the **Site Footer** section, paste this code:

    ```html theme={"system"}
    <invent-assistant assistant-id="YOUR_ASSISTANT_ID" />
    <script type="text/javascript" src="https://www.useinvent.com/embed.js" async defer></script>
    ```

    Replace `YOUR_ASSISTANT_ID` with your actual assistant ID from the Invent dashboard.
  </Step>

  <Step title="Save Changes">
    Click **Save** and the assistant will appear on all pages of your Ghost site.
  </Step>
</Steps>

## Customization

### Match Your Ghost Theme

```html theme={"system"}
<invent-assistant
  assistant-id="YOUR_ASSISTANT_ID"
  theme-appearance="auto"
  theme-button-background-color="#15171A"
  theme-button-color="#FFFFFF"
/>
<script type="text/javascript" src="https://www.useinvent.com/embed.js" async defer></script>
```

### Show Only on Posts

To add the assistant only to blog posts:

1. Go to **Settings** → **Code injection**
2. Use the **Post Footer** section instead of **Site Footer**

### Show Only on Pages

For static pages only, add the code to individual page footers:

1. Edit the specific page
2. Click **Settings** (gear icon)
3. Add the code in **Code injection** for that page

## Ghost Membership Integration

<Warning>
  **User Authentication Not Supported:** Ghost does not provide server-side scripting capabilities needed to securely generate the `user-hash` required for user authentication. For sites with Ghost memberships, use the basic implementation without user-specific attributes. User authentication requires both `user-id` and `user-hash` to be provided together with the hash generated on your backend using HMAC-SHA256.
</Warning>

For Ghost sites, use the basic implementation that works for all visitors:

```html theme={"system"}
<invent-assistant assistant-id="YOUR_ASSISTANT_ID" />
<script type="text/javascript" src="https://www.useinvent.com/embed.js" async defer></script>
```

If you need user-specific authentication, you would need to implement custom middleware or a serverless function outside of Ghost to generate the hash securely. See the [Widget Authentication](/assistants/widget#user-authentication-optional) guide for hash generation examples.

## Newsletter Integration

Help subscribers with:

* Content recommendations
* Archive searching
* Subscription questions
* Member benefits

## Tips for Ghost

<CardGroup cols={2}>
  <Card title="All Themes" icon="palette">
    Works with all official and custom Ghost themes
  </Card>

  <Card title="SEO Friendly" icon="magnifying-glass">
    No impact on SEO or page speed
  </Card>

  <Card title="Newsletter Ready" icon="envelope">
    Help subscribers find content
  </Card>

  <Card title="Member Support" icon="users">
    Assist paid and free members
  </Card>
</CardGroup>

## Advanced: Custom Theme Integration

If you have access to your Ghost theme files, you can add the code directly:

### Via default.hbs

Add to your theme's `default.hbs` file before the closing `</body>` tag:

```handlebars theme={"system"}
<invent-assistant assistant-id="YOUR_ASSISTANT_ID" />
<script type="text/javascript" src="https://www.useinvent.com/embed.js" async defer></script>

{{!-- Ghost outputs required footer scripts - always include this last --}}
{{ghost_foot}}
```

### Via Helpers

Create a custom helper in your theme:

```javascript theme={"system"}
// core/server/helpers/invent.js
module.exports = function invent(options) {
  return new SafeString(
    '<invent-assistant assistant-id="YOUR_ASSISTANT_ID"></invent-assistant>'
  );
};
```

## Ghost(Pro) vs Self-Hosted

### Ghost(Pro)

* Use Code Injection method (recommended)
* No server access needed
* Works out of the box

### Self-Hosted Ghost

* Can use Code Injection or theme files
* Full customization available
* Can implement advanced authentication

## Troubleshooting

<AccordionGroup>
  <Accordion title="Bubble not appearing">
    **Solutions:**

    * Verify code is in Site Footer, not Site Header
    * Check assistant ID is correct
    * Clear Ghost cache (Settings → Labs → Delete all content cache)
    * Test in incognito mode
  </Accordion>

  <Accordion title="Conflicts with theme">
    **Solutions:**

    * Check theme's z-index values
    * Try adding code to theme files instead of Code Injection
    * Update to latest Ghost version
  </Accordion>

  <Accordion title="Not showing for members only">
    **Solutions:**

    * Ensure Code Injection applies to member pages
    * Check membership settings
    * Test while logged in as a member
  </Accordion>
</AccordionGroup>

## Popular Ghost Themes

Tested and working with:

* **Casper** (default theme)
* **Headline**
* **Edition**
* **Solo**
* **Journal**
* **Massively**
* And all other official Ghost themes