This article exists for one reason: to push every custom block and every inline mark through the markdown → Sanity pipeline at once. If something renders wrong, it shows up here first. Read it once after upload and you've smoke-tested the whole content surface.
We'll cover headings, lists, tables, callouts, quotes, images, galleries, videos, embeds, FAQs, and inline CTAs. Plus the usual marks: bold, italic, inline code, underline, strikethrough, an external link, and an internal link to another article.
- Goal: render every supported block in one page.
- Why: any rendering regression in the article template surfaces here in one upload.
- How to use it: push this file, open
/blog/elements-showcase, scroll top-to-bottom.
Headings and prose
A regular paragraph below an H2. Heym articles use serif body type, sans-serif headings, and the prose plugin handles default spacing. Long-enough paragraphs should wrap inside the 680px center column without crowding the sidebar TOC.
A third-level heading
Below an H3, paragraphs stay tight to the heading. The TOC in the sidebar picks up H2 and H3 entries automatically (H3 indents). Anchor links are generated from the heading text via textToId.
A fourth-level heading
H4 is rendered but does not appear in the table of contents. Use it for sub-sub-points inside long sections.
Lists
Ordered list — for sequences where order matters:
- Capture the thought into Heym.
- Tag it with the right Area.
- Decide whether it's a goal, a habit, or a task.
- Schedule it, or let it sit in the inbox until you do.
Unordered list — for parallel items:
- Areas anchor the why.
- Goals translate why into what.
- Habits convert what into when.
- Tasks turn when into now.
Nested list — lists inside lists work too:
- Strategy
- Life vision
- Yearly goals
- Execution
- Habits
- Tasks for today
A blockquote
The block-quote element supports both an attribution (author) and a quote body. Use it sparingly; one per article is usually enough.
A table
Tables come through the portableTable plugin. Cells can hold inline markdown — bold, italics, code, links — but not block-level content like lists or images.
Layer | Time horizon | Question it answers |
|---|---|---|
Life vision | 5–10 years | Who am I becoming? |
Goals | 3–12 months | What needs to be true by then? |
Habits | Daily / weekly | What do I repeat to get there? |
Tasks | Today | What's the next concrete step? |
A single image
Inline images are wrapped in a figure with the alt text doubling as caption fallback. The Sanity upload script reads the src filename from content/image-sources/ and uploads it as an asset.
An image gallery
Galleries group several images in a single carousel/grid block:
A YouTube embed
The id is the bare video ID (the bit after v= in a YouTube URL). The component renders a responsive 16:9 iframe.
Inline content button
Sometimes a paragraph wants a single inline CTA, not a full card. That's what content-button is for:
Use it between paragraphs to nudge the reader to a specific next step.
Full content CTA
For a more prominent in-body CTA — typically once per article, around the two-thirds mark — use content-cta:
The component's content is fixed in code (it's not driven by article text), so the markdown only carries the toggle. Set hidden="true" to suppress on a per-article basis.
Frequently asked questions
Pipeline FAQ
What happens if an image file is missing from content/image-sources?
Can I edit this article directly in Sanity Studio after pushing?
Do FAQ items support markdown?
Will the TOC show this FAQ heading?
Closing paragraph
If you reached this point with everything rendered correctly — headings spaced right, marks coloured, table laid out, images and video loaded, FAQ items expandable, CTAs on-brand — the pipeline is healthy. If anything looked off, the culprit is usually one of three things: an unmapped portable-text component in PortableTextComponents.tsx, a missing tag handler in push-content.ts, or an asset that didn't exist in content/image-sources/.