[Fix] Enhance the SEO effect for twitter card.

This commit is contained in:
PrinOrange
2024-08-12 11:09:58 +08:00
parent 6be43d9285
commit 4077f2e581

View File

@@ -1,42 +1,26 @@
import { RSSFeedURL, WebsiteURL } from "@/consts/consts"; import { RSSFeedURL } from "@/consts/consts";
import { Config } from "@/data/config"; import { Config } from "@/data/config";
import { NextSeo } from "next-seo"; import Head from "next/head";
export const SEO = (props: { title: string; description?: string | null; coverURL?: string | null }) => { type TSEOProps = { title: string; description?: string | null; coverURL?: string | null; smallTwitterCard?: boolean };
export const SEO = (props: TSEOProps) => {
return ( return (
<> <Head>
<title>{props.title}</title> <title>{props.title}</title>
<link href={RSSFeedURL} rel="alternate" type="application/rss+xml" /> <link href={RSSFeedURL} rel="alternate" type="application/rss+xml" />
<NextSeo
description={props.description ?? Config.Sentence} <meta content={props.coverURL ?? Config.PageCovers.websiteCoverURL} name="twitter:image" />
openGraph={{ <meta content={props.smallTwitterCard ? "summary" : "summary_large_image"} name="twitter:card" />
title: props.title, <meta content={`@${Config.SocialLinks.twitter}`} name="twitter:site" />
description: props.description ?? Config.Sentence, <meta content={`@${Config.SocialLinks.twitter}`} name="twitter:creator" />
images: props.coverURL <meta content={props.title} name="twitter:title" />
? [ <meta content={props.description ?? props.title} name="twitter:description" />
{
url: props.coverURL, <meta content={props.coverURL ?? Config.PageCovers.websiteCoverURL} name="og:image" />
width: 850, <meta content={props.description ?? props.title} name="og:image:alt" />
height: 650, <meta content={props.title} name="og:title" />
alt: props.title, <meta content={props.description ?? props.title} name="og:description" />
}, </Head>
]
: [
{
url: Config.PageCovers.websiteCoverURL,
width: 850,
height: 650,
alt: props.title,
},
],
}}
title={props.title}
twitter={{
handle: `@${Config.SocialLinks.twitter}`,
site: WebsiteURL,
cardType: "summary_large_image",
}}
/>
</>
); );
}; };