diff --git a/next.config.mjs b/next.config.mjs
index 017d7c80..7c5884af 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -3,6 +3,7 @@ import { withFaust, getWpHostname } from "@faustwp/core";
 import createMDX from "@next/mdx";
 import { transformerNotationDiff } from "@shikijs/transformers";
 import { createSecureHeaders } from "next-secure-headers";
+import recmaNextjsStaticProps from "recma-nextjs-static-props";
 import rehypeCallouts from "rehype-callouts";
 import rehypeMdxImportMedia from "rehype-mdx-import-media";
 import { rehypePrettyCode } from "rehype-pretty-code";
@@ -70,6 +71,7 @@ const nextConfig = {
 
 const withMDX = createMDX({
 	options: {
+		recmaPlugins: [recmaNextjsStaticProps],
 		remarkPlugins: [remarkGfm],
 		rehypePlugins: [
 			rehypeMdxImportMedia,
diff --git a/package.json b/package.json
index de5f4510..ee169e85 100644
--- a/package.json
+++ b/package.json
@@ -36,6 +36,7 @@
 		"next": "^15.1.1",
 		"react": "^19.0.0",
 		"react-dom": "^19.0.0",
+		"recma-nextjs-static-props": "^2.0.1",
 		"rehype-callouts": "^1.3.0",
 		"rehype-mdx-import-media": "^1.2.0",
 		"rehype-pretty-code": "^0.14.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 166ed7c8..f8281ee4 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -74,6 +74,9 @@ importers:
       react-dom:
         specifier: ^19.0.0
         version: 19.0.0(react@19.0.0)
+      recma-nextjs-static-props:
+        specifier: ^2.0.1
+        version: 2.0.1
       rehype-callouts:
         specifier: ^1.3.0
         version: 1.3.0
@@ -3184,6 +3187,9 @@ packages:
     resolution: {integrity: sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==}
     engines: {node: '>=0.10.0'}
 
+  is-reference@3.0.3:
+    resolution: {integrity: sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==}
+
   is-regex@1.2.1:
     resolution: {integrity: sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==}
     engines: {node: '>= 0.4'}
@@ -3941,6 +3947,9 @@ packages:
   peberminta@0.9.0:
     resolution: {integrity: sha512-XIxfHpEuSJbITd1H3EeQwpcZbTLHc+VVr8ANI9t5sit565tsI4/xK3KWTUFE2e6QiangUkh3B0jihzmGnNrRsQ==}
 
+  periscopic@3.1.0:
+    resolution: {integrity: sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==}
+
   picocolors@1.1.1:
     resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
 
@@ -4200,6 +4209,9 @@ packages:
   recma-jsx@1.0.0:
     resolution: {integrity: sha512-5vwkv65qWwYxg+Atz95acp8DMu1JDSqdGkA2Of1j6rCreyFUE/gp15fC8MnGEuG1W68UKjM6x6+YTWIh7hZM/Q==}
 
+  recma-nextjs-static-props@2.0.1:
+    resolution: {integrity: sha512-XNQmiJYLcIzm130clZM0rzcGnAz9xhO6YX1z7vJIoE6Ve//+vxOtvES++MvwPpnGoIpPVP4V3nGCgt6ROsq2gw==}
+
   recma-parse@1.0.0:
     resolution: {integrity: sha512-OYLsIGBB5Y5wjnSnQW6t3Xg7q3fQ7FWbw/vcXtORTnyaSFscOtABg+7Pnz6YZ6c27fG1/aN8CjfwoUEUIdwqWQ==}
 
@@ -8941,6 +8953,10 @@ snapshots:
     dependencies:
       isobject: 3.0.1
 
+  is-reference@3.0.3:
+    dependencies:
+      '@types/estree': 1.0.6
+
   is-regex@1.2.1:
     dependencies:
       call-bound: 1.0.3
@@ -9985,6 +10001,12 @@ snapshots:
 
   peberminta@0.9.0: {}
 
+  periscopic@3.1.0:
+    dependencies:
+      '@types/estree': 1.0.6
+      estree-walker: 3.0.3
+      is-reference: 3.0.3
+
   picocolors@1.1.1: {}
 
   picomatch@2.3.1: {}
@@ -10188,6 +10210,12 @@ snapshots:
     transitivePeerDependencies:
       - acorn
 
+  recma-nextjs-static-props@2.0.1:
+    dependencies:
+      '@types/estree': 1.0.6
+      periscopic: 3.1.0
+      unified: 11.0.5
+
   recma-parse@1.0.0:
     dependencies:
       '@types/estree': 1.0.6
diff --git a/src/components/docs-layout.jsx b/src/components/docs-layout.jsx
index 4f9d04cd..9ea471a3 100644
--- a/src/components/docs-layout.jsx
+++ b/src/components/docs-layout.jsx
@@ -9,7 +9,7 @@ import DocsNav from "@/components/docs-nav";
 import routes from "@/pages/docs/nav.json";
 import "rehype-callouts/theme/vitepress";
 
-export default function DocumentPage({ children }) {
+export default function DocumentPage({ children, metadata }) {
 	return (
 		<>
 			<Disclosure
@@ -33,6 +33,9 @@ export default function DocumentPage({ children }) {
 					<OnThisPageNav>{children}</OnThisPageNav>
 				</nav>
 				<article className="container-main prose prose-invert min-h-[calc(100vh-120px)] max-w-[80ch] py-14 md:py-24">
+					{metadata?.title && (
+						<h1 className="article-title">{metadata.title}</h1>
+					)}
 					{children}
 				</article>
 			</main>