Documentation

Content Authoring Examples

Practical MDX examples for metadata, Markdown blocks, approved components, media, calls to action, and chart embeds.

This page demonstrates the MDX body patterns available to content authors. Use it as a copy-ready reference when adding documentation, guide, or resource body content.

Authoring contract

MDX files must include validated frontmatter, use approved components, and keep chart data in the supported row, slice, item, or structured data shapes.

Markdown blocks

Use standard Markdown for editorial content:

Short paragraphs for explanation.
Bulleted lists for scanning.
Numbered lists for ordered workflows.
Tables for compact comparisons.
Code fences for configuration snippets.

| Field | Required | Purpose | | ------------- | -------- | ------------------------------------------------------------------ | | title | Yes | Page heading and fallback SEO title. | | description | Yes | Summary used by layouts and metadata. | | layout | No | article for editorial pages or landing for structured pages. | | seo | No | Search-specific title, description, canonical URL, and image data. |

title: Example Page
description: A concise page summary.
layout: article
seo:
  canonicalUrl: /docs/example-page

Feature cards

Feature grids are useful for documenting a set of related capabilities.

Metadata

Frontmatter controls routing, page titles, descriptions, canonical URLs, dates, actions, and media references.

Components

Approved components provide callouts, buttons, surfaces, layout primitives, and chart embeds without exposing arbitrary application code.

Charts

Chart adapter components accept JSON strings or arrays and validate numeric values before rendering.

Actions and layout primitives

Surface, Stack, and Cluster let authors create compact emphasis blocks while keeping spacing aligned to the design system.

Read content operations

View platform overview

Media

Use MediaImage when a body image needs a caption or credit.

Example content authoring preview — Example image metadata includes alt text, size, caption, and credit. Platform content team.

Cartesian chart embeds

Line, bar, and area charts use the same xKey, series, and rows shape.

Slice and comparison embeds

Pie and donut charts use slices. Comparison charts use labeled items.

Channel readiness

DocsAuthoring guidance and examples.

ResourcesReusable resource records.

SolutionsStructured landing pages.

Channel readiness data
Item	Score
Docs	82
Resources	68
Solutions	74

Metric cards

Use MetricCard for a single headline value.

Example validation pass rate100%+12%

Sample fixtures load through the MDX provider.