Setting Page Title and Description in Sanity using element previews

7 replies
Last updated: Mar 14, 2023
Does anyone have an example for setting Page Title and Page Description via sanity...or it has to be done for each component separately ? not using react-helmet --
Mar 14, 2023, 6:13 AM
user Q
, I think what you're looking for is element previews. You set these in the schema/s, just once for each type. You have a lot of freedom as to what you want to put in them, while the defaults show how it can be equally simple, such as the items you mention.
You'd need a way to pull a description from your item, which could be based on its content (first few lines if text, or a field in the item if you want to write this separately in the editor.

This documentation should explain, and good fortune:
https://www.sanity.io/docs/previews-list-views (edited)
Mar 14, 2023, 7:29 AM
Hey, thank you for the reply...no sure if i mentioned it correctly...i am talking about the page meta data...
Mar 14, 2023, 7:33 AM
well, unless I misunderstand, it would be the same method. Here's how it's done for pages in a blog schema -- look at the bottom lines about preview, select (which is how you can pull data from fields) and prepare (which lets you format it, also add info from other sources programmatically)

import {defineField, defineType} from 'sanity'


export default defineType({

name: 'post',

title: 'Post',

type: 'document',

fields: [

defineField({

name: 'title',

title: 'Title',

type: 'string',

}),

defineField({

name: 'slug',

title: 'Slug',

type: 'slug',

options: {

source: 'title',

maxLength: 96,

},

}),

defineField({

name: 'author',

title: 'Author',

type: 'reference',

to: {type: 'author'},

}),

defineField({

name: 'mainImage',

title: 'Main image',

type: 'image',

options: {

hotspot: true,

},

}),

defineField({

name: 'categories',

title: 'Categories',

type: 'array',

of: [{type: 'reference', to: {type: 'category'}}],

}),

defineField({

name: 'publishedAt',

title: 'Published at',

type: 'datetime',

}),

defineField({

name: 'body',

title: 'Body',

type: 'blockContent',

}),

],


preview: {

select: {

title: 'title',

author: 'author.name',

media: 'mainImage',

},

prepare(selection) {

const {author} = selection
`return {...selection, subtitle: author &&
by ${author}
}`
},

},

})
Mar 14, 2023, 7:56 AM
thanks mate..let me try this..:)
Mar 14, 2023, 7:58 AM
should do - I'll have a look in the morning πŸ™‚
Mar 14, 2023, 7:59 AM
πŸ˜‚
Mar 14, 2023, 7:59 AM
it's good to begin with..;)
Mar 14, 2023, 7:59 AM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?