jblu/jonbio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added canonicalUrl support

Browse Source
This commit is contained in:
Onur Geneş 2022-01-18 12:28:41 +03:00
parent 507d32ab9d
commit 25e82e58bf
5 changed files with 28 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -166,6 +166,7 @@ summary (optional)
images (optional, if none provided defaults to socialBanner in siteMetadata config)
authors (optional list which should correspond to the file names in `data/authors`. Uses `default` if none is specified)
layout (optional list which should correspond to the file names in `data/layouts`)
canonical (optional, canonical url for the post for SEO)
```
Here's an example of a post's frontmatter:
@ -181,6 +182,7 @@ summary: 'Looking for a performant, out of the box template, with all the best i
images: ['/static/images/canada/mountains.jpg', '/static/images/canada/toronto.jpg']
authors: ['default', 'sparrowhawk']
layout: PostLayout
canonical: https://tailwind-nextjs-starter-blog.vercel.app/blog/introducing-tailwind-nextjs-starter-blog
---
```

20
components/SEO.js
View File

@ -2,7 +2,7 @@ import Head from 'next/head'
import { useRouter } from 'next/router'
import siteMetadata from '@/data/siteMetadata'
const CommonSEO = ({ title, description, ogType, ogImage, twImage }) => {
const CommonSEO = ({ title, description, ogType, ogImage, twImage, canonicalUrl }) => {
const router = useRouter()
return (
<Head>
@ -24,6 +24,11 @@ const CommonSEO = ({ title, description, ogType, ogImage, twImage }) => {
<meta name="twitter:title" content={title} />
<meta name="twitter:description" content={description} />
<meta name="twitter:image" content={twImage} />
<link
rel="canonical"
href={canonicalUrl ? canonicalUrl : `${siteMetadata.siteUrl}${router.asPath}`}
key={'canonicalUrl'}
/>
</Head>
)
}
@ -67,7 +72,16 @@ export const TagSEO = ({ title, description }) => {
)
}
export const BlogSEO = ({ authorDetails, title, summary, date, lastmod, url, images = [] }) => {
export const BlogSEO = ({
authorDetails,
title,
summary,
date,
lastmod,
url,
images = [],
canonicalUrl,
}) => {
const router = useRouter()
const publishedAt = new Date(date).toISOString()
const modifiedAt = new Date(lastmod || date).toISOString()
@ -133,11 +147,11 @@ export const BlogSEO = ({ authorDetails, title, summary, date, lastmod, url, ima
ogType="article"
ogImage={featuredImages}
twImage={twImageUrl}
canonicalUrl={canonicalUrl}
/>
<Head>
{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={{

2
data/blog/introducing-tailwind-nextjs-starter-blog.mdx
View File

@ -146,6 +146,7 @@ summary (optional)
images (optional, if none provided defaults to socialBanner in siteMetadata config)
authors (optional list which should correspond to the file names in `data/authors`. Uses `default` if none is specified)
layout (optional list which should correspond to the file names in `data/layouts`)
canonical (optional, canonical url for the post for SEO)
```
Here's an example of a post's frontmatter:
@ -161,6 +162,7 @@ summary: 'Looking for a performant, out of the box template, with all the best i
images: ['/static/images/canada/mountains.jpg', '/static/images/canada/toronto.jpg']
authors: ['default', 'sparrowhawk']
layout: PostLayout
canonical: https://tailwind-nextjs-starter-blog.vercel.app/blog/introducing-tailwind-nextjs-starter-blog
---
```

1
data/blog/new-features-in-v1.mdx → data/blog/new-features-in-v1-canonical.mdx
View File

@ -7,6 +7,7 @@ draft: false
summary: 'An overview of the new features released in v1 - code block copy, multiple authors, frontmatter layout and more'
layout: PostSimple
bibliography: references-data.bib
canonicalUrl: https://example.com/
---
## Overview

6
scripts/compose.js
View File

@ -40,6 +40,7 @@ const genFrontMatter = (answers) => {
summary: ${answers.summary ? answers.summary : ' '}
images: []
layout: ${answers.layout}
canonical: ${answers.canonical}
`
if (answers.authors.length > 0) {
@ -92,6 +93,11 @@ inquirer
type: 'list',
choices: getLayouts,
},
{
name: 'canonical',
message: 'Enter canonical url:',
type: 'input',
},
])
.then((answers) => {
// Remove special characters and replace space with -