Markdown Feature Showcase

This seeded article is a single place to demonstrate the blog frontend's current Markdown capabilities: citations like [1], article cross-references, table captions, callouts, code fences, and rich text formatting.

Callout showcase

The examples below show the built-in GitHub-style callout types plus the fallback rendering for a custom label.

Text and links

The article body can mix strong text, emphasis, inline code, and ordinary links such as Payload CMS docs.

Once a publishing system supports references, labeled figures, captioned tables, and structured code blocks, it starts behaving more like technical publishing than plain blogging.

Lists and callouts

• Unordered lists summarize capabilities quickly.
• Ordered lists work well for sequences.
• Callouts help surface context and constraints.

1. Draft the content.
2. Insert references.
3. Verify that every in-article reference resolves correctly.

Figures, tables, and cross-references

The [Figure 1] and [Table 1] references below demonstrate article anchors for labeled images and captioned tables.

Controlled component rendering

The examples below use a JSX-like surface, but they do not execute arbitrary React code. They are mapped onto a small whitelist of built-in frontend components.

Code blocks

The fenced tsx block below should render as a labeled code block rather than an executed component.

tsxexport function NoticeCard({ title }: { title: string }) {
  return (
    <section className="notice-card">
      <h3>{title}</h3>
      <p>This remains a code example rather than executable JSX.</p>
    </section>
  )
}

Wrap-up

If you need a single article that exercises headings, citations, labeled figures, captioned tables, callouts, rich text, and code fences, this is the seeded system showcase.