b417c1f61a
## The SEO plugin now takes in a function to override or add in new
fields
- `fieldOverrides` has been removed
- `fields` is now a function that takes in `defaultFields` and expects
an array of fields in return
This makes it a lot easier for end users to override and extend existing
fields and add new ones. This change also brings this plugin inline with
the pattern that we use in our other plugins.
```ts
// before
seoPlugin({
fieldOverrides: {
title: {
required: true,
},
},
fields: [
{
name: 'customField',
type: 'text',
}
]
})
// after
seoPlugin({
fields: ({ defaultFields }) => {
const modifiedFields = defaultFields.map((field) => {
// Override existing fields
if ('name' in field && field.name === 'title') {
return {
...field,
required: true,
}
}
return field
})
return [
...modifiedFields,
// Add a new field
{
name: 'ogTitle',
type: 'text',
label: 'og:title',
},
]
},
})
```
## Also fixes
- Localization labels not showing up on default fields
- The inability to add before and after inputs to default fields
https://github.com/payloadcms/payload/issues/8893
111 lines
2.9 KiB
TypeScript
111 lines
2.9 KiB
TypeScript
import { fileURLToPath } from 'node:url'
|
|
import path from 'path'
|
|
const filename = fileURLToPath(import.meta.url)
|
|
const dirname = path.dirname(filename)
|
|
import type { GenerateDescription, GenerateTitle, GenerateURL } from '@payloadcms/plugin-seo/types'
|
|
import type { Field } from 'payload'
|
|
import type { Page } from 'plugin-seo/payload-types.js'
|
|
|
|
import { seoPlugin } from '@payloadcms/plugin-seo'
|
|
import { en } from '@payloadcms/translations/languages/en'
|
|
import { es } from '@payloadcms/translations/languages/es'
|
|
|
|
import { buildConfigWithDefaults } from '../buildConfigWithDefaults.js'
|
|
import { devUser } from '../credentials.js'
|
|
import { Media } from './collections/Media.js'
|
|
import { Pages } from './collections/Pages.js'
|
|
import { PagesWithImportedFields } from './collections/PagesWithImportedFields.js'
|
|
import { Users } from './collections/Users.js'
|
|
import { seed } from './seed/index.js'
|
|
|
|
const generateTitle: GenerateTitle<Page> = ({ doc }) => {
|
|
return `Website.com — ${doc?.title}`
|
|
}
|
|
|
|
const generateDescription: GenerateDescription<Page> = ({ doc }) => {
|
|
return doc?.excerpt || 'generated description'
|
|
}
|
|
|
|
const generateURL: GenerateURL<Page> = ({ doc, locale }) => {
|
|
return `https://yoursite.com/${locale ? locale + '/' : ''}${doc?.slug || ''}`
|
|
}
|
|
|
|
export default buildConfigWithDefaults({
|
|
collections: [Users, Pages, Media, PagesWithImportedFields],
|
|
i18n: {
|
|
supportedLanguages: {
|
|
en,
|
|
es,
|
|
},
|
|
translations: {
|
|
es: {
|
|
'plugin-seo': {
|
|
autoGenerate: 'Auto-génerar',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
admin: {
|
|
importMap: {
|
|
baseDir: path.resolve(dirname),
|
|
},
|
|
},
|
|
localization: {
|
|
defaultLocale: 'en',
|
|
fallback: true,
|
|
locales: ['en', 'es', 'de'],
|
|
},
|
|
onInit: async (payload) => {
|
|
await payload.create({
|
|
collection: 'users',
|
|
data: {
|
|
email: devUser.email,
|
|
password: devUser.password,
|
|
},
|
|
})
|
|
|
|
await seed(payload)
|
|
},
|
|
plugins: [
|
|
seoPlugin({
|
|
collections: ['pages'],
|
|
fields: ({ defaultFields }) => {
|
|
const modifiedFields = defaultFields.map((field) => {
|
|
if ('name' in field && field.name === 'title') {
|
|
return {
|
|
...field,
|
|
required: true,
|
|
admin: {
|
|
...field.admin,
|
|
components: {
|
|
...field.admin.components,
|
|
afterInput: '/components/AfterInput.js#AfterInput',
|
|
beforeInput: '/components/BeforeInput.js#BeforeInput',
|
|
},
|
|
},
|
|
} as Field
|
|
}
|
|
return field
|
|
})
|
|
|
|
return [
|
|
...modifiedFields,
|
|
{
|
|
name: 'ogTitle',
|
|
type: 'text',
|
|
label: 'og:title',
|
|
},
|
|
]
|
|
},
|
|
generateDescription,
|
|
generateTitle,
|
|
generateURL,
|
|
tabbedUI: true,
|
|
uploadsCollection: 'media',
|
|
}),
|
|
],
|
|
typescript: {
|
|
outputFile: path.resolve(dirname, 'payload-types.ts'),
|
|
},
|
|
})
|