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

# Embed guides in help centers and websites

> Embed guides directly into help centers, documentation, websites, and internal tools with a simple iframe.

## Embed a guide

<Steps>
  <Step title="Open your guide" icon="folder-open">
    Open the guide you want to embed.
  </Step>

  <Step title="Click Share" icon="share-2">
    Open the share panel to access embed options.
  </Step>

  <Step title="Get embed code" icon="code">
    Copy the iframe code generated for your guide.
  </Step>

  <Step title="Copy and paste" icon="clipboard-paste">
    Paste the embed code into your website, documentation, or internal tools.
  </Step>
</Steps>

## Example embed code

```html theme={null}
<div style="position: relative; aspect-ratio: 1024/640;"><iframe
        src="https://guideless.ai/share/create-zendesk-trigger-for-auto-assigning-ticket-Y7s83JFjLJ6g/embed"
        title="Create Zendesk Trigger for Auto-Assigning Ticket"
        frameborder="0"
        loading="lazy"
        webkitallowfullscreen
        mozallowfullscreen
        allowfullscreen
        style="
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          color-scheme: light;
        "
      ></iframe></div>
```

Replace `your-guide-id` with the ID from your actual embed code. Guideless generates this automatically when you click **Get embed code**.

<Tip>
  Embedded guides always show the latest version. Update once and changes appear everywhere automatically.
</Tip>

## Works with popular platforms

<CardGroup cols={3}>
  <Card title="Notion" icon="notebook" />

  <Card title="Confluence" icon="layers" />

  <Card title="Intercom" icon="message-circle" />

  <Card title="Zendesk" icon="life-buoy" />

  <Card title="Guru" icon="brain" />

  <Card title="GitBook" icon="book-open" />

  <Card title="Webflow" icon="app-window" />

  <Card title="WordPress" icon="globe" />

  <Card title="Custom HTML" icon="pencil-line" />
</CardGroup>

<Tip>
  Use a width of 100% so embeds automatically adapt to different screen sizes.
</Tip>

<Note>
  Embedded guides always stay up to date. Update the guide once and every embedded version updates automatically.
</Note>
