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

# Contextly Integration

> Smart, configurable content recommendations and trending post tagging for your Ghost site via Contextly.

export const PlanStatus = ({tier, status, beta, deprecated}) => {
  const variants = {
    luna: {
      bg: "#8340B9",
      color: "#ffffff",
      border: "1px solid #8340B9"
    },
    voyager: {
      bg: "#6B2FA0",
      color: "#ffffff",
      border: "1px solid #6B2FA0"
    },
    "space-station": {
      bg: "transparent",
      color: "#8340B9",
      border: "1px solid #8340B9"
    },
    "all-plans": {
      bg: "transparent",
      color: "#525252",
      border: "1px solid #a3a3a3"
    },
    labs: {
      bg: "transparent",
      color: "#a16207",
      border: "1px solid #a16207"
    },
    beta: {
      bg: "transparent",
      color: "#a16207",
      border: "1px solid #a16207"
    },
    "invite-only": {
      bg: "transparent",
      color: "#525252",
      border: "1px solid #a3a3a3"
    },
    bespoke: {
      bg: "transparent",
      color: "#525252",
      border: "1px solid #a3a3a3"
    },
    "outpost-hosted": {
      bg: "transparent",
      color: "#525252",
      border: "1px solid #a3a3a3"
    },
    deprecated: {
      bg: "transparent",
      color: "#b91c1c",
      border: "1px solid #b91c1c"
    }
  };
  const chip = (variant, label) => {
    const s = variants[variant] || variants["all-plans"];
    return <span key={variant + ":" + label} style={{
      display: "inline-flex",
      alignItems: "center",
      padding: "0.15rem 0.55rem",
      fontSize: "0.7rem",
      fontWeight: 700,
      letterSpacing: "0.05em",
      textTransform: "uppercase",
      borderRadius: "3px",
      lineHeight: 1.4,
      whiteSpace: "nowrap",
      backgroundColor: s.bg,
      color: s.color,
      border: s.border
    }}>
        {label}
      </span>;
  };
  const tierLabel = {
    "luna": "Luna",
    "voyager+": "Voyager+",
    "voyager-luna": "Voyager + Luna",
    "space-station+": "Space Station+",
    "all-plans": "All plans"
  };
  const tierVariant = {
    "luna": "luna",
    "voyager+": "voyager",
    "voyager-luna": "voyager",
    "space-station+": "space-station",
    "all-plans": "all-plans"
  };
  const statusLabel = {
    "labs": "Labs",
    "invite-only": "Invite-only",
    "bespoke": "Bespoke",
    "deprecated": "Deprecated",
    "outpost-hosted": "Outpost Hosted"
  };
  return <span style={{
    display: "inline-flex",
    gap: "0.4rem",
    flexWrap: "wrap",
    alignItems: "center",
    margin: "0 0 1.25rem 0"
  }}>
      {tier && chip(tierVariant[tier], tierLabel[tier])}
      {status && chip(status, statusLabel[status])}
      {beta && chip("beta", "Beta")}
      {deprecated && chip("deprecated", "Deprecated")}
    </span>;
};

<PlanStatus tier="luna" />

The Contextly integration connects your Outpost publication to [Contextly](https://contextly.com), which provides smart, highly configurable content recommendations on your Ghost site. Contextly analyzes your content and reader behavior to surface related articles, and you have full control over how recommendations appear and which content is promoted — driving deeper engagement and page views.

***

## How it works

1. You connect Outpost to Contextly using your Contextly API key
2. Contextly indexes your Ghost content and analyzes reader behavior
3. Recommendation widgets appear on your Ghost site, showing related articles to readers
4. Contextly also powers the [Trending Posts](/features/trending-posts) feature in Outpost, tagging posts that are getting high engagement

***

## Settings

| Field                     | Description                                                                                                                  |
| ------------------------- | ---------------------------------------------------------------------------------------------------------------------------- |
| **API Key**               | Your Contextly API key. Found in your Contextly account settings.                                                            |
| **Log Me Into Contextly** | Opens the Contextly dashboard where you can configure recommendation widgets, view analytics, and manage your content index. |

***

## Setup

1. Go to **Integrations** in the left navigation
2. Click **Add Integration** and select **Recommendations (Contextly)**
3. Enter your Contextly API key
4. Click **Save and Connect**
5. Use the **Log Me Into Contextly** button to access the Contextly dashboard for widget configuration

***

## What Contextly provides

* **Related content widgets** — Display related articles at the bottom of posts to keep readers engaged
* **Sidebar recommendations** — Show trending or related content in your site's sidebar
* **Trending post data** — Feeds engagement data back to Outpost to drive the [Trending Posts](/features/trending-posts) tagging feature
* **Content analytics** — View which articles drive the most engagement and cross-traffic in the Contextly dashboard

***

## Related features

<CardGroup cols={2}>
  <Card title="Trending Posts" icon="fire" href="/features/trending-posts">
    Automatically tag posts that are trending based on Contextly data.
  </Card>

  <Card title="CTAs" icon="rectangle-ad" href="/features/ctas">
    Combine content recommendations with calls to action for conversion.
  </Card>
</CardGroup>

***

## FAQ

<AccordionGroup>
  <Accordion title="Do I need a separate Contextly account?">
    Yes. Contextly is a third-party service with its own account and pricing. The Outpost integration connects the two services.
  </Accordion>

  <Accordion title="How do I configure the recommendation widgets?">
    Use the **Log Me Into Contextly** button in the integration settings to access the Contextly dashboard. Widget appearance, placement, and behavior are configured there, not in Outpost.
  </Accordion>

  <Accordion title="Does Contextly slow down my site?">
    Contextly's widgets load asynchronously and should not significantly impact page load times. Check your [Plausible dashboard](/features/plausible-dashboard) for site performance metrics.
  </Accordion>
</AccordionGroup>
