Merge pull request #344 from onurgenes/master

timlrx · web-flow · commit b4afda64ae0e · 2022-02-11T22:37:37.000+08:00
added canonicalUrl support
diff --git a/README.md b/README.md
@@ -178,6 +178,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`)
+canonicalUrl (optional, canonical url for the post for SEO)
 ```
 
 Here's an example of a post's frontmatter:
@@ -193,6 +194,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
+canonicalUrl: https://tailwind-nextjs-starter-blog.vercel.app/blog/introducing-tailwind-nextjs-starter-blog
 ---
 ```
 
diff --git a/components/SEO.js b/components/SEO.js
@@ -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,10 @@ 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}`}
+      />
     </Head>
   )
 }
@@ -67,7 +71,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 +146,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={{
diff --git a/data/blog/introducing-tailwind-nextjs-starter-blog.mdx b/data/blog/introducing-tailwind-nextjs-starter-blog.mdx
@@ -149,6 +149,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`)
+canonicalUrl (optional, canonical url for the post for SEO)
 ```
 
 Here's an example of a post's frontmatter:
@@ -164,6 +165,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
+canonicalUrl: https://tailwind-nextjs-starter-blog.vercel.app/blog/introducing-tailwind-nextjs-starter-blog
 ---
 ```
 
diff --git a/data/blog/new-features-in-v1.mdx b/data/blog/new-features-in-v1.mdx
@@ -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://tailwind-nextjs-starter-blog.vercel.app/blog/new-features-in-v1/
 ---
 
 ## Overview
diff --git a/package-lock.json b/package-lock.json
diff --git a/scripts/compose.js b/scripts/compose.js
@@ -40,6 +40,7 @@ const genFrontMatter = (answers) => {
   summary: ${answers.summary ? answers.summary : ' '}
   images: []
   layout: ${answers.layout}
+  canonicalUrl: ${answers.canonicalUrl}
   `
 
   if (answers.authors.length > 0) {
@@ -92,6 +93,11 @@ inquirer
       type: 'list',
       choices: getLayouts,
     },
+    {
+      name: 'canonicalUrl',
+      message: 'Enter canonical url:',
+      type: 'input',
+    },
   ])
   .then((answers) => {
     // Remove special characters and replace space with -
diff --git a/scripts/generate-sitemap.js b/scripts/generate-sitemap.js
@@ -29,6 +29,9 @@ const siteMetadata = require('../data/siteMetadata')
                   if (fm.data.draft) {
                     return
                   }
+                  if (fm.data.canonicalUrl) {
+                    return
+                  }
                 }
                 const path = page
                   .replace('pages/', '/')

Original file line number	Diff line number	Diff line change
`@@ -29,6 +29,9 @@ const siteMetadata = require('../data/siteMetadata')`
`29`	`29`	`if (fm.data.draft) {`
`30`	`30`	`return`
`31`	`31`	`}`
	`32`	`+ if (fm.data.canonicalUrl) {`
	`33`	`+ return`
	`34`	`+ }`
`32`	`35`	`}`
`33`	`36`	`const path = page`
`34`	`37`	`.replace('pages/', '/')`