RankPine docs
Integrations

Lovable via webhook

Add a signed RankPine receiver to an existing Lovable project with an Edge Function, server-side secret, persistent article upsert, and sitemap refresh.

Lovable connects to RankPine via webhook. This guide adds one server-side Edge Function to your existing project; it does not replace your application or create a separate RankPine CMS integration.

What RankPine does — and what your project does

RankPine signs and delivers the article. Your Lovable project verifies it, stores or updates the post, exposes its public URL, and keeps its sitemap or equivalent discovery route current.

Before you start

  • Your project needs Lovable Cloud or a connected Supabase backend. A static Vite frontend cannot keep the signing secret or receive a server webhook.
  • Decide which table stores articles and which public route renders them.
  • Generate a long random value for RANKPINE_WEBHOOK_SECRET; do not paste it into chat or client-side code.

Lovable's current documentation uses Cloud → Secrets for server credentials, Edge Functions for secret-bearing logic, and Publish for the permanent lovable.app or custom-domain deployment. See Lovable's official API integration, security, and publishing guides.

1. Add the receiver

Download the shared, framework-compatible RankPine receiver template. Put it beside a new rankpine-webhook Edge Function and adapt only the two adapter methods:

  • upsertByRankPineId must query and upsert on article.id, never only on the slug. Store the title, slug, HTML, Markdown, scheduledFor, featured image, inline images, and the entire metadata object.
  • refreshSitemap must invalidate or rebuild the sitemap/data route your Lovable app actually uses. Let an error reject the request so RankPine can retry the already-idempotent upsert.

The function must read the exact raw request text before parsing JSON. If your Supabase function configuration verifies JWTs by default, disable JWT verification for this one public webhook and rely on the template's HMAC and freshness checks.

Copy-paste build instruction

Add RankPine publishing to this existing Lovable project via one secure webhook. Preserve every unrelated page, component, database table, route, style, and integration.

Create a server-side Edge Function named rankpine-webhook. Use the shared receiver contract from https://rankpine.com/docs/templates/rankpine-webhook-receiver.ts. Read RANKPINE_WEBHOOK_SECRET only from the Edge Function secret store. Verify X-RankPine-Signature against the exact raw request body before JSON parsing, reject requests more than five minutes old or future-dated, validate verification and article.published events, and never expose the secret to the Vite client.

Add or reuse the project's article table and public article route. Upsert by the stable RankPine article.id so retries update one record. Preserve title, slug, HTML, Markdown, meta description, language, translation group, word count, SEO score, sources, featuredImage, inline images, publishedAt, and scheduledFor. Return stable JSON { id, url }. Wire the receiver's refreshSitemap hook to the sitemap or content-discovery mechanism this project actually serves; do not claim RankPine updates it.

Allow unauthenticated HTTP access to this one Edge Function because RankPine is not a Lovable user, but keep the HMAC and replay checks mandatory. Do not weaken authentication on any other function. Show me the exact deployed function URL and a summary of the files and schema you changed. Do not publish or modify unrelated application code without asking.

2. Set the secret

  1. Open Cloud → Secrets and add RANKPINE_WEBHOOK_SECRET.
  2. If Test and Live environments are enabled, set the value in the environment you will test and in Live before production delivery; Lovable keeps those Cloud settings separate.
  3. Reference it only inside the Edge Function (Deno.env.get(...) or the runtime API already used by the project).

3. Deploy and copy the endpoint

Apply the Edge Function change, then use Publish (or Publish → Update) for the app. In the function/Cloud view, copy the deployed rankpine-webhook URL. For a Supabase-backed project it normally ends in /functions/v1/rankpine-webhook; use the exact URL Lovable shows rather than constructing one from memory.

The endpoint must be publicly reachable over HTTPS. A workspace-only published site or an authenticated preview can block RankPine before HMAC verification.

4. Connect it in RankPine

  1. In RankPine, open Settings → Integrations.
  2. Under Website builders via webhook, choose Lovable → Connect via webhook.
  3. Paste the Edge Function URL and the same signing secret.
  4. Leave Include HTML and Include Markdown on.
  5. Connect. The signed verification event must return 200.

5. Verify a delivery

Publish a test article from RankPine, then confirm:

  • the function log shows one valid article.published request;
  • the article table has one row keyed by article.id;
  • sending an update changes that row instead of creating a second one;
  • the returned URL resolves to the article; and
  • the live sitemap or documented discovery equivalent contains the URL after your app's refresh step runs.

RankPine cannot verify the Lovable database, rendered page, or sitemap locally. Those are live checks in your project.

On this page