Merge pull request #93 from Music47ell/v1

Add JSON-LD with Article structured data support
This commit is contained in:
Timothy 2021-06-27 11:15:07 +08:00 committed by GitHub
commit 3087e78496
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 50 additions and 3 deletions

View File

@ -24,7 +24,7 @@ export const PageSeo = ({ title, description }) => {
)
}
export const BlogSeo = ({ title, summary, date, lastmod, images = [] }) => {
export const BlogSeo = ({ authorDetails, title, summary, date, lastmod, url, images = [] }) => {
const router = useRouter()
const publishedAt = new Date(date).toISOString()
const modifiedAt = new Date(lastmod || date).toISOString()
@ -37,11 +37,49 @@ export const BlogSeo = ({ title, summary, date, lastmod, images = [] }) => {
const featuredImages = imagesArr.map((img) => {
return {
'@type': 'ImageObject',
url: `${siteMetadata.siteUrl}${img}`,
alt: title,
}
})
let authorList
if (authorDetails) {
authorList = authorDetails.map((author) => {
return {
'@type': 'Person',
name: author.name,
}
})
} else {
authorList = {
'@type': 'Person',
name: siteMetadata.author,
}
}
const structuredData = {
'@context': 'https://schema.org',
'@type': 'Article',
mainEntityOfPage: {
'@type': 'WebPage',
'@id': url,
},
headline: title,
image: featuredImages,
datePublished: publishedAt,
dateModified: modifiedAt,
author: authorList,
publisher: {
'@type': 'Organization',
name: siteMetadata.author,
logo: {
'@type': 'ImageObject',
url: `${siteMetadata.siteUrl}${siteMetadata.siteLogo}`,
},
},
description: summary,
}
return (
<>
<Head>
@ -64,6 +102,10 @@ export const BlogSeo = ({ title, summary, date, lastmod, images = [] }) => {
{date && <meta property="article:published_time" content={publishedAt} />}
{lastmod && <meta property="article:modified_time" content={modifiedAt} />}
<link rel="canonical" href={`${siteMetadata.siteUrl}${router.asPath}`} />
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(structuredData, null, 2) }}
/>
</Head>
</>
)

View File

@ -6,6 +6,7 @@
"language": "en-us",
"siteUrl": "https://tailwind-nextjs-starter-blog.vercel.app",
"siteRepo": "https://github.com/timlrx/tailwind-nextjs-starter-blog",
"siteLogo": "/static/images/logo.png",
"image": "/static/images/avatar.png",
"socialBanner": "/static/images/twitter-card.png",
"email": "address@yoursite.com",

View File

@ -19,7 +19,11 @@ export default function PostLayout({ frontMatter, authorDetails, next, prev, chi
return (
<SectionContainer>
<BlogSeo url={`${siteMetadata.siteUrl}/blog/${slug}`} {...frontMatter} />
<BlogSeo
url={`${siteMetadata.siteUrl}/blog/${slug}`}
authorDetails={authorDetails}
{...frontMatter}
/>
<article>
<div className="xl:divide-y xl:divide-gray-200 xl:dark:divide-gray-700">
<header className="pt-6 xl:pb-6">

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB