Next.js integration

Use @negusdev/seoinjector-next to power Next.js App Router metadata from your SEO Injector dashboard.

View on GitHub →

Install

npm install @negusdev/seoinjector-next
# or
pnpm add @negusdev/seoinjector-next
yarn add @negusdev/seoinjector-next

Configure

Add your project ID to your environment:

SEO_INJECTOR_PROJECT_ID=proj_xxxxxxxxxxxx
SEO_INJECTOR_API_URL=https://api.seoinjector.io   # optional

Static routes

In any page.tsx, export generateMetadata using generateSEOMetadata:

// app/about/page.tsx
import { generateSEOMetadata } from '@negusdev/seoinjector-next';

export const generateMetadata = () =>
  generateSEOMetadata({
    route: '/about',
    fallback: {
      title: 'About — Acme',
      description: 'How Acme came to be.',
    },
  });

export default function AboutPage() {
  return <main>…</main>;
}

Dynamic routes

// app/posts/[slug]/page.tsx
import { generateSEOMetadata } from '@negusdev/seoinjector-next';

export const generateMetadata = ({ params }: { params: { slug: string } }) =>
  generateSEOMetadata({
    route: `/posts/${params.slug}`,
    fallback: { title: params.slug, description: 'Read this post.' },
  });

JSON-LD structured data

import { JsonLd } from '@negusdev/seoinjector-next';

export default function ArticlePage() {
  return (
    <>
      <JsonLd
        data={{
          '@context': 'https://schema.org',
          '@type': 'Article',
          headline: 'Hello, world',
        }}
      />
      <article>…</article>
    </>
  );
}

Cache & revalidation

Meta responses are cached on the edge for 60 seconds by default. Dashboard edits trigger an automatic purge — most users see updates in under a second.

Troubleshooting

• Metadata not changing? Confirm SEO_INJECTOR_PROJECT_ID is set in the deployed environment, not just locally.
• SSR error in dev? Restart next dev after first installing the package so the env vars load.
• Want logs? Set SEO_INJECTOR_DEBUG=1 to see fetch URLs and cache hits.