> ## Documentation Index
> Fetch the complete documentation index at: https://product-guide-starter-replace-template-content.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Home

> Everything you need to set up, configure, and get the most out of Platform, Analytics, and Integrations tools.

<div data-product-guide-index className="flex w-full flex-col gap-8 max-w-5xl mx-auto px-4 md:px-8 lg:px-12 py-10 lg:gap-14 lg:py-16">
  <div className="flex max-w-[540px] flex-col gap-2 self-center text-center">
    <h1 className="text-[30px] font-medium leading-9 tracking-tight text-gray-900 dark:text-gray-50">
      Product Guide
    </h1>

    <p className="text-balance text-base leading-relaxed tracking-tight text-gray-600 dark:text-gray-400">
      Everything you need to deploy your docs site, understand your readers, and connect the tools your team already uses.
    </p>
  </div>

  <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
    <Card title={<span className="product-guide-feature-card-title">Platform</span>} icon="chart-no-axes-gantt" href="/platform" className="product-guide-feature-card" size={64}>
      <span className="product-guide-feature-card-description">Deploy your site, configure docs.json, and manage your team.</span>
    </Card>

    <a href="/analytics" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
      <Icon icon="chart-column" color="rgb(var(--primary))" size={18} className="shrink-0" />

      <div className="flex flex-col gap-1">
        <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Analytics</span>

        <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
          Track page views, search queries, and reader feedback.
        </span>
      </div>
    </a>

    <a href="/integrations" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
      <Icon icon="code-xml" color="rgb(var(--primary))" size={18} className="shrink-0" />

      <div className="flex flex-col gap-1">
        <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Integrations</span>

        <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
          Connect analytics providers, chat widgets, and custom scripts.
        </span>
      </div>
    </a>
  </div>

  <hr className="border-0 border-t border-border" />

  <div className="flex flex-col gap-4">
    <h2 className="font-serif text-xl font-medium leading-normal text-gray-900 dark:text-gray-50">Common tasks</h2>

    <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
      <a href="/platform/configuration/user-management" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="users" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Invite an editor</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Add teammates to your project and control what they can edit or manage.
          </span>
        </div>
      </a>

      <a href="/analytics/connect-data" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="database" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Connect an analytics provider</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Add PostHog, GA4, Segment, or another provider to your docs in minutes.
          </span>
        </div>
      </a>

      <a href="/integrations/connectors/crm" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="message-circle" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Add a chat widget</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Embed Intercom, Crisp, or another support tool on every docs page.
          </span>
        </div>
      </a>

      <a href="/analytics/dashboards/create-dashboard" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="layout-dashboard" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">View your analytics</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            See page views, search queries, and feedback in the built-in dashboard.
          </span>
        </div>
      </a>

      <a href="/integrations/webhooks/configure" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="code" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Add custom scripts</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Inject custom JavaScript and CSS for anything not covered by built-in integrations.
          </span>
        </div>
      </a>

      <a href="/analytics/reports/scheduled-reports" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="calendar-clock" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Set up analytics digests</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Get recurring email or Slack summaries of your docs traffic and search trends.
          </span>
        </div>
      </a>
    </div>
  </div>
</div>
