gb/mercury
Template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Activity Actions

feat: generate og:image when there isn't one

Browse source
This commit is contained in:
grassblock 2025-05-14 22:21:59 +08:00
parent 65032ab2fc
commit 9e7318fb63
2 changed files with 73 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/pages/post/[...slug].astro
View file

@ -3,6 +3,10 @@ import Layout from '../../layouts/Layout.astro';
import { getCollection } from 'astro:content';
import Comments from "../../components/Comments.astro";
import {getImage} from "astro:assets";
import { unified } from "unified";
import { select } from "unist-util-select";
import remarkMdx from "remark-mdx";
import remarkParse from "remark-parse";
export async function getStaticPaths() {
const blogEntries = await getCollection('posts');
@ -14,16 +18,19 @@ export async function getStaticPaths() {
const { entry } = Astro.props;
const { Content } = await entry.render();
const slug = Astro.params.slug;
// get featured image and use it as og:image
// use the custom cover image if it exists, otherwise use the featured image file in the same directory
const featuredImages = import.meta.glob(`/src/content/posts/*/featured.*`,{import:'default',eager:true});
const customFeaturedImage = entry.data.cover?.src
const matchedImage = Object.keys(featuredImages).find(path => path.includes(slug));
let matchedImage_src;
if (matchedImage) {
if (matchedImage && !customFeaturedImage) {
matchedImage_src = await getImage({src: featuredImages[matchedImage], format: 'webp'}) || null;
}
const cover = entry.data.cover || matchedImage_src?.src || `/post/${slug}/og.webp`;
//|| `/posts/${slug}/featured.webp` || `/posts/${slug}/featured.png` || `/posts/${slug}/featured.jpg`
const cover = customFeaturedImage || matchedImage_src?.src || `/post/${slug}/featured.png` || '';
---
<Layout