Create a New Template

Set up our Structured Sections

1. Create an app/amazing-header/ folder

2. Add an amazing-header.template.tsx file in that folder

3. Add the following code to the amazing-header.template.tsx file:

The name of the file is arbitrary, but the TinaCMS team use (and recommend) the .template.tsx suffix for clarity.

Our block is pretty basic right now - we only have 1 field. But you can see how, in a real-world application, defining many fields in a block would be super useful!

Think of a Hero banner, which would want a background image, a CTA, and perhaps even a button link.

4. Now repeat this for the beautiful image and the incredible body!

You should end up with something like this: