I'm working with the
template-website
template, looking a the header global section is it possible to add a label to the row. It'll be easier to understand from looking at the image. The reason I want to do this is to make it easier to reorder the row items as you will be able to see the name of the nav item,
I believe what you are looking for is the
label
property for the
collapsible
field:
https://payloadcms.com/docs/fields/collapsible#exampleHi, thanks for the reply. I don't think there is a collapsible field, well I can't find one. I mistakenly thought it was a row field but looking again i think it may be a group, not too sure. This is the file in question, I should have posted this first
https://github.com/payloadcms/template-website/blob/main/src/fields/link.ts@magneze909 I think what you're looking for is the array admin config for
RowLabel
, you can basically override the React component for it with custom data
https://payloadcms.com/docs/fields/array#admin-config
Here's a more full code example from an older codebase I have
admin: {
components: {
/* @ts-ignore */
RowLabel: ({ data, index }) => {
return `Item ${String(index).padStart(2, '0')}: ${data?.label ?? ''}`
},
},
initCollapsed: true,
},
A bit complex but inside
data
you can inspect it via your console and see the full object you have access to, in my example im naming it Item + a number and the
label
from data if it exists
This is added on the
array
field itself
I think in that template it'll be inside
Header.ts
@paulpopus thanks Paul, you're spot on. Not sure how easy it will be getting the label in there though. I will take a look in a bit. Very useful to know this though for future reference. Thanks!
Awesome! was actually pretty easy. Logging the object allowed me to find the label no problem
${data.link.label}
thanks again for your help
Star
Discord
online
Get help straight from the Payload team with an Enterprise License.