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

4.3 KiB

title aliases tags sources created updated
Payload CMS — Admin Panel Metadata
payload-metadata
payload-admin-meta
payload-cms
nextjs
metadata
seo
admin-panel
raw/admin__metadata.md
2026-05-15 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

// 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.

Icons

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

admin: {
  meta: {
    openGraph: {
      title: 'My Admin Panel',
      description: '...',
      siteName: 'Payload',
      images: [{ url: 'https://example.com/image.jpg', width: 800, height: 600 }],
    },
  },
}

Robots / Crawling

// 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:

User-agent: *
Disallow: /admin/

If config.routes has a custom admin path, update Disallow to match.

Collection & Global Metadata

// 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:

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.

Sources