feat: (test) og:image support

This commit is contained in:
grassblock 2025-05-14 11:30:54 +08:00
parent 7ff2d1fd6c
commit 223719322f
8 changed files with 232 additions and 9 deletions

View file

@ -1,9 +1,9 @@
import { z } from 'astro:content';
export const posts = z.object({
export const posts = ({ image }:{image: ()=> z.ZodAny}) => z.object({
title: z.string(),
description: z.string(),
pubDate: z.coerce.date(),
updatedDate: z.coerce.date().optional(),
heroImage: z.string().optional()
cover: image().optional(),
});

View file

@ -10,6 +10,7 @@ interface Props {
title: string;
description: string;
path?: string;
ogImage: string;
}
const defaultTitle = siteConfig.title
@ -18,7 +19,7 @@ const formattedPath = defaultTitle.toLowerCase().replace(/\s+/g, '-');
const navBarItems = siteConfig.navBarItems
const customFooter = siteConfig.customFooter
const { title, path = formattedPath, description = siteConfig.description } = Astro.props;
const { title, path = formattedPath, description = siteConfig.description, ogImage = "" } = Astro.props;
// TODO: make the path dynamic
---
@ -29,7 +30,7 @@ const { title, path = formattedPath, description = siteConfig.description } = As
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="generator" content={Astro.generator} />
<Meta title={title} description={description}/>
<Meta title={title} description={description} ogImage={ogImage} />
<title>{title}</title>
</head>
<body>

View file

@ -14,12 +14,15 @@ const { entry } = Astro.props;
const { Content } = await entry.render();
const slug = Astro.params.slug;
const cover = entry.data.cover
//|| `/posts/${slug}/featured.webp` || `/posts/${slug}/featured.png` || `/posts/${slug}/featured.jpg`
---
<Layout
title={entry.data.title}
path={`~/grassblock/micr0blog/blog/${slug}`}
description={entry.data.description}
ogImage={cover}
>
<h1 class="post-title">{entry.data.title}</h1>
<span class="post-date">{new Date(entry.data.pubDate).toISOString().split('T')[0]}</span>