SEOInit
Initializes the SEO Manager with your project credentials. This must be called before using any other nextjs-seo-manager functions.
To find or create your API keys, visit Project Settings.
Properties
| Property | Type | Required | Description |
|---|---|---|---|
| projectId | string | Yes | Your Project ID. Always required. |
| secretKey | string | No | Your Project Secret Key. Required for server-side operations (fetchSEO, backend API, webhooks). Should NOT be exposed to the client. |
| projectKey | string | No | Your Project Key. Required if you use the SEO Manager UI component (SEOHelper or AppSEOHelper). Will be exposed to the client. |
When is each key needed?
projectId— always required.secretKey— required for server-side operations:fetchSEO, backend API (insertSeoPage,updateSeoPage,deleteSeoPage,getSeoPages), and webhook validation.projectKey— required if you use the SEO Manager UI component (SEOHelperorAppSEOHelper) which enables the in-page editor and analytics pings.
Environment Variables
Store your keys in .env.local so they are not committed to source control:
# .env.local
SEO_MANAGER_PROJECT_ID=your_project_id
SEO_MANAGER_SECRET_KEY=your_secret_key
NEXT_PUBLIC_SEO_MANAGER_PROJECT_KEY=your_project_key
The NEXT_PUBLIC_ prefix exposes the value to the browser (needed for projectKey since the SEO Manager UI runs client-side). Keep secretKey and projectId server-only — do not prefix them with NEXT_PUBLIC_.
Pages Router Example
// _app.js (or at the top of any API route that uses the SEO Manager)
import SEOInit from "nextjs-seo-manager/init";
SEOInit({
projectId: process.env.SEO_MANAGER_PROJECT_ID,
secretKey: process.env.SEO_MANAGER_SECRET_KEY,
projectKey: process.env.NEXT_PUBLIC_SEO_MANAGER_PROJECT_KEY,
});
export default function App({ Component, pageProps }) {
return <Component {...pageProps} />;
}
App Router Example
In the App Router you can call SEOInit at the top of each page file or in a shared utility. It sets environment-level state, so it only needs to run once per process.
// app/layout.tsx
import SEOInit from "nextjs-seo-manager/init";
SEOInit({
projectId: process.env.SEO_MANAGER_PROJECT_ID,
secretKey: process.env.SEO_MANAGER_SECRET_KEY,
projectKey: process.env.NEXT_PUBLIC_SEO_MANAGER_PROJECT_KEY,
});
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<body>{children}</body>
</html>
);
}
Follow the Next Step