Framework integration

Rankveo for Astro

Publish in rankveo, render on your Astro site. A Content Layer loader turns your articles into a typed collection, cached between builds.
@rankveo/astro

Installation

Install the package in your existing Astro project.

terminal 
npm install @rankveo/astro
Create a Rankveo account View source on GitHub

Three steps

1

Define the collection

One loader, in the config file Astro already looks for.

// src/content.config.ts
import { defineCollection } from
  'astro:content';
import { rankveoLoader } from
  '@rankveo/astro';

export const collections = {
  blog: defineCollection({
    loader: rankveoLoader(),
  }),
};
2

Generate the routes

Articles are entries, so getStaticPaths works as usual.

const articles =
  await getCollection('blog');

return articles.map((article) => ({
  params: { slug: article.id },
  props: { article },
}));
3

Render it

The body comes back through Astro’s own renderer.

const { Content } =
  await render(article);

<article class="article-body">
  <Content />
</article>

Built for how Astro builds

Static output has no runtime, no query strings, and no cache to invalidate. The starter is written for that rather than ported from a framework that has all three.

  • Incremental by digest Unchanged articles are never refetched. A warm build touches almost nothing.
  • Real paths, not query strings Pagination through Astro’s own paginate(), so every page is crawlable.
  • Trailing slashes that match Canonicals agree with what directory-format output actually serves. 
# what a build looks like

[content] Syncing content
  6 published articles
  (2 fetched, 4 unchanged)

▶ /blog/index.html
▶ /blog/how-to-rank-in-ai-answers/
▶ /blog/tag/ai-visibility/
▶ /blog/sitemap.xml
▶ /blog/rss.xml

13 page(s) built in 1.09s

Worth knowing before you start

Things that would otherwise cost you an afternoon.

Pass the key explicitly Astro loads .env into import.meta.env, not process.env, so the client’s own fallback cannot see it from a config file.
Static sites rebuild, they don’t revalidate There is no runtime cache to clear. Point rankveo at your host’s deploy hook and publishing triggers a build.
The revalidate route is opt-in It carries prerender = false, so copying it into a static project fails with NoAdapterInstalled. It ships under starter/server for server output.
Style the article HTML Most CSS resets strip list markers and flatten heading sizes. The starter ships blog.css to put them back.