obsidian/wiki/tech-patterns/payload-cms-admin-metadata.md
2026-05-15 15:13:56 +01:00

159 lines
4.3 KiB
Markdown

---
title: "Payload CMS — Admin Panel Metadata"
aliases: [payload-metadata, payload-admin-meta]
tags: [payload-cms, nextjs, metadata, seo, admin-panel]
sources: [raw/admin__metadata.md]
created: 2026-05-15
updated: 2026-05-15
---
# Payload CMS — Admin Panel Metadata
Every Admin Panel page gets auto-generated metadata (title, description, og:image) derived from live document data and the user's locale — no config required. Metadata is fully customizable at four cascading levels.
## Cascade Levels
```
Root → Collection / Global → View
(overrides parent)
```
| Level | Config Key | Scope |
|-------|-----------|-------|
| Root | `admin.meta` in Payload Config | All Admin Panel pages |
| Collection | `admin.meta` in Collection Config | All views within the collection |
| Global | `admin.meta` in Global Config | All views within the global |
| View | `meta` in View Config | Specific view only |
All levels share the same options structure (Root has a few extras).
## Root Metadata
```ts
// payload.config.ts
{
admin: {
meta: {
title: 'My Admin Panel',
description: 'The best admin panel in the world',
titleSuffix: '- MyApp', // replaces default "- Payload"
defaultOGImageType: 'dynamic', // 'dynamic' | 'static' | 'off'
icons: [...],
openGraph: {...},
robots: 'noindex, nofollow',
},
},
}
```
### Root-Only Options
| Key | Type | Default | Description |
|-----|------|---------|-------------|
| `titleSuffix` | `string` | `"- Payload"` | Appended to every page title |
| `defaultOGImageType` | `dynamic` \| `static` \| `off` | `dynamic` | How to generate the default OG image |
All other keys pass through to Next.js [`generateMetadata`](https://nextjs.org/docs/app/api-reference/functions/generate-metadata).
## Icons
```ts
admin: {
meta: {
icons: [
{ rel: 'icon', type: 'image/png', url: '/favicon.png' },
{ rel: 'apple-touch-icon', type: 'image/png', url: '/apple-touch-icon.png' },
],
},
}
```
Common `rel` values: `icon`, `apple-touch-icon`, `mask-icon`.
## Open Graph
```ts
admin: {
meta: {
openGraph: {
title: 'My Admin Panel',
description: '...',
siteName: 'Payload',
images: [{ url: 'https://example.com/image.jpg', width: 800, height: 600 }],
},
},
}
```
## Robots / Crawling
```ts
// Prevent indexing via meta tag
admin: { meta: { robots: 'noindex, nofollow' } }
```
> **Default:** Admin Panel already sets `noindex` by default.
To prevent crawling entirely (meta tag doesn't stop crawlers), add `robots.txt`:
```text
User-agent: *
Disallow: /admin/
```
If `config.routes` has a custom admin path, update `Disallow` to match.
## Collection & Global Metadata
```ts
// Collection
export const MyCollection: CollectionConfig = {
admin: {
meta: { title: 'My Collection', description: '...' },
},
}
// Global
export const MyGlobal: GlobalConfig = {
admin: {
meta: { title: 'My Global', description: '...' },
},
}
```
Same options as Root (minus `titleSuffix` and `defaultOGImageType`).
## View Metadata
Overrides Root/Collection/Global for a specific view:
```ts
admin: {
views: {
dashboard: {
meta: { title: 'My Dashboard', description: '...' },
},
},
}
```
## Key Takeaways
- Auto-generated metadata works out of the box — config is only needed to override defaults.
- Cascade order: Root → Collection/Global → View (most specific wins).
- `titleSuffix` defaults to `"- Payload"` — always override for production apps.
- `defaultOGImageType: 'dynamic'` uses Next.js image generation; `'static'` uses a fixed URL; `'off'` disables OG images.
- Setting `robots` meta tag prevents indexing but **not crawling** — use `robots.txt` for that.
- All metadata flows through Next.js `generateMetadata` — any Next.js metadata option is valid.
## Related
- [[wiki/tech-patterns/payload-cms-installation|Payload CMS — Installation & Setup]]
- [[wiki/tech-patterns/payload-cms-admin-panel-location|Payload CMS — Custom Admin Panel Location]]
- [[wiki/tech-patterns/payload-cms-customizing-css|Payload CMS — Customizing CSS & SCSS]]
- [[wiki/tech-patterns/payload-cms-access-control-overview|Payload CMS — Access Control Overview]]
## Sources
- `raw/admin__metadata.md` — compiled 2026-05-15
- Source: https://payloadcms.com/docs/admin/metadata