Build a Team Members page in 10 minutes
Step by step, no code. By the end you will have a live page that lists every team member you add, in the order you choose.
Before you start
Build it step by step
Open the Content Lists section
Click Content Lists in the left sidebar. You land on /content-lists.
Pick the Team Members starting point
The empty state offers a few ready-made structures. Choose Team Members. Mirin creates the list, its default fields (Name, Role, Photo, Bio), and a sample record so you see the shape right away.
Replace the sample with a real entry
Click the sample row to open the record editor. Fill in Name and Role. The form autosaves about a second after you stop typing. Watch the “Saving… → Saved” pill in the top-right.
Upload the photo
Click into the Photo field and drop in a headshot. Add alt text for screen readers unless the image is purely decorative.
Add more team members
Click ← Content Lists, then New entry. Each takes about 30 seconds and renders in the order you set.
Drop the Team Members component on a page
In the page builder, drop in the Team Members Grid component. It already reads from your team-members list, so there is nothing to configure.
Publish
Hit Publish. Within seconds your live site shows the team members you added. Edit a record later and the change reaches the live page in a couple of seconds, no republish needed.
What if a record is in draft?
Drafts do not appear on the live site. If you visit the URL while logged in as the site owner, you see a yellow Viewing draft banner so you always know what you are looking at.
Common questions
I deleted a field by accident.
You have 30 days to restore it. Open the list’s schema rail, click Recently deleted, then Restore.
Someone else edited the same record.
You see an amber banner with “Reload from server”. Reload, redo your edit, and save again. Mirin detects the conflict so you never silently overwrite someone else’s work.
Next
Developer guide →
Build a component that reads from a content list.