diff --git a/.env.local b/.env.local
index be1af82d8d0..8a0dbf80623 100644
--- a/.env.local
+++ b/.env.local
@@ -1,5 +1,6 @@
 # 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables
-NEXT_PUBLIC_VERSION=4.1.0
+NEXT_PUBLIC_VERSION=4.1.2
+
 
 # 可在此添加环境变量，去掉最左边的（# ）注释即可
 # Notion页面ID,必须
diff --git a/README.md b/README.md
index dffdd4018d4..33be50b7562 100644
--- a/README.md
+++ b/README.md
@@ -201,6 +201,9 @@
 - **图标**: [Fontawesome](https://fontawesome.com/v6/icons/)
 
 
+## 🔗 友情链接
+- [Elog](https://github.com/LetTTGACO/elog) Markdown 批量导出工具、开放式跨平台博客解决方案，随意组合写作平台(语雀/Notion/FlowUs/飞书)和博客平台(Hexo/Vitepress/Halo/Confluence/WordPress等)
+
 ## License
 
 The MIT License.
diff --git a/blog.config.js b/blog.config.js
index 7c0358d3e26..11a7cf52743 100644
--- a/blog.config.js
+++ b/blog.config.js
@@ -324,6 +324,10 @@ const BLOG = {
   ANALYTICS_CNZZ_ID: process.env.NEXT_PUBLIC_ANALYTICS_CNZZ_ID || '', // 只需要填写站长统计的id, [cnzz_id] -> https://s9.cnzz.com/z_stat.php?id=[cnzz_id]&web_id=[cnzz_id]
   ANALYTICS_GOOGLE_ID: process.env.NEXT_PUBLIC_ANALYTICS_GOOGLE_ID || '', // 谷歌Analytics的id e.g: G-XXXXXXXXXX
 
+  // 51la 站点统计 https://www.51.la/
+  ANALYTICS_51LA_ID: process.env.NEXT_PUBLIC_ANALYTICS_51LA_ID || '', // id，在51la后台获取 参阅 https://docs.tangly1024.com/article/notion-next-51-la
+  ANALYTICS_51LA_CK: process.env.NEXT_PUBLIC_ANALYTICS_51LA_CK || '', // ck，在51la后台获取
+
   // Matomo 网站统计
   MATOMO_HOST_URL: process.env.NEXT_PUBLIC_MATOMO_HOST_URL || '', // Matomo服务器地址，不带斜杠
   MATOMO_SITE_ID: process.env.NEXT_PUBLIC_MATOMO_SITE_ID || '', // Matomo网站ID
@@ -398,12 +402,14 @@ const BLOG = {
   IMG_LAZY_LOAD_PLACEHOLDER: process.env.NEXT_PUBLIC_IMG_LAZY_LOAD_PLACEHOLDER || 'data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==', // 懒加载占位图片地址，支持base64或url
   IMG_URL_TYPE: process.env.NEXT_PUBLIC_IMG_TYPE || 'Notion', // 此配置已失效，请勿使用；AMAZON方案不再支持，仅支持Notion方案。 ['Notion','AMAZON'] 站点图片前缀 默认 Notion:(https://notion.so/images/xx) ， AMAZON(https://s3.us-west-2.amazonaws.com/xxx)
   IMG_SHADOW: process.env.NEXT_PUBLIC_IMG_SHADOW || false, // 文章图片是否自动添加阴影
+  IMG_COMPRESS_WIDTH: process.env.NEXT_PUBLIC_IMG_COMPRESS_WIDTH || 800, // Notion图片压缩宽度
 
   // 开发相关
   NOTION_ACCESS_TOKEN: process.env.NOTION_ACCESS_TOKEN || '', // Useful if you prefer not to make your database public
   DEBUG: process.env.NEXT_PUBLIC_DEBUG || false, // 是否显示调试按钮
   ENABLE_CACHE: process.env.ENABLE_CACHE || process.env.npm_lifecycle_event === 'build', // 缓存在开发调试和打包过程中选择性开启，正式部署开启此功能意义不大。
   isProd: process.env.VERCEL_ENV === 'production', // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)  isProd: process.env.VERCEL_ENV === 'production' // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)
+  BUNDLE_ANALYZER: process.env.ANALYZE === 'true' || false, // 是否展示编译依赖内容与大小
   VERSION: process.env.NEXT_PUBLIC_VERSION // 版本号
 }
 
diff --git a/components/AOSAnimation.js b/components/AOSAnimation.js
new file mode 100644
index 00000000000..c5dd4d921e2
--- /dev/null
+++ b/components/AOSAnimation.js
@@ -0,0 +1,12 @@
+import AOS from 'aos'
+import { isBrowser } from 'react-notion-x'
+
+/**
+ * 加载滚动动画
+ * https://michalsnik.github.io/aos/
+ */
+export default function AOSAnimation() {
+  if (isBrowser) {
+    AOS.init()
+  }
+}
diff --git a/components/Comment.js b/components/Comment.js
index 203ed0664c0..4f4107b8597 100644
--- a/components/Comment.js
+++ b/components/Comment.js
@@ -1,6 +1,6 @@
 import dynamic from 'next/dynamic'
 import Tabs from '@/components/Tabs'
-import { isBrowser } from '@/lib/utils'
+import { isBrowser, isSearchEngineBot } from '@/lib/utils'
 import { useRouter } from 'next/router'
 import Artalk from './Artalk'
 import { siteConfig } from '@/lib/config'
@@ -73,6 +73,10 @@ const Comment = ({ siteInfo, frontMatter, className }) => {
   const COMMENT_GITALK_CLIENT_ID = siteConfig('COMMENT_GITALK_CLIENT_ID')
   const COMMENT_WEBMENTION_ENABLE = siteConfig('COMMENT_WEBMENTION_ENABLE')
 
+  if (isSearchEngineBot()) {
+    return null
+  }
+
   // 当连接中有特殊参数时跳转到评论区
   if (isBrowser && ('giscus' in router.query || router.query.target === 'comment')) {
     setTimeout(() => {
diff --git a/components/Equation.js b/components/Equation.js
index 4872ad8710e..86685d625f6 100644
--- a/components/Equation.js
+++ b/components/Equation.js
@@ -8,8 +8,12 @@ const katexSettings = {
   strict: false
 }
 
+/**
+ * 数学公式
+ * @param {} param0
+ * @returns
+ */
 export const Equation = ({ block, math, inline = false, className, ...rest }) => {
-//   const { recordMap } = useNotionContext()
   math = math || getBlockTitle(block, null)
   if (!math) return null
 
diff --git a/components/ExternalPlugins.js b/components/ExternalPlugins.js
index 3c274b55f61..29b31934544 100644
--- a/components/ExternalPlugins.js
+++ b/components/ExternalPlugins.js
@@ -1,5 +1,6 @@
 import { siteConfig } from '@/lib/config'
 import dynamic from 'next/dynamic'
+import LA51 from './LA51'
 import WebWhiz from './Webwhiz'
 
 const TwikooCommentCounter = dynamic(() => import('@/components/TwikooCommentCounter'), { ssr: false })
@@ -22,6 +23,8 @@ const VConsole = dynamic(() => import('@/components/VConsole'), { ssr: false })
 const CustomContextMenu = dynamic(() => import('@/components/CustomContextMenu'), { ssr: false })
 const DisableCopy = dynamic(() => import('@/components/DisableCopy'), { ssr: false })
 const AdBlockDetect = dynamic(() => import('@/components/AdBlockDetect'), { ssr: false })
+const LoadingProgress = dynamic(() => import('@/components/LoadingProgress'), { ssr: false })
+const AosAnimation = dynamic(() => import('@/components/AOSAnimation'), { ssr: false })
 
 /**
  * 各种插件脚本
@@ -29,145 +32,199 @@ const AdBlockDetect = dynamic(() => import('@/components/AdBlockDetect'), { ssr:
  * @returns
  */
 const ExternalPlugin = (props) => {
+  const DISABLE_PLUGIN = siteConfig('DISABLE_PLUGIN')
+  const THEME_SWITCH = siteConfig('THEME_SWITCH')
+  const DEBUG = siteConfig('DEBUG')
+  const ANALYTICS_ACKEE_TRACKER = siteConfig('ANALYTICS_ACKEE_TRACKER')
+  const ANALYTICS_VERCEL = siteConfig('ANALYTICS_VERCEL')
+  const ANALYTICS_BUSUANZI_ENABLE = siteConfig('ANALYTICS_BUSUANZI_ENABLE')
+  const ADSENSE_GOOGLE_ID = siteConfig('ADSENSE_GOOGLE_ID')
+  const FACEBOOK_APP_ID = siteConfig('FACEBOOK_APP_ID')
+  const FACEBOOK_PAGE_ID = siteConfig('FACEBOOK_PAGE_ID')
+  const FIREWORKS = siteConfig('FIREWORKS')
+  const SAKURA = siteConfig('SAKURA')
+  const STARRY_SKY = siteConfig('STARRY_SKY')
+  const MUSIC_PLAYER = siteConfig('MUSIC_PLAYER')
+  const NEST = siteConfig('NEST')
+  const FLUTTERINGRIBBON = siteConfig('FLUTTERINGRIBBON')
+  const COMMENT_TWIKOO_COUNT_ENABLE = siteConfig('COMMENT_TWIKOO_COUNT_ENABLE')
+  const RIBBON = siteConfig('RIBBON')
+  const CUSTOM_RIGHT_CLICK_CONTEXT_MENU = siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU')
+  const CAN_COPY = siteConfig('CAN_COPY')
+  const WEB_WHIZ_ENABLED = siteConfig('WEB_WHIZ_ENABLED')
+  const AD_WWADS_BLOCK_DETECT = siteConfig('AD_WWADS_BLOCK_DETECT')
+  const CHATBASE_ID = siteConfig('CHATBASE_ID')
+  const COMMENT_DAO_VOICE_ID = siteConfig('COMMENT_DAO_VOICE_ID')
+  const AD_WWADS_ID = siteConfig('AD_WWADS_ID')
+  const COMMENT_TWIKOO_ENV_ID = siteConfig('COMMENT_TWIKOO_ENV_ID')
+  const COMMENT_TWIKOO_CDN_URL = siteConfig('COMMENT_TWIKOO_CDN_URL')
+  const COMMENT_ARTALK_SERVER = siteConfig('COMMENT_ARTALK_SERVER')
+  const COMMENT_ARTALK_JS = siteConfig('COMMENT_ARTALK_JS')
+  const COMMENT_TIDIO_ID = siteConfig('COMMENT_TIDIO_ID')
+  const COMMENT_GITTER_ROOM = siteConfig('COMMENT_GITTER_ROOM')
+  const ANALYTICS_BAIDU_ID = siteConfig('ANALYTICS_BAIDU_ID')
+  const ANALYTICS_CNZZ_ID = siteConfig('ANALYTICS_CNZZ_ID')
+  const ANALYTICS_GOOGLE_ID = siteConfig('ANALYTICS_GOOGLE_ID')
+  const MATOMO_HOST_URL = siteConfig('MATOMO_HOST_URL')
+  const MATOMO_SITE_ID = siteConfig('MATOMO_SITE_ID')
+  const ANALYTICS_51LA_ID = siteConfig('ANALYTICS_51LA_ID')
+  const ANALYTICS_51LA_CK = siteConfig('ANALYTICS_51LA_CK')
+
+  if (DISABLE_PLUGIN) {
+    return null
+  }
+
   return <>
-    {JSON.parse(siteConfig('THEME_SWITCH')) && <ThemeSwitch />}
-    {JSON.parse(siteConfig('DEBUG')) && <DebugPanel />}
-    {siteConfig('ANALYTICS_ACKEE_TRACKER') && <Ackee />}
-    {siteConfig('ANALYTICS_GOOGLE_ID') && <Gtag />}
-    {siteConfig('ANALYTICS_VERCEL') && <Analytics />}
-    {JSON.parse(siteConfig('ANALYTICS_BUSUANZI_ENABLE')) && <Busuanzi />}
-    {siteConfig('ADSENSE_GOOGLE_ID') && <GoogleAdsense />}
-    {siteConfig('FACEBOOK_APP_ID') && siteConfig('FACEBOOK_PAGE_ID') && <Messenger />}
-    {JSON.parse(siteConfig('FIREWORKS')) && <Fireworks />}
-    {JSON.parse(siteConfig('SAKURA')) && <Sakura />}
-    {JSON.parse(siteConfig('STARRY_SKY')) && <StarrySky />}
-    {JSON.parse(siteConfig('MUSIC_PLAYER')) && <MusicPlayer />}
-    {JSON.parse(siteConfig('NEST')) && <Nest />}
-    {JSON.parse(siteConfig('FLUTTERINGRIBBON')) && <FlutteringRibbon />}
-    {JSON.parse(siteConfig('COMMENT_TWIKOO_COUNT_ENABLE')) && <TwikooCommentCounter {...props} />}
-    {JSON.parse(siteConfig('RIBBON')) && <Ribbon />}
-    {JSON.parse(siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU')) && <CustomContextMenu {...props} />}
-    {!JSON.parse(siteConfig('CAN_COPY')) && <DisableCopy />}
-    {JSON.parse(siteConfig('WEB_WHIZ_ENABLED')) && <WebWhiz />}
-    {JSON.parse(siteConfig('AD_WWADS_BLOCK_DETECT')) && <AdBlockDetect />}
-    <VConsole />
-
-    {siteConfig('CHATBASE_ID') && (<>
-      <script id={siteConfig('CHATBASE_ID')} src="https://www.chatbase.co/embed.min.js" defer />
-      <script async dangerouslySetInnerHTML={{
-        __html: `
-         window.chatbaseConfig = {
-            chatbotId: "${siteConfig('CHATBASE_ID')}",
-        }
-    `
-      }} />
-    </>)}
-
-    {siteConfig('COMMENT_DAO_VOICE_ID') && (<>
-      {/* DaoVoice 反馈 */}
-      <script async dangerouslySetInnerHTML={{
-        __html: `
+        {THEME_SWITCH && <ThemeSwitch />}
+        {DEBUG && <DebugPanel />}
+        {ANALYTICS_ACKEE_TRACKER && <Ackee />}
+        {ANALYTICS_GOOGLE_ID && <Gtag />}
+        {ANALYTICS_VERCEL && <Analytics />}
+        {ANALYTICS_BUSUANZI_ENABLE && <Busuanzi />}
+        {ADSENSE_GOOGLE_ID && <GoogleAdsense />}
+        {FACEBOOK_APP_ID && FACEBOOK_PAGE_ID && <Messenger />}
+        {FIREWORKS && <Fireworks />}
+        {SAKURA && <Sakura />}
+        {STARRY_SKY && <StarrySky />}
+        {MUSIC_PLAYER && <MusicPlayer />}
+        {NEST && <Nest />}
+        {FLUTTERINGRIBBON && <FlutteringRibbon />}
+        {COMMENT_TWIKOO_COUNT_ENABLE && <TwikooCommentCounter {...props} />}
+        {RIBBON && <Ribbon />}
+        {CUSTOM_RIGHT_CLICK_CONTEXT_MENU && <CustomContextMenu {...props} />}
+        {!CAN_COPY && <DisableCopy />}
+        {WEB_WHIZ_ENABLED && <WebWhiz />}
+        {AD_WWADS_BLOCK_DETECT && <AdBlockDetect />}
+        <VConsole />
+        <LoadingProgress />
+        <AosAnimation />
+        {ANALYTICS_51LA_ID && ANALYTICS_51LA_CK && <LA51/>}
+
+        {ANALYTICS_51LA_ID && ANALYTICS_51LA_CK && (<>
+            <script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js" defer/>
+            {/* <script async dangerouslySetInnerHTML={{
+              __html: `
+                    LA.init({id:"${ANALYTICS_51LA_ID}",ck:"${ANALYTICS_51LA_CK}",hashMode:true,autoTrack:true})
+                    `
+            }} /> */}
+        </>)}
+
+        {CHATBASE_ID && (<>
+            <script id={CHATBASE_ID} src="https://www.chatbase.co/embed.min.js" defer />
+            <script async dangerouslySetInnerHTML={{
+              __html: `
+                    window.chatbaseConfig = {
+                        chatbotId: "${CHATBASE_ID}",
+                        }
+                    `
+            }} />
+        </>)}
+
+        {COMMENT_DAO_VOICE_ID && (<>
+            {/* DaoVoice 反馈 */}
+            <script async dangerouslySetInnerHTML={{
+              __html: `
               (function(i,s,o,g,r,a,m){i["DaoVoiceObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;a.charset="utf-8";m.parentNode.insertBefore(a,m)})(window,document,"script",('https:' == document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/daf1a94b.js","daovoice")
               `
-      }}
-      />
-      <script async dangerouslySetInnerHTML={{
-        __html: `
+            }}
+            />
+            <script async dangerouslySetInnerHTML={{
+              __html: `
              daovoice('init', {
-                app_id: "${siteConfig('COMMENT_DAO_VOICE_ID')}"
+                app_id: "${COMMENT_DAO_VOICE_ID}"
               });
               daovoice('update');
               `
-      }}
-      />
-    </>)}
+            }}
+            />
+        </>)}
 
-    {siteConfig('AD_WWADS_ID') && <script type="text/javascript" charSet="UTF-8" src="https://cdn.wwads.cn/js/makemoney.js" async></script>}
+        {AD_WWADS_ID && <script type="text/javascript" charSet="UTF-8" src="https://cdn.wwads.cn/js/makemoney.js" async></script>}
 
-    {siteConfig('COMMENT_TWIKOO_ENV_ID') && <script defer src={siteConfig('COMMENT_TWIKOO_CDN_URL')} />}
+        {COMMENT_TWIKOO_ENV_ID && <script defer src={COMMENT_TWIKOO_CDN_URL} />}
 
-    {siteConfig('COMMENT_ARTALK_SERVER') && <script defer src={siteConfig('COMMENT_ARTALK_JS')} />}
+        {COMMENT_ARTALK_SERVER && <script defer src={COMMENT_ARTALK_JS} />}
 
-    {siteConfig('COMMENT_TIDIO_ID') && <script async src={`//code.tidio.co/${siteConfig('COMMENT_TIDIO_ID')}.js`} />}
+        {COMMENT_TIDIO_ID && <script async src={`//code.tidio.co/${COMMENT_TIDIO_ID}.js`} />}
 
-    {/* gitter聊天室 */}
-    {siteConfig('COMMENT_GITTER_ROOM') && (<>
-      <script src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer />
-      <script async dangerouslySetInnerHTML={{
-        __html: `
+        {/* gitter聊天室 */}
+        {COMMENT_GITTER_ROOM && (<>
+            <script src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer />
+            <script async dangerouslySetInnerHTML={{
+              __html: `
             ((window.gitter = {}).chat = {}).options = {
-              room: '${siteConfig('COMMENT_GITTER_ROOM')}'
+              room: '${COMMENT_GITTER_ROOM}'
             };
             `
-      }} />
-    </>)}
-
-    {/* 百度统计 */}
-    {siteConfig('ANALYTICS_BAIDU_ID') && (
-      <script async
-        dangerouslySetInnerHTML={{
-          __html: `
+            }} />
+        </>)}
+
+        {/* 百度统计 */}
+        {ANALYTICS_BAIDU_ID && (
+            <script async
+                dangerouslySetInnerHTML={{
+                  __html: `
           var _hmt = _hmt || [];
           (function() {
             var hm = document.createElement("script");
-            hm.src = "https://hm.baidu.com/hm.js?${siteConfig('ANALYTICS_BAIDU_ID')}";
+            hm.src = "https://hm.baidu.com/hm.js?${ANALYTICS_BAIDU_ID}";
             var s = document.getElementsByTagName("script")[0]; 
             s.parentNode.insertBefore(hm, s);
           })();
           `
-        }}
-      />
-    )}
-
-    {/* 站长统计 */}
-    {siteConfig('ANALYTICS_CNZZ_ID') && (
-      <script async
-        dangerouslySetInnerHTML={{
-          __html: `
-          document.write(unescape("%3Cspan style='display:none' id='cnzz_stat_icon_${siteConfig('ANALYTICS_CNZZ_ID')}'%3E%3C/span%3E%3Cscript src='https://s9.cnzz.com/z_stat.php%3Fid%3D${siteConfig('ANALYTICS_CNZZ_ID')}' type='text/javascript'%3E%3C/script%3E"));
+                }}
+            />
+        )}
+
+        {/* 站长统计 */}
+        {ANALYTICS_CNZZ_ID && (
+            <script async
+                dangerouslySetInnerHTML={{
+                  __html: `
+          document.write(unescape("%3Cspan style='display:none' id='cnzz_stat_icon_${ANALYTICS_CNZZ_ID}'%3E%3C/span%3E%3Cscript src='https://s9.cnzz.com/z_stat.php%3Fid%3D${ANALYTICS_CNZZ_ID}' type='text/javascript'%3E%3C/script%3E"));
           `
-        }}
-      />
-    )}
-
-    {/* 谷歌统计 */}
-    {siteConfig('ANALYTICS_GOOGLE_ID') && (<>
-      <script async
-        src={`https://www.googletagmanager.com/gtag/js?id=${siteConfig('ANALYTICS_GOOGLE_ID')}`}
-      />
-      <script async
-        dangerouslySetInnerHTML={{
-          __html: `
+                }}
+            />
+        )}
+
+        {/* 谷歌统计 */}
+        {ANALYTICS_GOOGLE_ID && (<>
+            <script async
+                src={`https://www.googletagmanager.com/gtag/js?id=${ANALYTICS_GOOGLE_ID}`}
+            />
+            <script async
+                dangerouslySetInnerHTML={{
+                  __html: `
                 window.dataLayer = window.dataLayer || [];
                 function gtag(){dataLayer.push(arguments);}
                 gtag('js', new Date());
-                gtag('config', '${siteConfig('ANALYTICS_GOOGLE_ID')}', {
+                gtag('config', '${ANALYTICS_GOOGLE_ID}', {
                   page_path: window.location.pathname,
                 });
               `
-        }}
-      />
-    </>)}
-
-    {/* Matomo 统计 */}
-    {siteConfig('MATOMO_HOST_URL') && siteConfig('MATOMO_SITE_ID') && (
-      <script async dangerouslySetInnerHTML={{
-        __html: `
+                }}
+            />
+        </>)}
+
+        {/* Matomo 统计 */}
+        {MATOMO_HOST_URL && MATOMO_SITE_ID && (
+            <script async dangerouslySetInnerHTML={{
+              __html: `
               var _paq = window._paq = window._paq || [];
               _paq.push(['trackPageView']);
               _paq.push(['enableLinkTracking']);
               (function() {
-                var u="//${siteConfig('MATOMO_HOST_URL')}/";
+                var u="//${MATOMO_HOST_URL}/";
                 _paq.push(['setTrackerUrl', u+'matomo.php']);
-                _paq.push(['setSiteId', '${siteConfig('MATOMO_SITE_ID')}']);
+                _paq.push(['setSiteId', '${MATOMO_SITE_ID}']);
                 var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
                 g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
               })();
             `
-      }}/>
-    )}
+            }} />
+        )}
 
-  </>
+    </>
 }
 
 export default ExternalPlugin
diff --git a/components/FacebookMessenger.js b/components/FacebookMessenger.js
index 388640d9e68..ef8da0cb2a8 100644
--- a/components/FacebookMessenger.js
+++ b/components/FacebookMessenger.js
@@ -1,14 +1,41 @@
-import { Component } from 'react'
+import { Component, useEffect, useState } from 'react'
 import PropTypes from 'prop-types'
 import { siteConfig } from '@/lib/config'
 
 export default function Messenger() {
-  return <MessengerCustomerChat
-    pageId={siteConfig('FACEBOOK_PAGE_ID')}
-    appId={siteConfig('FACEBOOK_APP_ID')}
-    language={siteConfig('LANG').replace('-', '_')}
-    shouldShowDialog={true}
-  />
+  const pageId = siteConfig('FACEBOOK_PAGE_ID')
+  const appId = siteConfig('FACEBOOK_APP_ID')
+  const language = siteConfig('LANG').replace('-', '_')
+
+  // 新增一个状态变量用于追踪是否已经滚动过
+  const [showMessenger, setShowMessenger] = useState(false);
+
+  const showTheComponent = () => {
+    window.removeEventListener('scroll', showTheComponent);
+    if (!showMessenger) {
+      setShowMessenger(true);
+    }
+  };
+
+  // 延时7秒，或页面滚动时加载该组件
+  useEffect(() => {
+    window.addEventListener('scroll', showTheComponent);
+    setTimeout(() => {
+      showTheComponent()
+    }, 7000);
+    return () => {
+      window.removeEventListener('scroll', showTheComponent);
+    };
+  }, []);
+
+  return <>
+        {showMessenger && <MessengerCustomerChat
+            pageId={pageId}
+            appId={appId}
+            language={language}
+            shouldShowDialog={true}
+        />}
+    </>
 }
 
 /**
@@ -24,8 +51,8 @@ class MessengerCustomerChat extends Component {
   }
 
   /**
-   * 初始化
-   */
+     * 初始化
+     */
   componentDidMount() {
     this.setFbAsyncInit()
     this.reloadSDKAsynchronously()
@@ -34,19 +61,19 @@ class MessengerCustomerChat extends Component {
   componentDidUpdate(prevProps) {
     if (
       prevProps.pageId !== this.props.pageId ||
-      prevProps.appId !== this.props.appId ||
-      prevProps.shouldShowDialog !== this.props.shouldShowDialog ||
-      prevProps.htmlRef !== this.props.htmlRef ||
-      prevProps.minimized !== this.props.minimized ||
-      prevProps.themeColor !== this.props.themeColor ||
-      prevProps.loggedInGreeting !== this.props.loggedInGreeting ||
-      prevProps.loggedOutGreeting !== this.props.loggedOutGreeting ||
-      prevProps.greetingDialogDisplay !== this.props.greetingDialogDisplay ||
-      prevProps.greetingDialogDelay !== this.props.greetingDialogDelay ||
-      prevProps.autoLogAppEvents !== this.props.autoLogAppEvents ||
-      prevProps.xfbml !== this.props.xfbml ||
-      prevProps.version !== this.props.version ||
-      prevProps.language !== this.props.language
+            prevProps.appId !== this.props.appId ||
+            prevProps.shouldShowDialog !== this.props.shouldShowDialog ||
+            prevProps.htmlRef !== this.props.htmlRef ||
+            prevProps.minimized !== this.props.minimized ||
+            prevProps.themeColor !== this.props.themeColor ||
+            prevProps.loggedInGreeting !== this.props.loggedInGreeting ||
+            prevProps.loggedOutGreeting !== this.props.loggedOutGreeting ||
+            prevProps.greetingDialogDisplay !== this.props.greetingDialogDisplay ||
+            prevProps.greetingDialogDelay !== this.props.greetingDialogDelay ||
+            prevProps.autoLogAppEvents !== this.props.autoLogAppEvents ||
+            prevProps.xfbml !== this.props.xfbml ||
+            prevProps.version !== this.props.version ||
+            prevProps.language !== this.props.language
     ) {
       this.setFbAsyncInit()
       this.reloadSDKAsynchronously()
@@ -60,8 +87,8 @@ class MessengerCustomerChat extends Component {
   }
 
   /**
-   * 初始化
-   */
+     * 初始化
+     */
   setFbAsyncInit() {
     const { appId, autoLogAppEvents, xfbml, version } = this.props
 
@@ -80,18 +107,18 @@ class MessengerCustomerChat extends Component {
   loadSDKAsynchronously() {
     const { language } = this.props;
     /* eslint-disable */
-    (function (d, s, id) {
-      var js,
-        fjs = d.getElementsByTagName(s)[0];
-      if (d.getElementById(id)) {
-        return;
-      }
-      js = d.createElement(s);
-      js.id = id;
-      js.src = `https://connect.facebook.net/${language}/sdk/xfbml.customerchat.js`;
-      fjs.parentNode.insertBefore(js, fjs);
-    })(document, 'script', 'facebook-jssdk');
-    /* eslint-enable */
+        (function (d, s, id) {
+            var js,
+                fjs = d.getElementsByTagName(s)[0];
+            if (d.getElementById(id)) {
+                return;
+            }
+            js = d.createElement(s);
+            js.id = id;
+            js.src = `https://connect.facebook.net/${language}/sdk/xfbml.customerchat.js`;
+            fjs.parentNode.insertBefore(js, fjs);
+        })(document, 'script', 'facebook-jssdk');
+        /* eslint-enable */
   }
 
   removeFacebookSDK() {
@@ -147,25 +174,25 @@ class MessengerCustomerChat extends Component {
 
     const refAttribute = htmlRef !== undefined ? `ref="${htmlRef}"` : ''
     const minimizedAttribute =
-      minimized !== undefined ? `minimized="${minimized}"` : ''
+            minimized !== undefined ? `minimized="${minimized}"` : ''
     const themeColorAttribute =
-      themeColor !== undefined ? `theme_color="${themeColor}"` : ''
+            themeColor !== undefined ? `theme_color="${themeColor}"` : ''
     const loggedInGreetingAttribute =
-      loggedInGreeting !== undefined
-        ? `logged_in_greeting="${loggedInGreeting}"`
-        : ''
+            loggedInGreeting !== undefined
+              ? `logged_in_greeting="${loggedInGreeting}"`
+              : ''
     const loggedOutGreetingAttribute =
-      loggedOutGreeting !== undefined
-        ? `logged_out_greeting="${loggedOutGreeting}"`
-        : ''
+            loggedOutGreeting !== undefined
+              ? `logged_out_greeting="${loggedOutGreeting}"`
+              : ''
     const greetingDialogDisplayAttribute =
-      greetingDialogDisplay !== undefined
-        ? `greeting_dialog_display="${greetingDialogDisplay}"`
-        : ''
+            greetingDialogDisplay !== undefined
+              ? `greeting_dialog_display="${greetingDialogDisplay}"`
+              : ''
     const greetingDialogDelayAttribute =
-      greetingDialogDelay !== undefined
-        ? `greeting_dialog_delay="${greetingDialogDelay}"`
-        : ''
+            greetingDialogDelay !== undefined
+              ? `greeting_dialog_delay="${greetingDialogDelay}"`
+              : ''
 
     return {
       __html: `<div
@@ -192,8 +219,8 @@ class MessengerCustomerChat extends Component {
           const element = event.target
           if (
             element.className &&
-            typeof element.className === 'string' &&
-            element.className.includes('fb_dialog')
+                        typeof element.className === 'string' &&
+                        element.className.includes('fb_dialog')
           ) {
             this.controlPlugin()
           }
diff --git a/components/KatexReact.js b/components/KatexReact.js
index 5a585e1355d..9adc887098b 100644
--- a/components/KatexReact.js
+++ b/components/KatexReact.js
@@ -1,6 +1,11 @@
 import KaTeX from 'katex'
-import React from 'react'
+import { memo, useEffect, useState } from 'react'
 
+/**
+ * 数学公式
+ * @param {*} param0
+ * @returns
+ */
 const TeX = ({
   children,
   math,
@@ -13,9 +18,9 @@ const TeX = ({
 }) => {
   const Component = asComponent || (block ? 'div' : 'span')
   const content = (children ?? math)
-  const [state, setState] = React.useState({ innerHtml: '' })
+  const [state, setState] = useState({ innerHtml: '' })
 
-  React.useEffect(() => {
+  useEffect(() => {
     try {
       const innerHtml = KaTeX.renderToString(content, {
         displayMode: true,
@@ -50,4 +55,4 @@ const TeX = ({
   )
 }
 
-export default React.memo(TeX)
+export default memo(TeX)
diff --git a/components/LA51.js b/components/LA51.js
new file mode 100644
index 00000000000..df5066666df
--- /dev/null
+++ b/components/LA51.js
@@ -0,0 +1,18 @@
+import { siteConfig } from '@/lib/config'
+import { useEffect } from 'react'
+
+/**
+ * 51LA统计
+ */
+export default function LA51() {
+  const ANALYTICS_51LA_ID = siteConfig('ANALYTICS_51LA_ID')
+  const ANALYTICS_51LA_CK = siteConfig('ANALYTICS_51LA_CK')
+  useEffect(() => {
+    const LA = window.LA
+    if (LA) {
+      LA.init({ id: `${ANALYTICS_51LA_ID}`, ck: `${ANALYTICS_51LA_CK}`, hashMode: true, autoTrack: true })
+    }
+  }, [])
+
+  return <></>
+}
diff --git a/components/Live2D.js b/components/Live2D.js
index c232ddbb409..4dbbe31ac6b 100644
--- a/components/Live2D.js
+++ b/components/Live2D.js
@@ -4,6 +4,10 @@ import { useGlobal } from '@/lib/global'
 import { loadExternalResource } from '@/lib/utils'
 import { useEffect } from 'react'
 
+/**
+ * 网页动画
+ * @returns
+ */
 export default function Live2D() {
   const { theme, switchTheme } = useGlobal()
   const showPet = JSON.parse(siteConfig('WIDGET_PET'))
diff --git a/components/LoadingProgress.js b/components/LoadingProgress.js
new file mode 100644
index 00000000000..d7f7b5f7d5b
--- /dev/null
+++ b/components/LoadingProgress.js
@@ -0,0 +1,29 @@
+import { useRouter } from 'next/router'
+import NProgress from 'nprogress'
+import { useEffect } from 'react'
+
+/**
+ * 出现页面加载进度条
+ */
+export default function LoadingProgress() {
+  const router = useRouter()
+  // 加载进度条
+  useEffect(() => {
+    const handleStart = (url) => {
+      NProgress.start()
+    }
+
+    const handleStop = () => {
+      NProgress.done()
+    }
+
+    router.events.on('routeChangeStart', handleStart)
+    router.events.on('routeChangeError', handleStop)
+    router.events.on('routeChangeComplete', handleStop)
+    return () => {
+      router.events.off('routeChangeStart', handleStart)
+      router.events.off('routeChangeComplete', handleStop)
+      router.events.off('routeChangeError', handleStop)
+    }
+  }, [router])
+}
diff --git a/components/NotionPage.js b/components/NotionPage.js
index e6e82046e3e..fb68691afb3 100644
--- a/components/NotionPage.js
+++ b/components/NotionPage.js
@@ -1,13 +1,18 @@
-import { NotionRenderer } from 'react-notion-x'
 import dynamic from 'next/dynamic'
 import mediumZoom from '@fisch0920/medium-zoom'
-import React, { useEffect, useRef } from 'react'
-// import { Code } from 'react-notion-x/build/third-party/code'
-import TweetEmbed from 'react-tweet-embed'
+import { useEffect, useRef } from 'react'
 import 'katex/dist/katex.min.css'
 import { mapImgUrl } from '@/lib/notion/mapImage'
 import { isBrowser } from '@/lib/utils'
 import { siteConfig } from '@/lib/config'
+import { NotionRenderer } from 'react-notion-x'
+
+// Notion渲染
+// const NotionRenderer = dynamic(() => import('react-notion-x').then(async (m) => {
+//   return m.NotionRenderer
+// }), {
+//   ssr: false
+// })
 
 const Code = dynamic(() =>
   import('react-notion-x/build/third-party/code').then(async (m) => {
@@ -15,6 +20,7 @@ const Code = dynamic(() =>
   }), { ssr: false }
 )
 
+// 公式
 const Equation = dynamic(() =>
   import('@/components/Equation').then(async (m) => {
     // 化学方程式
@@ -36,6 +42,13 @@ const PrismMac = dynamic(() => import('@/components/PrismMac'), {
   ssr: false
 })
 
+/**
+ * tweet嵌入
+ */
+const TweetEmbed = dynamic(() => import('react-tweet-embed'), {
+  ssr: false
+})
+
 const Collection = dynamic(() =>
   import('react-notion-x/build/third-party/collection').then((m) => m.Collection), { ssr: true }
 )
diff --git a/components/ShareBar.js b/components/ShareBar.js
index ba773b06c00..334a5f128c2 100644
--- a/components/ShareBar.js
+++ b/components/ShareBar.js
@@ -1,28 +1,21 @@
 import { siteConfig } from '@/lib/config'
-import { useRouter } from 'next/router'
-import React from 'react'
-import ShareButtons from './ShareButtons'
+import dynamic from 'next/dynamic'
 
-const ShareBar = ({ post }) => {
-  const router = useRouter()
+const ShareButtons = dynamic(() => import('@/components/ShareButtons'), { ssr: false })
 
+/**
+ * 分享栏
+ * @param {} param0
+ * @returns
+ */
+const ShareBar = ({ post }) => {
   if (!JSON.parse(siteConfig('POST_SHARE_BAR_ENABLE')) || !post || post?.type !== 'Post') {
     return <></>
   }
 
-  const shareUrl = siteConfig('LINK') + router.asPath
-
   return <div className='m-1 overflow-x-auto'>
         <div className='flex w-full md:justify-end'>
-            <ShareButtons shareUrl={shareUrl} title={post.title} image={post.pageCover} body={
-                post?.title +
-                ' | ' +
-                siteConfig('TITLE') +
-                ' ' +
-                shareUrl +
-                ' ' +
-                post?.summary
-            } />
+            <ShareButtons post={post} />
         </div>
     </div>
 }
diff --git a/components/ShareButtons.js b/components/ShareButtons.js
index bbd06d7aa6c..e3714b79993 100644
--- a/components/ShareButtons.js
+++ b/components/ShareButtons.js
@@ -2,6 +2,7 @@ import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import copy from 'copy-to-clipboard'
 import dynamic from 'next/dynamic'
+import { useRouter } from 'next/router'
 import { useState } from 'react'
 
 import {
@@ -56,7 +57,13 @@ const QrCode = dynamic(() => import('@/components/QrCode'), { ssr: false })
  * @param {*} param0
  * @returns
  */
-const ShareButtons = ({ shareUrl, title, body, image }) => {
+const ShareButtons = ({ post }) => {
+  const router = useRouter()
+  const shareUrl = siteConfig('LINK') + router.asPath
+  const title = post.title || siteConfig('TITLE')
+  const image = post.pageCover
+  const body = post?.title + ' | ' + title + ' ' + shareUrl + ' ' + post?.summary
+
   const services = siteConfig('POSTS_SHARE_SERVICES').split(',')
   const titleWithSiteInfo = title + ' | ' + siteConfig('TITLE')
   const { locale } = useGlobal()
@@ -336,7 +343,7 @@ const ShareButtons = ({ shareUrl, title, body, image }) => {
               }
               if (singleService === 'qq') {
                 return <button key={singleService} className='cursor-pointer bg-blue-600 text-white rounded-full mx-1'>
-                        <a target='_blank' rel='noreferrer' href={`http://connect.qq.com/widget/shareqq/index.html?url=${shareUrl}&sharesource=qzone&title=${title}&desc=${body}`} >
+                        <a target='_blank' rel='noreferrer' aria-label="Share by QQ" href={`http://connect.qq.com/widget/shareqq/index.html?url=${shareUrl}&sharesource=qzone&title=${title}&desc=${body}`} >
                             <i className='fab fa-qq w-8' />
                         </a>
                     </button>
@@ -349,7 +356,7 @@ const ShareButtons = ({ shareUrl, title, body, image }) => {
                         <div className='absolute'>
                         <div id='pop' className={(qrCodeShow ? 'opacity-100 ' : ' invisible opacity-0') + ' z-40 absolute bottom-10 -left-10 bg-white shadow-xl transition-all duration-200 text-center'}>
                                 <div className='p-2 mt-1 w-28 h-28'>
-                                    <QrCode value={shareUrl}/>
+                                    { qrCodeShow && <QrCode value={shareUrl}/> }
                                 </div>
                                 <span className='text-black font-semibold p-1 rounded-t-lg text-sm mx-auto mb-1'>
                                     {locale.COMMON.SCAN_QR_CODE}
diff --git a/components/Tabs.js b/components/Tabs.js
index c497bd0c7f9..6f08aadac4d 100644
--- a/components/Tabs.js
+++ b/components/Tabs.js
@@ -39,7 +39,7 @@ const Tabs = ({ className, children }) => {
         <ul className='flex justify-center space-x-5 pb-4 dark:text-gray-400 text-gray-600 overflow-auto'>
             {children.map((item, index) => {
               return <li key={index}
-                    className={(currentTab === index ? 'font-black border-b-2 border-red-400 text-red-400 animate__animated animate__jello ' : 'font-extralight cursor-pointer') + ' text-sm font-sans '}
+                    className={(currentTab === index ? 'font-black border-b-2 border-red-600 text-red-600 animate__animated animate__jello ' : 'font-extralight cursor-pointer') + ' text-sm font-sans '}
                     onClick={() => {
                       tabClickHandle(index)
                     }}>
diff --git a/lib/config.js b/lib/config.js
index e26308259a3..465752392cf 100644
--- a/lib/config.js
+++ b/lib/config.js
@@ -63,6 +63,9 @@ export const siteConfig = (key, defaultVal = null, extendConfig = null) => {
     return defaultVal
   } else {
     if (typeof val === 'string') {
+      if (val === 'true' || val === 'false') {
+        return JSON.parse(val);
+      }
       return val;
     } else {
       try {
diff --git a/lib/global.js b/lib/global.js
index df119ac33de..28b79be3aaa 100644
--- a/lib/global.js
+++ b/lib/global.js
@@ -2,10 +2,7 @@ import { generateLocaleDict, initLocale } from './lang'
 import { createContext, useContext, useEffect, useState } from 'react'
 import { useRouter } from 'next/router'
 import { THEMES, initDarkMode, saveDarkModeToCookies } from '@/themes/theme'
-
-import BLOG from '@/blog.config'
-import NProgress from 'nprogress'
-
+import { APPEARANCE, LANG, THEME } from 'blog.config'
 const GlobalContext = createContext()
 
 /**
@@ -17,10 +14,10 @@ const GlobalContext = createContext()
 export function GlobalContextProvider(props) {
   const { children, siteInfo, categoryOptions, tagOptions, NOTION_CONFIG } = props
   const router = useRouter()
-  const [lang, updateLang] = useState(NOTION_CONFIG?.LANG || BLOG.LANG) // 默认语言
-  const [locale, updateLocale] = useState(generateLocaleDict(NOTION_CONFIG?.LANG || BLOG.LANG)) // 默认语言
-  const [theme, setTheme] = useState(NOTION_CONFIG?.THEME || BLOG.THEME) // 默认博客主题
-  const [isDarkMode, updateDarkMode] = useState(NOTION_CONFIG?.APPEARANCE || BLOG.APPEARANCE === 'dark') // 默认深色模式
+  const [lang, updateLang] = useState(NOTION_CONFIG?.LANG || LANG) // 默认语言
+  const [locale, updateLocale] = useState(generateLocaleDict(NOTION_CONFIG?.LANG || LANG)) // 默认语言
+  const [theme, setTheme] = useState(NOTION_CONFIG?.THEME || THEME) // 默认博客主题
+  const [isDarkMode, updateDarkMode] = useState(NOTION_CONFIG?.APPEARANCE || APPEARANCE === 'dark') // 默认深色模式
   const [onLoading, setOnLoading] = useState(false) // 抓取文章数据
 
   // 切换主题
@@ -62,7 +59,6 @@ export function GlobalContextProvider(props) {
   // 加载进度条
   useEffect(() => {
     const handleStart = (url) => {
-      NProgress.start()
       const { theme } = router.query
       if (theme && !url.includes(`theme=${theme}`)) {
         const newUrl = `${url}${url.includes('?') ? '&' : '?'}theme=${theme}`
@@ -71,7 +67,6 @@ export function GlobalContextProvider(props) {
       setOnLoading(true)
     }
     const handleStop = () => {
-      NProgress.done()
       setOnLoading(false)
     }
 
diff --git a/lib/notion/mapImage.js b/lib/notion/mapImage.js
index 4dcbd00cd30..7b0e16c28a0 100644
--- a/lib/notion/mapImage.js
+++ b/lib/notion/mapImage.js
@@ -87,10 +87,13 @@ const mapImgUrl = (img, block, type = 'block', from) => {
         ret = BLOG.RANDOM_IMAGE_URL
       }
     }
-    // 随机图片接口优化 防止因url一致而随机结果相同
-    const separator = ret.includes('?') ? '&' : '?'
-    // 拼接唯一识别参数，防止请求的图片被缓存
-    ret = `${ret.trim()}${separator}t=${block.id}`
+
+    // 图片url优化，确保每一篇文章的图片url唯一
+    if (ret && ret.length > 4) {
+      // 图片接口拼接唯一识别参数，防止请求的图片被缓，而导致随机结果相同
+      const separator = ret.includes('?') ? '&' : '?'
+      ret = `${ret.trim()}${separator}t=${block.id}`
+    }
   }
 
   // 文章封面
@@ -101,8 +104,13 @@ const mapImgUrl = (img, block, type = 'block', from) => {
   return ret
 }
 
+/**
+ * 是否是emoji图标
+ * @param {*} str
+ * @returns
+ */
 function isEmoji(str) {
-  const emojiRegex = /[\u{1F300}-\u{1F6FF}\u{1F1E0}-\u{1F1FF}\u{2600}-\u{26FF}\u{2700}-\u{27BF}\u{1F900}-\u{1F9FF}\u{1F018}-\u{1F270}]/u;
+  const emojiRegex = /[\u{1F300}-\u{1F6FF}\u{1F1E0}-\u{1F1FF}\u{2600}-\u{26FF}\u{2700}-\u{27BF}\u{1F900}-\u{1F9FF}\u{1F018}-\u{1F270}\u{238C}\u{2B06}\u{2B07}\u{2B05}\u{27A1}\u{2194}-\u{2199}\u{2194}\u{21A9}\u{21AA}\u{2934}\u{2935}\u{25AA}\u{25AB}\u{25FE}\u{25FD}\u{25FB}\u{25FC}\u{25B6}\u{25C0}\u{1F200}-\u{1F251}]/u;
   return emojiRegex.test(str);
 }
 
diff --git a/lib/utils.js b/lib/utils.js
index 30e0e038558..3f0d858e59c 100644
--- a/lib/utils.js
+++ b/lib/utils.js
@@ -7,6 +7,20 @@ import { memo } from 'react'
  */
 export const isBrowser = typeof window !== 'undefined'
 
+/**
+ * google机器人
+ * @returns
+ */
+export const isSearchEngineBot = () => {
+  if (typeof navigator === 'undefined') {
+    return false
+  }
+  // 获取用户代理字符串
+  const userAgent = navigator.userAgent;
+  // 使用正则表达式检测是否包含搜索引擎爬虫关键字
+  return /Googlebot|bingbot|Baidu/.test(userAgent)
+}
+
 /**
  * 组件持久化
  */
diff --git a/next.config.js b/next.config.js
index aff7992013e..6266fb48411 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,10 +1,11 @@
-const withBundleAnalyzer = require('@next/bundle-analyzer')({
-  enabled: process.env.ANALYZE === 'true'
-})
-
 const { THEME } = require('./blog.config')
 const fs = require('fs')
 const path = require('path')
+const BLOG = require('./blog.config')
+
+const withBundleAnalyzer = require('@next/bundle-analyzer')({
+  enabled: BLOG.BUNDLE_ANALYZER
+})
 
 /**
  * 扫描指定目录下的文件夹名，用于获取当前有几个主题
diff --git a/package.json b/package.json
index ca67780cc49..bac192ade91 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "notion-next",
-  "version": "4.1.0",
+  "version": "4.1.2",
   "homepage": "https://github.com/tangly1024/NotionNext.git",
   "license": "MIT",
   "repository": {
diff --git a/pages/_app.js b/pages/_app.js
index a19933cb5a3..711f10f608e 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -6,41 +6,38 @@ import '@/styles/utility-patterns.css'
 // core styles shared by all of react-notion-x (required)
 import 'react-notion-x/src/styles.css'
 import '@/styles/notion.css' //  重写部分样式
+import 'aos/dist/aos.css' // You can also use <link> for styles
 
 import { GlobalContextProvider } from '@/lib/global'
-
-import AOS from 'aos'
-import 'aos/dist/aos.css' // You can also use <link> for styles
 import { isBrowser, loadExternalResource } from '@/lib/utils'
-import BLOG from '@/blog.config'
-// 各种扩展插件 动画等
+
+// 各种扩展插件 这个要阻塞引入
 import ExternalPlugins from '@/components/ExternalPlugins'
-// const ExternalPlugins = dynamic(() => import('@/components/ExternalPlugins'))
+import { CUSTOM_EXTERNAL_CSS, CUSTOM_EXTERNAL_JS, IMG_SHADOW } from '@/blog.config'
 
 const MyApp = ({ Component, pageProps }) => {
   // 自定义样式css和js引入
   if (isBrowser) {
     // 初始化AOS动画
-    AOS.init()
     // 静态导入本地自定义样式
     loadExternalResource('/css/custom.css', 'css')
     loadExternalResource('/js/custom.js', 'js')
 
     // 自动添加图片阴影
-    if (BLOG.IMG_SHADOW) {
+    if (IMG_SHADOW) {
       loadExternalResource('/css/img-shadow.css', 'css')
     }
 
     // 导入外部自定义脚本
-    if (BLOG.CUSTOM_EXTERNAL_JS && BLOG.CUSTOM_EXTERNAL_JS.length > 0) {
-      for (const url of BLOG.CUSTOM_EXTERNAL_JS) {
+    if (CUSTOM_EXTERNAL_JS && CUSTOM_EXTERNAL_JS.length > 0) {
+      for (const url of CUSTOM_EXTERNAL_JS) {
         loadExternalResource(url, 'js')
       }
     }
 
     // 导入外部自定义样式
-    if (BLOG.CUSTOM_EXTERNAL_CSS && BLOG.CUSTOM_EXTERNAL_CSS.length > 0) {
-      for (const url of BLOG.CUSTOM_EXTERNAL_CSS) {
+    if (CUSTOM_EXTERNAL_CSS && CUSTOM_EXTERNAL_CSS.length > 0) {
+      for (const url of CUSTOM_EXTERNAL_CSS) {
         loadExternalResource(url, 'css')
       }
     }
diff --git a/styles/notion.css b/styles/notion.css
index 50ce45f3ae0..cd461c33930 100644
--- a/styles/notion.css
+++ b/styles/notion.css
@@ -1130,9 +1130,10 @@ code[class*='language-'] {
   transition: background 20ms ease-in 0s;
   cursor: pointer;
   width: 100%;
+  opacity: 0.9;
 
   padding: 6px 2px;
-  font-size: 14px;
+  font-size: 15px;
   line-height: 1.2;
   display: flex;
   align-items: center;
diff --git a/themes/example/components/Nav.js b/themes/example/components/Nav.js
index beb2c32eff8..01fbe03f4fc 100644
--- a/themes/example/components/Nav.js
+++ b/themes/example/components/Nav.js
@@ -36,8 +36,7 @@ export const Nav = (props) => {
         <nav className="w-full bg-white md:pt-0 px-6 relative z-20 border-t border-b border-gray-light dark:border-hexo-black-gray dark:bg-black">
             <div className="container mx-auto max-w-4xl md:flex justify-between items-center text-sm md:text-md md:justify-start">
                 <ul className="w-full text-center md:text-left flex flex-wrap justify-center items-stretch md:justify-start md:items-start">
-                    {/* {links.map(link => <NormalMenuItem key={link?.id} link={link}/>)} */}
-                    {links.map(link => <MenuItemDrop key={link?.id} link={link} />)}
+                    {links.map((link, index) => <MenuItemDrop key={index} link={link} />)}
                 </ul>
                 {/* <div className="w-full md:w-1/3 text-center md:text-right"> */}
                     {/* <!-- extra links --> */}
diff --git a/themes/fukasawa/components/BlogCard.js b/themes/fukasawa/components/BlogCard.js
index ba73eaedbe7..8b68a26a53b 100644
--- a/themes/fukasawa/components/BlogCard.js
+++ b/themes/fukasawa/components/BlogCard.js
@@ -61,8 +61,7 @@ const BlogCard = ({ index, post, showSummary, siteInfo }) => {
                         </Link>}
                         <div className="md:flex-nowrap flex-wrap md:justify-start inline-block">
                             <div>
-
-                                {post.tagItems.map((tag) => (
+                                {post.tagItems?.map((tag) => (
                                     <TagItemMini key={tag.name} tag={tag} />
                                 ))}
                             </div>
diff --git a/themes/fukasawa/index.js b/themes/fukasawa/index.js
index 7ab72892198..3786c20d4b7 100644
--- a/themes/fukasawa/index.js
+++ b/themes/fukasawa/index.js
@@ -48,12 +48,14 @@ const LayoutBase = (props) => {
   const leftAreaSlot = <Live2D />
   const { onLoading } = useGlobal()
 
+  const FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT = siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT', null, CONFIG)
+
   // 侧边栏折叠从 本地存储中获取 open 状态的初始值
   const [isCollapsed, setIsCollapse] = useState(() => {
     if (typeof window !== 'undefined') {
-      return localStorage.getItem('fukasawa-sidebar-collapse') === 'true' || siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT', null, CONFIG)
+      return localStorage.getItem('fukasawa-sidebar-collapse') === 'true' || FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT
     }
-    return siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT', null, CONFIG)
+    return FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT
   })
 
   // 在组件卸载时保存 open 状态到本地存储中
diff --git a/themes/gitbook/components/MenuBarMobile.js b/themes/gitbook/components/MenuBarMobile.js
index 4a361a2f375..5b0f6ce51f2 100644
--- a/themes/gitbook/components/MenuBarMobile.js
+++ b/themes/gitbook/components/MenuBarMobile.js
@@ -30,9 +30,7 @@ export const MenuBarMobile = (props) => {
 
   return (
     <nav id='nav' className=' text-md'>
-        {/* {links.map(link => <NormalMenu key={link?.id} link={link}/>)} */}
         {links?.map((link, index) => <MenuItemCollapse onHeightChange={props.onHeightChange} key={index} link={link}/>)}
-
     </nav>
   )
 }
diff --git a/themes/heo/components/InfoCard.js b/themes/heo/components/InfoCard.js
index fd659aa338d..4fad98ac976 100644
--- a/themes/heo/components/InfoCard.js
+++ b/themes/heo/components/InfoCard.js
@@ -18,7 +18,6 @@ export function InfoCard(props) {
   const router = useRouter()
   // 在文章详情页特殊处理
   const isSlugPage = router.pathname.indexOf('/[prefix]') === 0
-  console.log('TITLE:', siteConfig('TITLE'))
   return (
         <Card className='bg-[#4f65f0] dark:bg-yellow-600 text-white flex flex-col w-72 overflow-hidden relative'>
             {/* 信息卡牌第一行 */}
diff --git a/themes/heo/components/MenuListSide.js b/themes/heo/components/MenuListSide.js
index dc364d43269..fa6d42a19bf 100644
--- a/themes/heo/components/MenuListSide.js
+++ b/themes/heo/components/MenuListSide.js
@@ -29,8 +29,7 @@ export const MenuListSide = (props) => {
 
   return (
         <nav className='flex-col space-y-2'>
-            {/* {links.map(link => <MenuItemNormal key={link?.id} link={link} />)} */}
-            {links?.map(link => <MenuItemCollapse key={link?.id} link={link} />)}
+            {links?.map((link, index) => <MenuItemCollapse key={index} link={link} />)}
         </nav>
   )
 }
diff --git a/themes/hexo/components/MenuListSide.js b/themes/hexo/components/MenuListSide.js
index e47c9a719e6..3a146d430c8 100644
--- a/themes/hexo/components/MenuListSide.js
+++ b/themes/hexo/components/MenuListSide.js
@@ -35,8 +35,7 @@ export const MenuListSide = (props) => {
 
   return (
         <nav>
-            {/* {links.map(link => <MenuItemNormal key={link?.id} link={link} />)} */}
-            {links?.map(link => <MenuItemCollapse key={link?.id} link={link} />)}
+            {links?.map((link, index) => <MenuItemCollapse key={index} link={link} />)}
         </nav>
   )
 }
diff --git a/themes/hexo/components/MenuListTop.js b/themes/hexo/components/MenuListTop.js
index 8fc8b37b222..f5d2c9cdfee 100644
--- a/themes/hexo/components/MenuListTop.js
+++ b/themes/hexo/components/MenuListTop.js
@@ -36,7 +36,7 @@ export const MenuListTop = (props) => {
 
   return (<>
         <nav id='nav-mobile' className='leading-8 justify-center font-light w-full flex'>
-            {links?.map(link => link && link.show && <MenuItemDrop key={link?.id} link={link} />)}
+            {links?.map((link, index) => link && link.show && <MenuItemDrop key={index} link={link} />)}
         </nav>
     </>)
 }
diff --git a/themes/matery/components/MenuListSide.js b/themes/matery/components/MenuListSide.js
index ba8a6f22b49..8d97afca71c 100644
--- a/themes/matery/components/MenuListSide.js
+++ b/themes/matery/components/MenuListSide.js
@@ -29,8 +29,7 @@ export const MenuListSide = (props) => {
 
   return (
         <nav>
-            {/* {links.map(link => <MenuItemNormal key={link?.id} link={link} />)} */}
-            {links?.map(link => <MenuItemCollapse key={link?.id} link={link} />)}
+            {links?.map((link, index) => <MenuItemCollapse key={index} link={link} />)}
         </nav>
   )
 }
diff --git a/themes/matery/components/MenuListTop.js b/themes/matery/components/MenuListTop.js
index 580fe6b994d..506f9c59167 100644
--- a/themes/matery/components/MenuListTop.js
+++ b/themes/matery/components/MenuListTop.js
@@ -29,7 +29,7 @@ export const MenuListTop = (props) => {
 
   return (
     <nav id='nav' className='leading-8 flex justify-center  font-light w-full'>
-      {links?.map(link => <MenuItemDrop key={link?.id} link={link}/>)}
+      {links?.map((link, index) => <MenuItemDrop key={index} link={link}/>)}
     </nav>
   )
 }
diff --git a/themes/medium/components/MenuBarMobile.js b/themes/medium/components/MenuBarMobile.js
index 1e7081cb0c6..b5736e28c57 100644
--- a/themes/medium/components/MenuBarMobile.js
+++ b/themes/medium/components/MenuBarMobile.js
@@ -30,8 +30,7 @@ export const MenuBarMobile = (props) => {
 
   return (
     <nav id='nav' className=' text-md'>
-        {/* {links.map(link => <NormalMenu key={link?.id} link={link}/>)} */}
-        {links?.map(link => <MenuItemCollapse onHeightChange={props.onHeightChange} key={link?.id} link={link}/>)}
+        {links?.map((link, index) => <MenuItemCollapse onHeightChange={props.onHeightChange} key={index} link={link}/>)}
 
     </nav>
   )
diff --git a/themes/medium/components/TopNavBar.js b/themes/medium/components/TopNavBar.js
index 8bd3b799282..d22ab395f0a 100644
--- a/themes/medium/components/TopNavBar.js
+++ b/themes/medium/components/TopNavBar.js
@@ -66,7 +66,7 @@ export default function TopNavBar(props) {
 
                 {/* 桌面端顶部菜单 */}
                 <div className='hidden md:flex'>
-                    {links && links?.map(link => <MenuItemDrop key={link?.id} link={link}/>)}
+                    {links && links?.map((link, index) => <MenuItemDrop key={index} link={link}/>)}
                 </div>
             </div>
         </div>
diff --git a/themes/nav/components/MenuBarMobile.js b/themes/nav/components/MenuBarMobile.js
index b80cae65385..754d2a36c56 100755
--- a/themes/nav/components/MenuBarMobile.js
+++ b/themes/nav/components/MenuBarMobile.js
@@ -35,9 +35,7 @@ export const MenuBarMobile = (props) => {
 
   return (
     <nav id='nav' className=' text-md'>
-        {/* {links.map(link => <NormalMenu key={link?.id} link={link}/>)} */}
         {links?.map((link, index) => <MenuItemCollapse onHeightChange={props.onHeightChange} key={index} link={link}/>)}
-
     </nav>
   )
 }
diff --git a/themes/nav/components/MenuItem.js b/themes/nav/components/MenuItem.js
index a5b35916cf4..9eeb5ecf018 100644
--- a/themes/nav/components/MenuItem.js
+++ b/themes/nav/components/MenuItem.js
@@ -24,7 +24,7 @@ export const MenuItem = ({ link }) => {
         {/* 菜单 */}
         <div
             onClick={toggleOpenSubMenu}
-            className='nav-menu dark:text-neutral-400 text-gray-500 hover:text-black dark:hover:text-white text-sm text-gray w-full items-center duration-300 pt-2 font-light select-none flex justify-between cursor-pointer' key={link?.name}>
+            className='nav-menu dark:text-neutral-400 text-gray-500 hover:text-black dark:hover:text-white text-sm text-gray w-full items-center duration-300 pt-2 font-light select-none flex justify-between cursor-pointer' key={link?.to}>
 
             {link?.subMenus
               ? (<>
diff --git a/themes/nobelium/components/Nav.js b/themes/nobelium/components/Nav.js
index dfa4046b84d..38253b43ac7 100644
--- a/themes/nobelium/components/Nav.js
+++ b/themes/nobelium/components/Nav.js
@@ -104,12 +104,12 @@ const NavBar = props => {
   return (
         <div className="flex-shrink-0 flex">
             <ul className="hidden md:flex flex-row">
-                {links?.map(link => <MenuItemDrop key={link?.id} link={link} />)}
+                {links?.map((link, index) => <MenuItemDrop key={index} link={link} />)}
             </ul>
             <div className='md:hidden'>
                 <Collapse collapseRef={collapseRef} isOpen={isOpen} type='vertical' className='fixed top-16 right-6'>
                     <div className='dark:border-black bg-white dark:bg-black rounded border p-2 text-sm'>
-                        {links?.map(link => <MenuItemCollapse key={link?.id} link={link} onHeightChange={(param) => collapseRef.current?.updateCollapseHeight(param)}/>)}
+                        {links?.map((link, index) => <MenuItemCollapse key={index} link={link} onHeightChange={(param) => collapseRef.current?.updateCollapseHeight(param)}/>)}
                     </div>
                 </Collapse>
             </div>
diff --git a/themes/plog/components/BottomNav.js b/themes/plog/components/BottomNav.js
index d9bd58a7066..3a0fbb278a5 100644
--- a/themes/plog/components/BottomNav.js
+++ b/themes/plog/components/BottomNav.js
@@ -54,7 +54,7 @@ const MenuList = props => {
   return (
         <div className="flex-shrink-0">
             <ul className="hidden md:flex flex-row">
-                {links?.map(link => <MenuItemDrop key={link?.id} link={link} />)}
+                {links?.map((link, index) => <MenuItemDrop key={index} link={link} />)}
                 <li className='my-auto px-2'>
                     <FullScreenButton />
                 </li>
diff --git a/themes/plog/components/Nav.js b/themes/plog/components/Nav.js
index a65beaffd98..b01fab105b8 100644
--- a/themes/plog/components/Nav.js
+++ b/themes/plog/components/Nav.js
@@ -70,12 +70,12 @@ const NavBar = props => {
   return (
         <div className="flex-shrink-0">
             <ul className=" hidden md:flex flex-row">
-                {links?.map(link => <MenuItemDrop key={link?.id} link={link} />)}
+                {links?.map((link, index) => <MenuItemDrop key={index} link={link} />)}
             </ul>
             <div className='md:hidden'><i onClick={toggleOpen} className='fas fa-bars cursor-pointer px-5 block md:hidden'></i>
                 <Collapse collapseRef={collapseRef} isOpen={isOpen} type='vertical' className='fixed top-16 right-6'>
                     <div className='dark:border-black bg-white dark:bg-black rounded border p-2 text-sm'>
-                        {links?.map(link => <MenuItemCollapse key={link?.id} link={link} onHeightChange={(param) => collapseRef.current?.updateCollapseHeight(param)} />)}
+                        {links?.map((link, index) => <MenuItemCollapse key={index} link={link} onHeightChange={(param) => collapseRef.current?.updateCollapseHeight(param)} />)}
                     </div>
                 </Collapse>
             </div>
diff --git a/themes/simple/components/ArticleInfo.js b/themes/simple/components/ArticleInfo.js
index 26c13a9356a..f4d3f7fcba8 100644
--- a/themes/simple/components/ArticleInfo.js
+++ b/themes/simple/components/ArticleInfo.js
@@ -4,29 +4,33 @@ import CONFIG from '../config'
 import { siteConfig } from '@/lib/config'
 import { formatDateFmt } from '@/lib/formatDate'
 
-export const ArticleInfo = (props) => {
+/**
+ * 文章描述
+ * @param {*} props
+ * @returns
+ */
+export default function ArticleInfo (props) {
   const { post } = props
 
   const { locale } = useGlobal()
 
   return (
-        <section className="flex-wrap flex mt-2 text-gray-400 dark:text-gray-400 font-light leading-8">
-            <div>
-                <h2
-                    className="blog-item-title mb-5 font-bold text-black text-xl md:text-2xl no-underline">
-                    {post?.title}
-                </h2>
+        <section className="mt-2 text-gray-600 dark:text-gray-400 leading-8">
+            <h2
+                className="blog-item-title mb-5 font-bold text-black text-xl md:text-2xl no-underline">
+                {post?.title}
+            </h2>
 
-                {post?.type !== 'Page' && (<>
-                    <div className="mb-4 text-sm text-gray-700 dark:text-gray-300">
+            <div className='flex flex-wrap text-gray-700 dark:text-gray-300'>
+                {post?.type !== 'Page' && (
+                    <div className="space-x-3 mr-4">
                         <span> <i className="fa-regular fa-user"></i> <a href={siteConfig('SIMPLE_AUTHOR_LINK', null, CONFIG)}>{siteConfig('AUTHOR')}</a></span>
-                        <span> - <i className="fa-regular fa-clock"></i> {post?.publishDay}</span>
-                        {post?.category && <span> - <i className="fa-regular fa-folder"></i> <a href={`/category/${post?.category}`} className="hover:text-red-400 transition-all duration-200">{post?.category}</a></span>}
+                        <span> <i className="fa-regular fa-clock"></i> {post?.publishDay}</span>
+                        {post?.category && <span>  <i className="fa-regular fa-folder"></i> <a href={`/category/${post?.category}`} className="hover:text-red-400 transition-all duration-200">{post?.category}</a></span>}
                         {post?.tags && post?.tags?.length > 0 && post?.tags.map(t => <span key={t}> / <Link href={`/tag/${t}`}><span className=' hover:text-red-400 transition-all duration-200'>{t}</span></Link></span>)}
-                    </div>
-                </>)}
+                    </div>)}
 
-                {post?.type !== 'Page' && (<>
+                {post?.type !== 'Page' && (<div className=''>
                     <span>{locale.COMMON.POST_TIME}:
                         <Link
                             href={`/archive#${formatDateFmt(post?.publishDate, 'yyyy-MM')}`}
@@ -36,7 +40,7 @@ export const ArticleInfo = (props) => {
                         </Link>
                     </span>
                     <span className='mr-2'>|</span>
-                    <span className='mx-2 text-gray-400 dark:text-gray-500'>
+                    <span className='mx-2  dark:text-gray-500'>
                         {locale.COMMON.LAST_EDITED_TIME}: {post?.lastEditedDay}
                     </span>
                     <span className='mr-2'>|</span>
@@ -45,10 +49,9 @@ export const ArticleInfo = (props) => {
                         &nbsp;
                         <span className="mr-2 busuanzi_value_page_pv" />
                     </span>
-                </>)}
+                </div>)}
 
             </div>
-
         </section>
   )
 }
diff --git a/themes/simple/components/ArticleLock.js b/themes/simple/components/ArticleLock.js
index 4957946d86e..eb1d10efa6e 100644
--- a/themes/simple/components/ArticleLock.js
+++ b/themes/simple/components/ArticleLock.js
@@ -8,7 +8,7 @@ import { useEffect, useRef } from 'react'
  * @param validPassword(bool) 回调函数，校验正确回调入参为true
  * @returns
  */
-export const ArticleLock = props => {
+export default function ArticleLock (props) {
   const { validPassword } = props
   const { locale } = useGlobal()
 
diff --git a/themes/simple/components/BlogItem.js b/themes/simple/components/BlogItem.js
index 2fb2d7aebae..8d682e11de2 100644
--- a/themes/simple/components/BlogItem.js
+++ b/themes/simple/components/BlogItem.js
@@ -3,43 +3,60 @@ import CONFIG from '../config'
 import TwikooCommentCount from '@/components/TwikooCommentCount'
 import { formatDateFmt } from '@/lib/formatDate'
 import { siteConfig } from '@/lib/config'
+import LazyImage from '@/components/LazyImage'
 
 export const BlogItem = props => {
   const { post } = props
+  const showPageCover = siteConfig('SIMPLE_POST_COVER_ENABLE', false, CONFIG)
 
   return <div key={post.id} className="h-42 my-6 pb-12 border-b dark:border-gray-800" >
         {/* 文章标题 */}
 
-        <h2 className="mb-2">
-            <Link
-                href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
-                className="blog-item-title font-bold text-black text-2xl menu-link">
-                {post.title}
-            </Link>
-        </h2>
-
-        {/* 文章信息 */}
+        <div className='flex'>
+            <div className='article-cover h-full'>
+                {/* 图片封面 */}
+                {showPageCover && (
+                    <div className="overflow-hidden mr-2 w-56 h-full">
+                        <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
+                            <LazyImage src={post?.pageCoverThumbnail} className='w-56 h-full object-cover object-center group-hover:scale-110 duration-500' />
+                        </Link>
+                    </div>
+                )}
+            </div>
 
-        <div className="mb-5 text-md text-gray-700 dark:text-gray-300 flex-wrap flex leading-6">
-            <div className='space-x-2'>
-                <span>  <a href={siteConfig('SIMPLE_AUTHOR_LINK', null, CONFIG)} className='p-1 hover:text-red-400 transition-all duration-200'><i className="fa-regular fa-user"></i> {siteConfig('AUTHOR')}</a></span>
-                <span>
-                    <Link className='p-1 hover:text-red-400 transition-all duration-200' href={`/archive#${formatDateFmt(post?.publishDate, 'yyyy-MM')}`}>
-                        <i className="fa-regular fa-clock" /> {post.date?.start_date || post.createdTime}
+            <div className='article-info'>
+                <h2 className="mb-2">
+                    <Link
+                        href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
+                        className="blog-item-title font-bold text-black text-2xl menu-link">
+                        {post.title}
                     </Link>
-                </span>
-                <span><TwikooCommentCount post={post} /></span>
-            </div>
+                </h2>
 
-            <div>
-                {post.category && <Link href={`/category/${post.category}`} className='p-1'> <span className="hover:text-red-400 transition-all duration-200"><i className="fa-regular fa-folder mr-0.5"/>{post.category}</span></Link>}
-                {post?.tags && post?.tags?.length > 0 && post?.tags.map(t => <Link key={t} href={`/tag/${t}`} className=' hover:text-red-400 transition-all duration-200'><span > /{t}</span></Link>)}
-            </div>
-        </div>
+                {/* 文章信息 */}
+
+                <div className="mb-5 text-md text-gray-700 dark:text-gray-300 flex-wrap flex leading-6">
+                    <div className='space-x-2'>
+                        <span>  <a href={siteConfig('SIMPLE_AUTHOR_LINK', null, CONFIG)} className='p-1 hover:text-red-400 transition-all duration-200'><i className="fa-regular fa-user"></i> {siteConfig('AUTHOR')}</a></span>
+                        <span>
+                            <Link className='p-1 hover:text-red-400 transition-all duration-200' href={`/archive#${formatDateFmt(post?.publishDate, 'yyyy-MM')}`}>
+                                <i className="fa-regular fa-clock" /> {post.date?.start_date || post.createdTime}
+                            </Link>
+                        </span>
+                        <span><TwikooCommentCount post={post} /></span>
+                    </div>
 
-        <div className="text-gray-700 dark:text-gray-300 leading-normal mb-6">
-            {post.summary}
-            {post.summary && <span>...</span>}
+                    <div>
+                        {post.category && <Link href={`/category/${post.category}`} className='p-1'> <span className="hover:text-red-400 transition-all duration-200"><i className="fa-regular fa-folder mr-0.5" />{post.category}</span></Link>}
+                        {post?.tags && post?.tags?.length > 0 && post?.tags.map(t => <Link key={t} href={`/tag/${t}`} className=' hover:text-red-400 transition-all duration-200'><span > /{t}</span></Link>)}
+                    </div>
+                </div>
+
+                <div className="text-gray-700 dark:text-gray-300 leading-normal mb-6">
+                    {post.summary}
+                    {post.summary && <span>...</span>}
+                </div>
+            </div>
         </div>
 
         <div className='block'>
diff --git a/themes/simple/components/BlogListPage.js b/themes/simple/components/BlogListPage.js
index f09fb80194b..b0e6720cc0d 100644
--- a/themes/simple/components/BlogListPage.js
+++ b/themes/simple/components/BlogListPage.js
@@ -4,13 +4,22 @@ import Link from 'next/link'
 import { BlogItem } from './BlogItem'
 import { AdSlot } from '@/components/GoogleAdsense'
 import { siteConfig } from '@/lib/config'
+import CONFIG from '../config'
 
-export const BlogListPage = props => {
+/**
+ * 博客列表
+ * @param {*} props
+ * @returns
+ */
+export default function BlogListPage(props) {
   const { page = 1, posts, postCount } = props
   const router = useRouter()
   const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
   const currentPage = +page
 
+  // 博客列表嵌入广告
+  const SIMPLE_POST_AD_ENABLE = siteConfig('SIMPLE_POST_AD_ENABLE', false, CONFIG)
+
   const showPrev = currentPage > 1
   const showNext = page < totalPage
   const pagePrefix = router.asPath.split('?')[0].replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
@@ -20,9 +29,9 @@ export const BlogListPage = props => {
 
             <div id="posts-wrapper">
                 {posts?.map((p, index) => (<div key={p.id}>
-                        {(index + 1) % 3 === 0 && <AdSlot type='in-article' />}
-                        { (index + 1) === 4 && <AdSlot type='flow'/>}
-                        <BlogItem post={p} />
+                    {SIMPLE_POST_AD_ENABLE && (index + 1) % 3 === 0 && <AdSlot type='in-article' />}
+                    {SIMPLE_POST_AD_ENABLE && (index + 1) === 4 && <AdSlot type='flow' />}
+                    <BlogItem post={p} />
                 </div>))}
 
             </div>
diff --git a/themes/simple/components/BlogListScroll.js b/themes/simple/components/BlogListScroll.js
index 8ae37cc8bc6..d68745f3d17 100644
--- a/themes/simple/components/BlogListScroll.js
+++ b/themes/simple/components/BlogListScroll.js
@@ -4,7 +4,12 @@ import throttle from 'lodash.throttle'
 import { BlogItem } from './BlogItem'
 import { siteConfig } from '@/lib/config'
 
-export const BlogListScroll = props => {
+/**
+ * 滚动博客列表
+ * @param {*} props
+ * @returns
+ */
+export default function BlogListScroll (props) {
   const { posts } = props
   const { locale } = useGlobal()
 
diff --git a/themes/simple/components/Catalog.js b/themes/simple/components/Catalog.js
index 54f0d69fe41..c84ca9b39fb 100644
--- a/themes/simple/components/Catalog.js
+++ b/themes/simple/components/Catalog.js
@@ -57,31 +57,33 @@ const Catalog = ({ post }) => {
   }
 
   return <div className='px-3 '>
-    <div className='dark:text-white'><i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}</div>
+        <div className='dark:text-white mb-2'>
+            <i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}
+        </div>
 
-    <div className='overflow-y-auto overscroll-none max-h-36 lg:max-h-96 scroll-hidden' ref={tRef}>
-      <nav className='h-full  text-black'>
-        {post?.toc?.map((tocItem) => {
-          const id = uuidToId(tocItem.id)
-          return (
-            <a
-              key={id}
-              href={`#${id}`}
-              className={`notion-table-of-contents-item duration-300 transform font-light dark:text-gray-200
+        <div className='overflow-y-auto overscroll-none max-h-36 lg:max-h-96 scroll-hidden' ref={tRef}>
+            <nav className='h-full  text-black'>
+                {post?.toc?.map((tocItem) => {
+                  const id = uuidToId(tocItem.id)
+                  return (
+                        <a
+                            key={id}
+                            href={`#${id}`}
+                            className={`notion-table-of-contents-item duration-300 transform dark:text-gray-200
             notion-table-of-contents-item-indent-level-${tocItem.indentLevel} `}
-            >
-              <span style={{ display: 'inline-block', marginLeft: tocItem.indentLevel * 16 }}
-                className={`${activeSection === id && ' font-bold text-red-500 underline overflow-ellipsis truncate'}`}
-              >
-                {tocItem.text}
-              </span>
-            </a>
-          )
-        })}
-      </nav>
+                        >
+                            <span style={{ display: 'inline-block', marginLeft: tocItem.indentLevel * 16 }}
+                                className={`${activeSection === id && ' font-bold text-red-600 underline overflow-ellipsis truncate'}`}
+                            >
+                                {tocItem.text}
+                            </span>
+                        </a>
+                  )
+                })}
+            </nav>
 
+        </div>
     </div>
-  </div>
 }
 
 export default Catalog
diff --git a/themes/simple/components/Footer.js b/themes/simple/components/Footer.js
index d902f341391..4e3c8c45afd 100644
--- a/themes/simple/components/Footer.js
+++ b/themes/simple/components/Footer.js
@@ -1,7 +1,12 @@
 import DarkModeButton from '@/components/DarkModeButton'
 import { siteConfig } from '@/lib/config'
 
-export const Footer = (props) => {
+/**
+ * 页脚
+ * @param {*} props
+ * @returns
+ */
+export default function Footer (props) {
   const d = new Date()
   const currentYear = d.getFullYear()
   const since = siteConfig('SINCE')
diff --git a/themes/simple/components/Header.js b/themes/simple/components/Header.js
index a5bc8988aeb..96f504cf513 100644
--- a/themes/simple/components/Header.js
+++ b/themes/simple/components/Header.js
@@ -3,14 +3,15 @@ import Link from 'next/link'
 import CONFIG from '../config'
 import SocialButton from './SocialButton'
 import { siteConfig } from '@/lib/config'
+import { compressImage } from '@/lib/notion/mapImage'
 
 /**
  * 网站顶部
  * @returns
  */
-export const Header = (props) => {
+export default function Header (props) {
   const { siteInfo } = props
-  const avatar = siteInfo?.icon || siteConfig('AVATAR')
+  const avatar = compressImage(siteInfo?.icon || siteConfig('AVATAR'), 200)
 
   return (
         <header className="text-center justify-between items-center px-6 bg-white h-80 dark:bg-black relative z-10">
@@ -18,8 +19,8 @@ export const Header = (props) => {
                 <Link href='/'>
                     {/* 可使用一张单图作为logo */}
                     <div className='flex space-x-6'>
-                        <div className='hover:rotate-45 hover:scale-125 transform duration-200 cursor-pointer'>
-                            <LazyImage src={avatar} className='rounded-full' width={130} height={130} alt={siteConfig('AUTHOR')} />
+                        <div className='hover:rotate-45 hover:scale-125 transform duration-200 cursor-pointer justify-center items-center flex'>
+                            <LazyImage priority={true} src={avatar} className='rounded-full' width={100} height={100} alt={siteConfig('AUTHOR')} />
                         </div>
 
                         <div className='flex-col flex justify-center'>
diff --git a/themes/simple/components/MenuList.js b/themes/simple/components/MenuList.js
index 13dfe9a5d60..ec9700bf136 100644
--- a/themes/simple/components/MenuList.js
+++ b/themes/simple/components/MenuList.js
@@ -51,7 +51,7 @@ export const MenuList = ({ customNav, customMenu }) => {
   return (<>
         {/* 大屏模式菜单 */}
         <div id='nav-menu-pc' className='hidden md:flex my-auto'>
-            {links?.map(link => <MenuItemDrop key={link?.id} link={link} />)}
+            {links?.map((link, index) => <MenuItemDrop key={index} link={link} />)}
         </div>
         {/* 移动端小屏菜单 */}
         <div id='nav-menu-mobile' className='flex md:hidden my-auto justify-start'>
@@ -62,7 +62,7 @@ export const MenuList = ({ customNav, customMenu }) => {
 
             <Collapse collapseRef={collapseRef} className='absolute w-full top-12 left-0' isOpen={isOpen}>
                 <div id='menu-wrap' className='bg-white dark:border-hexo-black-gray border'>
-                {links?.map(link => <MenuItemCollapse key={link?.id} link={link} onHeightChange={(param) => collapseRef.current?.updateCollapseHeight(param)}/>)}
+                {links?.map((link, index) => <MenuItemCollapse key={index} link={link} onHeightChange={(param) => collapseRef.current?.updateCollapseHeight(param)}/>)}
                 </div>
             </Collapse>
         </div>
diff --git a/themes/simple/components/NavBar.js b/themes/simple/components/NavBar.js
index 08506396fd6..db3033ca4ba 100644
--- a/themes/simple/components/NavBar.js
+++ b/themes/simple/components/NavBar.js
@@ -7,7 +7,7 @@ import { MenuList } from './MenuList'
  * @param {*} props
  * @returns
  */
-export const NavBar = (props) => {
+export default function NavBar (props) {
   const [showSearchInput, changeShowSearchInput] = useState(false)
   const router = useRouter()
 
diff --git a/themes/simple/components/SideBar.js b/themes/simple/components/SideBar.js
index 44c4bd0b40f..6ff2075c7b2 100644
--- a/themes/simple/components/SideBar.js
+++ b/themes/simple/components/SideBar.js
@@ -3,7 +3,12 @@ import Live2D from '@/components/Live2D'
 import Announcement from './Announcement'
 import Catalog from './Catalog'
 
-export const SideBar = (props) => {
+/**
+ * 侧边栏
+ * @param {*} props
+ * @returns
+ */
+export default function SideBar (props) {
   const { notice } = props
   return (<>
 
diff --git a/themes/simple/components/SocialButton.js b/themes/simple/components/SocialButton.js
index 0e2b9065b25..b9def55b706 100644
--- a/themes/simple/components/SocialButton.js
+++ b/themes/simple/components/SocialButton.js
@@ -6,8 +6,8 @@ import { siteConfig } from '@/lib/config'
  * @constructor
  */
 const SocialButton = () => {
-  return <div className='w-52 justify-center flex-wrap flex'>
-    <div className='space-x-3 md:text-xl text-3xl text-gray-600 dark:text-gray-400 text-center'>
+  return <div className='w-52 justify-center flex-wrap flex my-2'>
+    <div className='space-x-5 md:text-xl text-3xl text-gray-600 dark:text-gray-400 text-center'>
       {siteConfig('CONTACT_GITHUB') && <a target='_blank' rel='noreferrer' title={'github'} href={siteConfig('CONTACT_GITHUB')} >
         <i className='fab fa-github transform hover:scale-125 duration-150'/>
       </a>}
diff --git a/themes/simple/components/TopBar.js b/themes/simple/components/TopBar.js
index 05e3cd7b500..e9224de850f 100644
--- a/themes/simple/components/TopBar.js
+++ b/themes/simple/components/TopBar.js
@@ -5,11 +5,13 @@ import { siteConfig } from '@/lib/config'
  * 网站顶部 提示栏
  * @returns
  */
-export const TopBar = (props) => {
-  if (siteConfig('SIMPLE_TOP_BAR_CONTENT', null, CONFIG)) {
+export default function TopBar (props) {
+  const content = siteConfig('SIMPLE_TOP_BAR_CONTENT', null, CONFIG)
+
+  if (content) {
     return <header className="flex justify-center items-center bg-black dark:bg-hexo-black-gray">
        <div id='top-bar-inner' className='max-w-9/10 w-full z-20'>
-       <div className='text-xs text-center float-left text-white z-50 leading-5 py-2.5' dangerouslySetInnerHTML={{ __html: siteConfig('SIMPLE_TOP_BAR_CONTENT', null, CONFIG) }}/>
+       <div className='text-xs text-center float-left text-white z-50 leading-5 py-2.5' dangerouslySetInnerHTML={{ __html: content }}/>
        </div>
     </header>
   }
diff --git a/themes/simple/config.js b/themes/simple/config.js
index dcaf8c54bc7..bbacb396ee9 100644
--- a/themes/simple/config.js
+++ b/themes/simple/config.js
@@ -7,6 +7,10 @@ const CONFIG = {
 
   SIMPLE_AUTHOR_LINK: process.env.NEXT_PUBLIC_AUTHOR_LINK || '#',
 
+  SIMPLE_POST_AD_ENABLE: process.env.NEXT_PUBLIC_SIMPLE_POST_AD_ENABLE || false, // 文章列表是否插入广告
+
+  SIMPLE_POST_COVER_ENABLE: process.env.NEXT_PUBLIC_SIMPLE_POST_COVER_ENABLE || false, // 是否展示博客封面
+
   // 菜单配置
   SIMPLE_MENU_CATEGORY: true, // 显示分类
   SIMPLE_MENU_TAG: true, // 显示标签
diff --git a/themes/simple/index.js b/themes/simple/index.js
index aebb9d21ba5..8295d62181f 100644
--- a/themes/simple/index.js
+++ b/themes/simple/index.js
@@ -1,30 +1,35 @@
 import CONFIG from './config'
-import { BlogListPage } from './components/BlogListPage'
-import { BlogListScroll } from './components/BlogListScroll'
 import { useEffect } from 'react'
-import { isBrowser, loadExternalResource } from '@/lib/utils'
-import BlogArchiveItem from './components/BlogArchiveItem'
-import { ArticleLock } from './components/ArticleLock'
-import NotionPage from '@/components/NotionPage'
-import { ArticleInfo } from './components/ArticleInfo'
-import Comment from '@/components/Comment'
-import ArticleAround from './components/ArticleAround'
-import ShareBar from '@/components/ShareBar'
+import { isBrowser } from '@/lib/utils'
+import { useGlobal } from '@/lib/global'
 import { AdSlot } from '@/components/GoogleAdsense'
-import Link from 'next/link'
-import { TopBar } from './components/TopBar'
-import { Header } from './components/Header'
-import { NavBar } from './components/NavBar'
 import { siteConfig } from '@/lib/config'
-import { SideBar } from './components/SideBar'
-import JumpToTopButton from './components/JumpToTopButton'
-import { Footer } from './components/Footer'
-import { useGlobal } from '@/lib/global'
-import SearchInput from './components/SearchInput'
 import { Transition } from '@headlessui/react'
+import Link from 'next/link'
 import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
-import CommonHead from '@/components/CommonHead'
+import dynamic from 'next/dynamic'
+import NotionPage from '@/components/NotionPage'
+// const NotionPage = dynamic(() => import('@/components/NotionPage'), { ssr: false });
+
+// 主题组件
+const BlogListScroll = dynamic(() => import('./components/BlogListScroll'), { ssr: false });
+const BlogArchiveItem = dynamic(() => import('./components/BlogArchiveItem'), { ssr: false });
+const ArticleLock = dynamic(() => import('./components/ArticleLock'), { ssr: false });
+const ArticleInfo = dynamic(() => import('./components/ArticleInfo'), { ssr: false });
+const Comment = dynamic(() => import('@/components/Comment'), { ssr: false });
+const ArticleAround = dynamic(() => import('./components/ArticleAround'), { ssr: false });
+const ShareBar = dynamic(() => import('@/components/ShareBar'), { ssr: false });
+const TopBar = dynamic(() => import('./components/TopBar'), { ssr: false });
+const Header = dynamic(() => import('./components/Header'), { ssr: false });
+const NavBar = dynamic(() => import('./components/NavBar'), { ssr: false });
+const SideBar = dynamic(() => import('./components/SideBar'), { ssr: false });
+const JumpToTopButton = dynamic(() => import('./components/JumpToTopButton'), { ssr: false });
+const Footer = dynamic(() => import('./components/Footer'), { ssr: false });
+const SearchInput = dynamic(() => import('./components/SearchInput'), { ssr: false });
+const CommonHead = dynamic(() => import('@/components/CommonHead'), { ssr: false });
+const WWAds = dynamic(() => import('@/components/WWAds'), { ssr: false });
+const BlogListPage = dynamic(() => import('./components/BlogListPage'), { ssr: false })
 
 /**
  * 基础布局
@@ -36,9 +41,6 @@ const LayoutBase = props => {
   const { children, slotTop, meta } = props
   const { onLoading } = useGlobal()
 
-  if (isBrowser) {
-    loadExternalResource('/css/theme-simple.css', 'css')
-  }
   return (
         <div id='theme-simple' className='min-h-screen flex flex-col dark:text-gray-300  bg-white dark:bg-black'>
             {/* SEO相关 */}
@@ -172,7 +174,8 @@ const LayoutSlug = props => {
                 <ArticleInfo post={post} />
 
                 {/* 广告嵌入 */}
-                <AdSlot type={'in-article'} />
+                {/* <AdSlot type={'in-article'} /> */}
+                <WWAds orientation="horizontal" className="w-full" />
 
                 {/* Notion文章主体 */}
                 {!lock && <NotionPage post={post} />}