From 2cd75f3e34294656cce66e6bd32105e4032174e3 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Mon, 6 Dec 2021 17:29:38 +0800
Subject: [PATCH] =?UTF-8?q?feature:=20SEO=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 blog.config.js               |  6 +++---
 components/BlogPostCard.js   |  4 ++--
 components/InfoCard.js       | 15 ++++++---------
 components/NavBar.js         |  2 +-
 components/RecommendPosts.js |  2 +-
 components/SideBar.js        |  2 +-
 components/TopNav.js         |  2 +-
 package.json                 |  2 ++
 pages/404.js                 |  2 +-
 pages/_app.js                |  2 +-
 pages/article/[slug].js      |  6 +++---
 11 files changed, 22 insertions(+), 23 deletions(-)

diff --git a/blog.config.js b/blog.config.js
index 4480601e..6b570fd8 100644
--- a/blog.config.js
+++ b/blog.config.js
@@ -1,9 +1,9 @@
 const BLOG = {
-  title: '塘里1024',
-  author: '塘里',
+  title: '塘里独立博客',
+  author: '塘里1024',
   email: 'tlyong1992@hotmail.com',
   link: 'https://tangly1024.com',
-  description: '分享有趣的技术与思考',
+  description: '欢迎访问塘里1024的博客，这里主要是关于编程技术与投资理财相关的思考。我的本职是一名程序员、写博客是我的业余爱好',
   lang: 'zh-CN', // ['zh-CN','en-US'] default lang => see /lib/lang.js for more.
   notionPageId: process.env.NOTION_PAGE_ID || 'bee1fccfa3bd47a1a7be83cc71372d83', // Important page_id！！！
   notionAccessToken: process.env.NOTION_ACCESS_TOKEN || '', // Useful if you prefer not to make your database public
diff --git a/components/BlogPostCard.js b/components/BlogPostCard.js
index 589b613e..56b05e23 100644
--- a/components/BlogPostCard.js
+++ b/components/BlogPostCard.js
@@ -30,9 +30,9 @@ const BlogPostCard = ({ post, tags }) => {
         </div>
 
         <Link href={`${BLOG.path}/article/${post.slug}`} passHref>
-          <div className='cursor-pointer my-3 text-lg leading-tight font-bold text-black dark:text-gray-100 hover:underline'>
+          <p className='cursor-pointer my-3 text-lg leading-tight font-bold text-black dark:text-gray-100 hover:underline'>
             {post.title}
-          </div>
+          </p>
         </Link>
 
         <p className='mt-2 text-gray-400 dark:text-gray-400 text-sm'>{post.summary}</p>
diff --git a/components/InfoCard.js b/components/InfoCard.js
index b0821aaf..4033fcbc 100644
--- a/components/InfoCard.js
+++ b/components/InfoCard.js
@@ -5,21 +5,18 @@ import Router from 'next/router'
 
 const InfoCard = () => {
   return <>
-    <div className='flex justify-center text-center'>
-      <div className='pb-6 mx-auto leading-8'>
-        <div className='hover:rotate-45 hover:scale-125 transform duration-200 cursor-pointer' onClick={ () => { Router.push('/') }}>
+    <div className='flex text-center pb-3 pl-4 cursor-pointer'>
+        <div className='hover:rotate-45 hover:scale-125 transform duration-200' onClick={ () => { Router.push('/') }}>
           <Image
-          alt={BLOG.author}
-          width={100}
-          height={100}
+          alt={BLOG.title}
+          width={60}
+          height={60}
           loading='lazy'
           src='/avatar.svg'
           className='rounded-full border-black'
         />
         </div>
-        <h1 className='text-2xl dark:text-white py-2'>{BLOG.author}</h1>
-        <h2 className='text-sm text-gray-500 dark:text-gray-400'>{BLOG.description}</h2>
-      </div>
+        <div className='text-3xl dark:text-white ml-5 py-3 hover:scale-105 transform duration-200'>{BLOG.title}</div>
     </div>
   </>
 }
diff --git a/components/NavBar.js b/components/NavBar.js
index 4061205e..8f17f600 100644
--- a/components/NavBar.js
+++ b/components/NavBar.js
@@ -86,7 +86,7 @@ const Header = ({ navBarTitle, fullWidth = true }) => {
               <FontAwesomeIcon icon={faBars} className='hover:scale-125 transform duration-200' />
             </div>
             <Image
-              alt={BLOG.author}
+              alt={BLOG.title}
               width={28}
               height={28}
               src='/avatar.svg'
diff --git a/components/RecommendPosts.js b/components/RecommendPosts.js
index ce969734..a42c81e8 100644
--- a/components/RecommendPosts.js
+++ b/components/RecommendPosts.js
@@ -38,7 +38,7 @@ const RecommendPosts = ({ currentPost, totalPosts }) => {
   const { locale } = useGlobal()
 
   return <div className='dark:text-gray-300 dark:bg-gray-800 bg-gray-100 p-2 my-2  border-l-4 border-yellow-500'>
-    <h2 className='mb-2 font-bold text-xl'>{locale.COMMON.RELATE_POSTS}</h2>
+    <div className='mb-2 font-bold text-xl'>{locale.COMMON.RELATE_POSTS}</div>
     <ul className='list-disc px-5 text-sm '>
       {filteredPosts.map(post => (
         <li className='py-1' key={post.id} ><Link href={`/article/${post.slug}`}><a className='cursor-pointer hover:underline'>{post.title}</a></Link></li>
diff --git a/components/SideBar.js b/components/SideBar.js
index f2ca7eae..b31ecc1e 100644
--- a/components/SideBar.js
+++ b/components/SideBar.js
@@ -25,7 +25,7 @@ import { faAngleDoubleRight, faArchive, faTags, faThList } from '@fortawesome/fr
  */
 const SideBar = ({ tags, currentTag, post, posts, categories, currentCategory, currentSearch }) => {
   const { locale } = useGlobal()
-  return <aside id='sidebar' className='pt-10 bg-white dark:bg-gray-900 w-72 z-10 dark:border-gray-500 border-gray-200 scroll-hidden h-full'>
+  return <aside id='sidebar' className='pt-5 bg-white dark:bg-gray-900 w-72 z-10 dark:border-gray-500 border-gray-200 scroll-hidden h-full'>
     <InfoCard />
 
     <div className={(!post ? 'sticky top-0' : '') + ' bg-white dark:bg-gray-900 pb-4'}>
diff --git a/components/TopNav.js b/components/TopNav.js
index 2dcdb6a1..05455f10 100644
--- a/components/TopNav.js
+++ b/components/TopNav.js
@@ -29,7 +29,7 @@ const TopNav = ({ tags, currentTag, post, posts, currentSearch, categories, curr
         <div className='w-96'>
           <Link href='/' passHref>
             <div className='cursor-pointer'>
-            <span className='text-lg dark:text-gray-200'>{BLOG.title}</span> | <span className='dark:text-gray-300'>{BLOG.description}</span>
+             <h1 className='text-lg dark:text-gray-200 whitespace-nowrap overflow-x-hidden'>{BLOG.title }</h1>
             </div>
           </Link>
         </div>
diff --git a/package.json b/package.json
index 3f9924f5..e586e478 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "@fortawesome/react-fontawesome": "^0.1.16",
     "@popperjs/core": "^2.9.3",
     "animate.css": "^4.1.1",
+    "axios": ">=0.21.1",
     "copy-to-clipboard": "^3.3.1",
     "feed": "^4.2.2",
     "gitalk": "^1.7.2",
@@ -42,6 +43,7 @@
     "react-cusdis": "^2.0.1",
     "react-dom": "17.0.2",
     "react-notion-x": "4.6.5",
+    "styled-components": "^5.3.3",
     "use-ackee": "^3.0.0"
   },
   "devDependencies": {
diff --git a/pages/404.js b/pages/404.js
index 5099845a..b593d0aa 100644
--- a/pages/404.js
+++ b/pages/404.js
@@ -28,7 +28,7 @@ export default function Custom404 () {
     <div
       className='text-black w-full h-screen text-center justify-center content-center items-center flex flex-col'>
       <div className='dark:text-gray-200'>
-        <h1 className='inline-block border-r-2 border-gray-600 mr-2 px-3 py-2 align-top'><FontAwesomeIcon icon={faSpinner} spin={true} className='mr-2'/>404</h1>
+        <h2 className='inline-block border-r-2 border-gray-600 mr-2 px-3 py-2 align-top'><FontAwesomeIcon icon={faSpinner} spin={true} className='mr-2'/>404</h2>
         <div className='inline-block text-left h-32 leading-10 align-middle'>
           <h2 className='m-0 p-0'>页面无法加载，即将返回首页</h2>
         </div>
diff --git a/pages/_app.js b/pages/_app.js
index 071ef391..92fbd3a1 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -3,7 +3,7 @@ import 'rc-dropdown/assets/index.css'
 import 'katex/dist/katex.min.css'
 import '@/styles/globals.css'
 import 'animate.css'
-import BLOG from '@/blog.config'
+import BLOG from 'blog.config'
 import dynamic from 'next/dynamic'
 import { GlobalContextProvider } from '@/lib/global'
 
diff --git a/pages/article/[slug].js b/pages/article/[slug].js
index 18413c7c..39223530 100644
--- a/pages/article/[slug].js
+++ b/pages/article/[slug].js
@@ -37,7 +37,7 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
     return <Custom404 />
   }
   const meta = {
-    title: `${post.title} | ${BLOG.title}`,
+    title: `${post.title}`,
     description: post.summary,
     type: 'article',
     tags: post.tags
@@ -60,9 +60,9 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
           </header>
         </>)}
 
-        <article className='animate__fadeIn animate__animated subpixel-antialiased lg:pt-32 lg:px-44 px-5 py-2 dark:border-gray-700 bg-white dark:bg-gray-800'>
+        <article itemScope itemType="https://schema.org/Movie" className='animate__fadeIn animate__animated subpixel-antialiased lg:pt-32 lg:px-44 px-5 py-2 dark:border-gray-700 bg-white dark:bg-gray-800'>
           {/* 文章Title */}
-          <h1 className='font-bold text-3xl pt-5 text-black dark:text-white italic'> {post.title}</h1>
+          <h2 className='font-bold text-3xl pt-5 text-black dark:text-white italic'> {post.title}</h2>
           <hr className='mt-4' />
           <section className='flex-nowrap flex  mt-1 dark:text-white'>
             <Link href={`/category/${post.category}`} passHref>