diff --git a/docs/reference/default-theme-layout.md b/docs/reference/default-theme-layout.md
index 27426e9c..246e20fa 100644
--- a/docs/reference/default-theme-layout.md
+++ b/docs/reference/default-theme-layout.md
@@ -36,3 +36,27 @@ Option `home` will generate templated "Homepage". In this layout, you can set ex
## No Layout
If you don't want any layout, you can pass `layout: false` through frontmatter. This option is helpful if you want a fully-customizable landing page (without any sidebar, navbar, or footer by default).
+
+## Custom Layout
+
+You can also use a custom layout:
+
+```md
+---
+layout: foo
+---
+```
+
+This will look for a component named `foo` registered in context. For example, you can register your component globally in `.vitepress/theme/index.ts`:
+
+```ts
+import DefaultTheme from 'vitepress/theme'
+import Foo from './Foo.vue'
+
+export default {
+ extends: DefaultTheme,
+ enhanceApp({ app }) {
+ app.component('foo', Foo)
+ }
+}
+```
diff --git a/src/client/theme-default/components/VPContent.vue b/src/client/theme-default/components/VPContent.vue
index 675414c2..a1479dc6 100644
--- a/src/client/theme-default/components/VPContent.vue
+++ b/src/client/theme-default/components/VPContent.vue
@@ -35,6 +35,11 @@ const { hasSidebar } = useSidebar()
+
+