diff --git a/scripts/plop/plopfile.js b/scripts/plop/plopfile.js
index 4b4e0c5c..601826c3 100644
--- a/scripts/plop/plopfile.js
+++ b/scripts/plop/plopfile.js
@@ -47,15 +47,9 @@ export default function (plop) {
       },
       {
         type: 'add',
-        path: '../../docs/components/{{ tagWithoutPrefix tag }}.md',
+        path: '../../docs/pages/components/{{ tagWithoutPrefix tag }}.md',
         templateFile: 'templates/component/docs.hbs'
       },
-      {
-        type: 'modify',
-        path: '../../docs/_sidebar.md',
-        pattern: /<!--plop:component-->/,
-        template: `- [{{ tagToTitle tag }}](/components/{{ tagWithoutPrefix tag }})\n  <!--plop:component-->`
-      },
       {
         type: 'modify',
         path: '../../src/shoelace.ts',
diff --git a/scripts/plop/templates/component/docs.hbs b/scripts/plop/templates/component/docs.hbs
index 38ee5dab..1970af10 100644
--- a/scripts/plop/templates/component/docs.hbs
+++ b/scripts/plop/templates/component/docs.hbs
@@ -1,8 +1,9 @@
-# {{ tagToTitle tag }}
-
-[component-header:{{ tag }}]
-
-A description of the component goes here.
+---
+meta:
+  title: {{ tagToTitle tag }}
+  description:
+layout: component
+---
 
 ```html preview
 <{{ tag }}></{{ tag }}>