Adding to TinaCMS collection
Where to go next after you downloaded the component from Tina registry.
Prerequisites
Clone the starter template from Getting Started section.
Steps
- Add
<YourComponent />
to template section insidetina/collection/page.ts
folder.
const Page: Collection = {
//...
fields: [
{
type: "object",
list: true,
name: "blocks",
label: "Sections",
ui: {
visualSelector: true,
},
templates: [yourComponentSchema],
},
],
};
- To make it render, you need to add the component to the switch case inside
components/blocks/index.tsx
file.
const Block = (block: PageBlocks) => {
switch (block.__typename) {
// ...
case "PageBlocksYourComponent":
return <YourComponent data={block} />;
default:
return null;
}
};