3 files changed, 50 insertions, 26 deletions
diff --git a/examples/blog/src/pages/posts/index.md b/examples/blog/src/pages/posts/index.md
deleted file mode 100644
index e118d869d..000000000
--- a/examples/blog/src/pages/posts/index.md
+++ /dev/null
@@ -1,26 +0,0 @@
----
-setup: |
-  import Layout from '../../layouts/BlogPost.astro'
-  import Cool from '../../components/Author.astro'
-title: Hello world!
-publishDate: 12 Sep 2021
-name: Nate Moore
-value: 128
-description: Just a Hello World Post!
----
-
-<Cool name={frontmatter.name} href="https://twitter.com/n_moore" client:load />
-
-This is so cool!
-
-Do variables work {frontmatter.value * 2}?
-
-```javascript
-// Example JavaScript
-
-const x = 7;
-function returnSeven() {
-  return x;
-}
-
-```
diff --git a/examples/blog/src/pages/posts/interactive-content.md b/examples/blog/src/pages/posts/interactive-content.md
new file mode 100644
index 000000000..68c571eb4
--- /dev/null
+++ b/examples/blog/src/pages/posts/interactive-content.md
@@ -0,0 +1,22 @@
+---
+layout: "../../layouts/BlogPost.astro"
+title: "Hello galaxy of possibilities!"
+description: "Take your blog to astronomical heights"
+publishDate: "12 Sep 2021"
+followMe:
+  username: "bholmesdev"
+  href: "https://twitter.com/bholmesdev"
+halfTheMeaning: 21
+heroImage:
+  src: "/assets/blog/introducing-astro.jpg"
+  alt: "Space shuttle leaving curved trail in the sky"
+setup: |
+  import LikeButton from "../../components/LikeButton"
+  import FollowMe from "../../components/FollowMe.astro"
+---
+
+<FollowMe username={frontmatter.followMe.username} href={frontmatter.followMe.href} />
+
+Access all exported properties with JSX expressions. For example, let's find the meaning of life: **{frontmatter.halfTheMeaning * 2}**
+
+If this seems cool, consider giving my post a like with this Preact component: <LikeButton pageUrl={frontmatter.url} client:load />
diff --git a/examples/blog/src/pages/posts/static-content.md b/examples/blog/src/pages/posts/static-content.md
new file mode 100644
index 000000000..8925e6ba3
--- /dev/null
+++ b/examples/blog/src/pages/posts/static-content.md
@@ -0,0 +1,28 @@
+---
+layout: "../../layouts/BlogPost.astro"
+title: "Hello static content!"
+description: "Bring your markdown, we'll handle the rest"
+publishDate: "11 Jul 2022"
+heroImage:
+  src: "/assets/blog/introducing-astro.jpg"
+  alt: "Space shuttle leaving curved trail in the sky"
+---
+
+**Astro has built-in support for markdown pages!** All frontmatter data will be available [via `Astro.glob` imports](https://docs.astro.build/en/reference/api-reference/#astroglob) as well, making blog landing pages easy to build.
+
+**Code challenge:** Try editing the `title` frontmatter property for this post and [visiting the homepage](/) again.
+
+## Code block demo
+
+```typescript
+// Oh, and get Shiki syntax highlighting out-of-the-box!
+// See our docs for customization options:
+// https://docs.astro.build/en/guides/markdown-content/#syntax-highlighting
+function getDistance(amount: number) {
+  if (amount === Infinity) {
+    return "and beyond!";
+  } else {
+    return "and the normal distance!";
+  }
+}
+```