文章内添加元数据#

在文章头部元数据设置中添加自定义的，如：imageShow，用于控制是否显示封面图

1
---
2
imageShow: true
3
---

新增元数据类型#

在 src/content/config.ts 文件中添加一行对应的元数据类型，并设置为boolean属性且默认为true，意思就是默认为显示图片

1
const postsCollection = defineCollection({
2
  schema: z.object({
3
    // ...忽略其他多余代码...
4
    imageShow: z.boolean().optional().default(true), // 添加这个自定义属性
5
  }),
6
});

修改判断条件#

在 src/pages/posts/[...slug].astro 文件中，大概100行找到这行代码，并添加一个判断image是否也为true的条件

1
<!-- entry.data.imageShow && -->
2
{entry.data.image && entry.data.imageShow &&
3
  <ImageWrapper id="post-cover" src={entry.data.image} basePath={path.join("content/posts/", getDir(entry.id))} class="mb-8 rounded-xl banner-container onload-animation"/>
4
}