diff --git a/src/lib/lists/blog-gallery.svelte b/src/lib/lists/blog-gallery.svelte
new file mode 100644
index 0000000..e41239f
--- /dev/null
+++ b/src/lib/lists/blog-gallery.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+    import { BlogPostTag, type BlogPostLink } from "../../routes/blog/posts";
+
+    let {
+        posts,
+    }: {
+        posts: BlogPostLink[];
+    } = $props();
+</script>
+
+<div class="entry-container">
+    {#each posts as post}
+        <div class="entry">
+            <p>{post.post.title}</p>
+            {#each post.post.tags as tag}
+                <p>{tag}</p>
+            {/each}
+        </div>
+    {/each}
+</div>
\ No newline at end of file
diff --git a/src/routes/blog/+page.svelte b/src/routes/blog/+page.svelte
index a90ba71..3202f21 100644
--- a/src/routes/blog/+page.svelte
+++ b/src/routes/blog/+page.svelte
@@ -1,26 +1,27 @@
 <script lang="ts">
     import Banner2 from "$lib/banner2.svelte";
     import Content from "$lib/viewport/content.svelte";
-    import Gallery, { type GalleryEntry } from "$lib/lists/gallery.svelte";
+    // import Gallery, { type GalleryEntry } from "$lib/lists/gallery.svelte";
     import { posts, type BlogPostLink } from "./posts";
+    import BlogGallery from "$lib/lists/blog-gallery.svelte";
     
-    let entries: GalleryEntry[] = posts.map(mapEntries);
+    // let entries: GalleryEntry[] = posts.map(mapEntries);
 
-    function mapEntries(entry: BlogPostLink, index: number): GalleryEntry {
-        let banner = "";
-        if (entry.post.banner && entry.post.banner !== "") {
-            banner = `/blog/${entry.key}/${entry.post.banner}`;
-        }
+    // function mapEntries(entry: BlogPostLink, index: number): GalleryEntry {
+    //     let banner = "";
+    //     if (entry.post.banner && entry.post.banner !== "") {
+    //         banner = `/blog/${entry.key}/${entry.post.banner}`;
+    //     }
 
-        return {
-            title: `${entry.post.title}`,
-            subtitle: `#${(posts.length - index).toString().padStart(2, '0')} // ${entry.post.date}, ${entry.post.time}`,
-            img: banner,
-            link: `/blog/${entry.key}/`,
-            imgAlt: `Preview image for ${entry.post.title}`,
-            description: entry.post.description,
-        };
-    }
+    //     return {
+    //         title: `${entry.post.title}`,
+    //         subtitle: `#${(posts.length - index).toString().padStart(2, '0')} // ${entry.post.date}, ${entry.post.time}`,
+    //         img: banner,
+    //         link: `/blog/${entry.key}/`,
+    //         imgAlt: `Preview image for ${entry.post.title}`,
+    //         description: entry.post.description,
+    //     };
+    // }
 </script>
 
 <svelte:head>
@@ -33,5 +34,5 @@
         banner="robert.webp"
         bannerAlt="View at a tram bridge rising and then curving to the left." />
 
-    <Gallery entries={entries} />
+    <BlogGallery {posts} />
 </Content>
\ No newline at end of file
diff --git a/src/routes/blog/posts.ts b/src/routes/blog/posts.ts
index 17e6a76..a386ef0 100644
--- a/src/routes/blog/posts.ts
+++ b/src/routes/blog/posts.ts
@@ -24,10 +24,10 @@ export interface BlogPostLink {
 }
 
 export enum BlogPostTag {
-	ART, // ramblings to do with art
-	DRAWING, // self-explanatory
-	TECH_TIP, // tech guides
-	META, // about the website itself
+	ART = "art-stuff", // ramblings to do with art
+	DRAWING = "drawing", // self-explanatory
+	TECH_TIP = "tech-tip", // tech guides
+	META = "natconf-meta", // about the website itself
 }