diff --git a/components/BlogPostArchive.js b/components/BlogPostArchive.js
index 646c9c29..be661f9b 100644
--- a/components/BlogPostArchive.js
+++ b/components/BlogPostArchive.js
@@ -13,19 +13,17 @@ const BlogPostArchive = ({ posts = [], archiveTitle }) => {
   if (!posts || posts.length === 0) {
     return <></>
   } else {
-    return <div className='py-2' ref={targetRef}>
-      <div className='py-2 text-3xl dark:text-white'>{archiveTitle}</div>
-      {/* 文章列表 */}
+    return <div ref={targetRef}>
+      <div className='pt-14 pb-4 text-3xl dark:text-white' id={archiveTitle}>{archiveTitle}</div>
       <ul className='flex flex-wrap space-y-1'>
         {posts.map(post => (
           <Link key={post.id} href={`${BLOG.path}/article/${post.slug}`} passHref>
             <li className='w-full border-l pl-2 hover:underline cursor-pointer hover:scale-105 transform duration-500'>
-              <span className='text-gray-400'>{post.date.start_date}</span> &nbsp; <span className='dark:text-blue-400 text-blue-600'>{post.title}</span>
+              <div name={post?.date?.start_date}><span className='text-gray-400'>{post.date.start_date}</span> &nbsp; <span className='dark:text-blue-400 text-blue-600'>{post.title}</span></div>
             </li>
           </Link>
         ))}
       </ul>
-
     </div>
   }
 }
diff --git a/components/MenuButtonGroup.js b/components/MenuButtonGroup.js
index 857b2779..34021131 100644
--- a/components/MenuButtonGroup.js
+++ b/components/MenuButtonGroup.js
@@ -25,7 +25,7 @@ const MenuButtonGroup = ({ allowCollapse = false }) => {
     <div className='leading-8 text-gray-500 dark:text-gray-400'>
       {links.map(link => {
         if (link.show) {
-          const selected = router.asPath === link.to
+          const selected = router.pathname === link.to
           return <Link key={link.id + link.icon} title={link.to} href={link.to} >
             <a className={'py-2 px-5 hover:text-black dark:hover:text-white hover:bg-gray-100 cursor-pointer dark:hover:bg-gray-600 duration-100 flex flex-nowrap align-middle ' +
               (selected ? 'font-bold bg-gray-200 dark:bg-black dark:text-white text-black ' : '')} >
diff --git a/pages/archive/index.js b/pages/archive/index.js
index 6aae96e1..57e2bcb9 100644
--- a/pages/archive/index.js
+++ b/pages/archive/index.js
@@ -59,7 +59,7 @@ const Index = ({ allPosts, tags, categories }) => {
     <BaseLayout meta={meta} tags={tags} categories={categories}>
       <div className='flex-grow bg-gray-200 dark:bg-black shadow-inner pt-16 '>
         <StickyBar>
-          <div className='py-4 text-lg lg:mx-14 dark:text-gray-200'><FontAwesomeIcon icon={faArchive} className='mr-4'/>{locale.NAV.ARCHIVE}</div>
+          <div className='py-2.5 text-lg lg:mx-14 dark:text-gray-200'><FontAwesomeIcon icon={faArchive} className='mr-4'/>{locale.NAV.ARCHIVE}</div>
         </StickyBar>
         <div className='mt-20 mx-2 lg:mx-20 bg-white p-12 dark:bg-gray-800'>
           {Object.keys(archivePosts).map(archiveTitle => (
diff --git a/pages/article/[slug].js b/pages/article/[slug].js
index 875f76ba..3e7a65dc 100644
--- a/pages/article/[slug].js
+++ b/pages/article/[slug].js
@@ -6,7 +6,6 @@ import Progress from '@/components/Progress'
 import TagItem from '@/components/TagItem'
 import formatDate from '@/lib/formatDate'
 import { Code, Collection, CollectionRow, Equation, NotionRenderer } from 'react-notion-x'
-import RewardButton from '@/components/RewardButton'
 import ShareBar from '@/components/ShareBar'
 import Comment from '@/components/Comment'
 import BaseLayout from '@/layouts/BaseLayout'
@@ -47,6 +46,7 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
   const drawerRight = useRef(null)
   const url = BLOG.link + useRouter().asPath
   const { locale } = useGlobal()
+  const date = formatDate(post?.date?.start_date || post.createdTime, BLOG.lang)
 
   return <BaseLayout meta={meta} tags={tags} post={post} totalPosts={allPosts} categories={categories}>
     <Progress targetRef={targetRef} />
@@ -56,7 +56,7 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
       <div className='max-w-5xl mx-auto mt-16 xl:mt-32 w-screen md:w-full '>
         {post.type && !post.type.includes('Page') && (<>
           <header className='w-full h-60 lg:h-96 transform duration-200 md:flex-shrink-0'>
-            <Image src={(post.page_cover && post.page_cover.length > 1) ? post.page_cover : BLOG.defaultImgCover} loading='lazy' objectFit='cover' layout='fill' alt={post.title} />
+            <Image src={(post.page_cover && post.page_cover.length > 1) ? post.page_cover : BLOG.defaultImgCover} loading='eager' objectFit='cover' layout='fill' alt={post.title} />
           </header>
         </>)}
 
@@ -71,12 +71,9 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
               </div>
             </Link>
             {post.type[0] !== 'Page' && (
-              <Link href='/archive' passHref>
+              <Link href={`/archive#${post?.date?.start_date?.substr(0, 7)}`} passHref>
                 <div className='pl-1 cursor-pointer hover:text-gray-700  dark:hover:text-gray-200 text-gray-400 dark:text-gray-400 leading-10'>
-                  {formatDate(
-                    post?.date?.start_date || post.createdTime,
-                    BLOG.lang
-                  )}
+                {date}
                 </div>
               </Link>
             )}