diff --git a/.env.local b/.env.local
index 48b76dc9..0f9ee7c1 100644
--- a/.env.local
+++ b/.env.local
@@ -1,2 +1,2 @@
 # 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables
-NEXT_PUBLIC_VERSION=4.0.18
\ No newline at end of file
+NEXT_PUBLIC_VERSION=4.1.0
\ No newline at end of file
diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md
index 943cf303..4ea399c0 100644
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@@ -12,23 +12,23 @@ assignees: tangly1024
 -->
 
 **描述bug**
-简单说明bug的现象、相关的错误提示、日志等
+【此项必填】简单说明bug的现象、相关的错误提示、日志等
 
 **复现步骤**
-出现这个bug的操作步骤
+【此项必填】出现这个bug的操作步骤
 
 **期望的正常结果**
-希望按这个步骤，正常操作结果是什么
+【此项必填】希望按这个步骤，正常操作结果是什么
 
 **截图**
-相关的页面，应该的结果
+【可选】相关的页面，应该的结果
 
 **环境**
 
-- 操作系统: [例如. iOS, Android, macOS, windows]
-- 浏览器 [例如. chrome, safari, firefox]
-- NotionNext版本 [e.g. 3.13.6]
-- 主题 [例如. hexo]
+- 【必填】NotionNext版本 [例如. 4.0.18]
+- 【必填】主题 [例如. hexo]
+- 【可选】操作系统: [例如. iOS, Android, macOS, windows]
+- 【可选】浏览器 [例如. chrome, safari, firefox]
 
 **补充说明**
-与问题相关的其它说明
\ No newline at end of file
+【可选】与问题相关的其它说明
\ No newline at end of file
diff --git a/blog.config.js b/blog.config.js
index 263beecd..ce07ba3f 100644
--- a/blog.config.js
+++ b/blog.config.js
@@ -5,7 +5,7 @@ const BLOG = {
         process.env.NOTION_PAGE_ID || '02ab3b8678004aa69e9e415905ef32a5',
   PSEUDO_STATIC: process.env.NEXT_PUBLIC_PSEUDO_STATIC || false, // 伪静态路径，开启后所有文章URL都以 .html 结尾。
   NEXT_REVALIDATE_SECOND: process.env.NEXT_PUBLIC_REVALIDATE_SECOND || 5, // 更新内容缓存间隔 单位(秒)；即每个页面有5秒的纯静态期、此期间无论多少次访问都不会抓取notion数据；调大该值有助于节省Vercel资源、同时提升访问速率，但也会使文章更新有延迟。
-  THEME: process.env.NEXT_PUBLIC_THEME || 'hexo', // 当前主题，在themes文件夹下可找到所有支持的主题；主题名称就是文件夹名，例如 example,fukasawa,gitbook,heo,hexo,landing,matery,medium,next,nobelium,plog,simple
+  THEME: process.env.NEXT_PUBLIC_THEME || 'simple', // 当前主题，在themes文件夹下可找到所有支持的主题；主题名称就是文件夹名，例如 example,fukasawa,gitbook,heo,hexo,landing,matery,medium,next,nobelium,plog,simple
   THEME_SWITCH: process.env.NEXT_PUBLIC_THEME_SWITCH || false, // 是否显示切换主题按钮
   LANG: process.env.NEXT_PUBLIC_LANG || 'zh-CN', // e.g 'zh-CN','en-US'  see /lib/lang.js for more.
   SINCE: 2021, // e.g if leave this empty, current year will be used.
@@ -309,13 +309,11 @@ const BLOG = {
   // HOSTNAME: Webmention绑定之网域，通常即为本站网址
   // TWITTER_USERNAME: 评论显示区域需要的资讯
   // TOKEN: Webmention的API token
-  COMMENT_WEBMENTION: {
-    ENABLE: process.env.NEXT_PUBLIC_WEBMENTION_ENABLE || false,
-    AUTH: process.env.NEXT_PUBLIC_WEBMENTION_AUTH || '',
-    HOSTNAME: process.env.NEXT_PUBLIC_WEBMENTION_HOSTNAME || '',
-    TWITTER_USERNAME: process.env.NEXT_PUBLIC_TWITTER_USERNAME || '',
-    TOKEN: process.env.NEXT_PUBLIC_WEBMENTION_TOKEN || ''
-  },
+  COMMENT_WEBMENTION_ENABLE: process.env.NEXT_PUBLIC_WEBMENTION_ENABLE || false,
+  COMMENT_WEBMENTION_AUTH: process.env.NEXT_PUBLIC_WEBMENTION_AUTH || '',
+  COMMENT_WEBMENTION_HOSTNAME: process.env.NEXT_PUBLIC_WEBMENTION_HOSTNAME || '',
+  COMMENT_WEBMENTION_TWITTER_USERNAME: process.env.NEXT_PUBLIC_TWITTER_USERNAME || '',
+  COMMENT_WEBMENTION_TOKEN: process.env.NEXT_PUBLIC_WEBMENTION_TOKEN || '',
 
   // <---- 评论插件
 
diff --git a/components/Ackee.js b/components/Ackee.js
index 8a002bc1..2383f982 100644
--- a/components/Ackee.js
+++ b/components/Ackee.js
@@ -1,45 +1,47 @@
 'use strict'
 
 import { useEffect } from 'react'
-import BLOG from '@/blog.config'
 import { loadExternalResource } from '@/lib/utils'
 import { useRouter } from 'next/router'
+import { siteConfig } from '@/lib/config'
 const Ackee = () => {
   const router = useRouter()
+  const server = siteConfig('ANALYTICS_ACKEE_DATA_SERVER')
+  const domainId = siteConfig('ANALYTICS_ACKEE_DOMAIN_ID')
+
+  // 或者使用其他依赖数组，根据需要执行 handleAckee
+  useEffect(() => {
+    handleAckeeCallback()
+  }, [router])
 
   // handleAckee 函数
   const handleAckeeCallback = () => {
     handleAckee(
       router.asPath,
       {
-        server: BLOG.ANALYTICS_ACKEE_DATA_SERVER,
-        domainId: BLOG.ANALYTICS_ACKEE_DOMAIN_ID
+        server: server,
+        domainId: domainId
       },
       {
         /*
-         * Enable or disable tracking of personal data.
-         * We recommend to ask the user for permission before turning this option on.
-         */
+                 * Enable or disable tracking of personal data.
+                 * We recommend to ask the user for permission before turning this option on.
+                 */
         detailed: true,
         /*
-        * Enable or disable tracking when on localhost.
-        */
+                * Enable or disable tracking when on localhost.
+                */
         ignoreLocalhost: false,
         /*
-        * Enable or disable the tracking of your own visits.
-        * This is enabled by default, but should be turned off when using a wildcard Access-Control-Allow-Origin header.
-        * Some browsers strictly block third-party cookies. The option won't have an impact when this is the case.
-        */
+                * Enable or disable the tracking of your own visits.
+                * This is enabled by default, but should be turned off when using a wildcard Access-Control-Allow-Origin header.
+                * Some browsers strictly block third-party cookies. The option won't have an impact when this is the case.
+                */
         ignoreOwnVisits: false
       }
     )
   }
 
-  // 或者使用其他依赖数组，根据需要执行 handleAckee
-  useEffect(() => {
-    handleAckeeCallback()
-  }, [router])
-
   return null
 }
 
@@ -53,8 +55,8 @@ export default Ackee
  * @param {Object} environment - Object containing the URL of the Ackee server and the domain id.
  * @param {?Object} options - Ackee options.
  */
-const handleAckee = async function(pathname, environment, options = {}) {
-  await loadExternalResource(BLOG.ANALYTICS_ACKEE_TRACKER, 'js')
+const handleAckee = async function (pathname, environment, options = {}) {
+  await loadExternalResource(siteConfig('ANALYTICS_ACKEE_TRACKER'), 'js')
   const ackeeTracker = window.ackeeTracker
 
   const instance = ackeeTracker?.create(environment.server, options)
diff --git a/components/AlgoliaSearchModal.js b/components/AlgoliaSearchModal.js
index e1ba9f3e..fe672e44 100644
--- a/components/AlgoliaSearchModal.js
+++ b/components/AlgoliaSearchModal.js
@@ -1,10 +1,10 @@
 import { useState, useImperativeHandle, useRef } from 'react'
-import BLOG from '@/blog.config'
 import algoliasearch from 'algoliasearch'
 import replaceSearchResult from '@/components/Mark'
 import Link from 'next/link'
 import { useGlobal } from '@/lib/global'
 import throttle from 'lodash/throttle'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 结合 Algolia 实现的弹出式搜索框
@@ -31,8 +31,8 @@ export default function AlgoliaSearchModal({ cRef }) {
     }
   })
 
-  const client = algoliasearch(BLOG.ALGOLIA_APP_ID, BLOG.ALGOLIA_SEARCH_ONLY_APP_KEY)
-  const index = client.initIndex(BLOG.ALGOLIA_INDEX)
+  const client = algoliasearch(siteConfig('ALGOLIA_APP_ID'), siteConfig('ALGOLIA_SEARCH_ONLY_APP_KEY'))
+  const index = client.initIndex(siteConfig('ALGOLIA_INDEX'))
 
   /**
    * 搜索
@@ -97,7 +97,7 @@ export default function AlgoliaSearchModal({ cRef }) {
     setIsModalOpen(false)
   }
 
-  if (!BLOG.ALGOLIA_APP_ID) {
+  if (!siteConfig('ALGOLIA_APP_ID')) {
     return <></>
   }
 
@@ -123,7 +123,7 @@ export default function AlgoliaSearchModal({ cRef }) {
                 <ul>
                     {searchResults.map((result) => (
                         <li key={result.objectID} className="replace my-2">
-                            <a href={`${BLOG.SUB_PATH}/${result.slug}`} className="font-bold hover:text-blue-600 text-black dark:text-gray-200">
+                            <a href={`${siteConfig('SUB_PATH')}/${result.slug}`} className="font-bold hover:text-blue-600 text-black dark:text-gray-200">
                                 {result.title}
                             </a>
                         </li>
diff --git a/components/Artalk.js b/components/Artalk.js
index 0da7734f..a53f18f7 100644
--- a/components/Artalk.js
+++ b/components/Artalk.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { loadExternalResource } from '@/lib/utils'
 // import { loadExternalResource } from '@/lib/utils'
 import { useEffect } from 'react'
@@ -11,17 +11,26 @@ import { useEffect } from 'react'
  */
 
 const Artalk = ({ siteInfo }) => {
+  const artalkCss = siteConfig('COMMENT_ARTALK_CSS')
+  const artalkServer = siteConfig('COMMENT_ARTALK_SERVER')
+  const artalkLocale = siteConfig('LANG')
+  const site = siteConfig('TITLE')
+
   useEffect(() => {
-    loadExternalResource(BLOG.COMMENT_ARTALK_CSS, 'css')
+    initArtalk()
+  }, [])
+
+  const initArtalk = async () => {
+    await loadExternalResource(artalkCss, 'css')
     window?.Artalk?.init({
-      server: BLOG.COMMENT_ARTALK_SERVER, // 后端地址
+      server: artalkServer, // 后端地址
       el: '#artalk', // 容器元素
-      locale: BLOG.LANG,
+      locale: artalkLocale,
       //   pageKey: '/post/1', // 固定链接 (留空自动获取)
       //   pageTitle: '关于引入 Artalk 的这档子事', // 页面标题 (留空自动获取)
-      site: siteInfo?.title // 你的站点名
+      site: site // 你的站点名
     })
-  }, [])
+  }
   return (
         <div id="artalk"></div>
   )
diff --git a/components/ChatBase.js b/components/ChatBase.js
index 5decc833..b114fdf6 100644
--- a/components/ChatBase.js
+++ b/components/ChatBase.js
@@ -1,17 +1,17 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 这是一个嵌入组件，可以在任意位置全屏显示您的chat-base对话框
  * 暂时没有页面引用
- * 因为您可以直接用内嵌网页的方式放入您的notion中 https://www.chatbase.co/chatbot-iframe/${BLOG.CHATBASE_ID}
+ * 因为您可以直接用内嵌网页的方式放入您的notion中 https://www.chatbase.co/chatbot-iframe/${siteConfig('CHATBASE_ID')}
  */
 export default function ChatBase() {
-  if (!BLOG.CHATBASE_ID) {
+  if (!siteConfig('CHATBASE_ID')) {
     return <></>
   }
 
   return <iframe
-        src={`https://www.chatbase.co/chatbot-iframe/${BLOG.CHATBASE_ID}`}
+        src={`https://www.chatbase.co/chatbot-iframe/${siteConfig('CHATBASE_ID')}`}
         width="100%"
         style={{ height: '100%', minHeight: '700px' }}
         frameborder="0"
diff --git a/components/Comment.js b/components/Comment.js
index 6be4bc64..203ed066 100644
--- a/components/Comment.js
+++ b/components/Comment.js
@@ -1,9 +1,9 @@
-import BLOG from '@/blog.config'
 import dynamic from 'next/dynamic'
 import Tabs from '@/components/Tabs'
 import { isBrowser } from '@/lib/utils'
 import { useRouter } from 'next/router'
 import Artalk from './Artalk'
+import { siteConfig } from '@/lib/config'
 
 const WalineComponent = dynamic(
   () => {
@@ -55,13 +55,6 @@ const ValineComponent = dynamic(() => import('@/components/ValineComponent'), {
   ssr: false
 })
 
-/**
- * 是否有评论
- */
-export const commentEnable = BLOG.COMMENT_TWIKOO_ENV_ID || BLOG.COMMENT_WALINE_SERVER_URL || BLOG.COMMENT_VALINE_APP_ID ||
-BLOG.COMMENT_GISCUS_REPO || BLOG.COMMENT_CUSDIS_APP_ID || BLOG.COMMENT_UTTERRANCES_REPO ||
- BLOG.COMMENT_GITALK_CLIENT_ID || BLOG.COMMENT_WEBMENTION.ENABLE
-
 /**
  * 评论组件
  * @param {*} param0
@@ -70,6 +63,17 @@ BLOG.COMMENT_GISCUS_REPO || BLOG.COMMENT_CUSDIS_APP_ID || BLOG.COMMENT_UTTERRANC
 const Comment = ({ siteInfo, frontMatter, className }) => {
   const router = useRouter()
 
+  const COMMENT_ARTALK_SERVER = siteConfig('COMMENT_ARTALK_SERVER')
+  const COMMENT_TWIKOO_ENV_ID = siteConfig('COMMENT_TWIKOO_ENV_ID')
+  const COMMENT_WALINE_SERVER_URL = siteConfig('COMMENT_WALINE_SERVER_URL')
+  const COMMENT_VALINE_APP_ID = siteConfig('COMMENT_VALINE_APP_ID')
+  const COMMENT_GISCUS_REPO = siteConfig('COMMENT_GISCUS_REPO')
+  const COMMENT_CUSDIS_APP_ID = siteConfig('COMMENT_CUSDIS_APP_ID')
+  const COMMENT_UTTERRANCES_REPO = siteConfig('COMMENT_UTTERRANCES_REPO')
+  const COMMENT_GITALK_CLIENT_ID = siteConfig('COMMENT_GITALK_CLIENT_ID')
+  const COMMENT_WEBMENTION_ENABLE = siteConfig('COMMENT_WEBMENTION_ENABLE')
+
+  // 当连接中有特殊参数时跳转到评论区
   if (isBrowser && ('giscus' in router.query || router.query.target === 'comment')) {
     setTimeout(() => {
       const url = router.asPath.replace('?target=comment', '')
@@ -83,47 +87,47 @@ const Comment = ({ siteInfo, frontMatter, className }) => {
   }
 
   return (
-    <div key={frontMatter?.id} id='comment' className={`comment mt-5 text-gray-800 dark:text-gray-300 ${className || ''}`}>
-        <Tabs>
-             {BLOG.COMMENT_ARTALK_SERVER && (<div key='Artalk'>
-                <Artalk siteInfo={siteInfo} />
-            </div>)}
+        <div key={frontMatter?.id} id='comment' className={`comment mt-5 text-gray-800 dark:text-gray-300 ${className || ''}`}>
+            <Tabs>
+                {COMMENT_ARTALK_SERVER && (<div key='Artalk'>
+                    <Artalk />
+                </div>)}
 
-            {BLOG.COMMENT_TWIKOO_ENV_ID && (<div key='Twikoo'>
-                <TwikooCompenent />
-            </div>)}
+                {COMMENT_TWIKOO_ENV_ID && (<div key='Twikoo'>
+                    <TwikooCompenent />
+                </div>)}
 
-            {BLOG.COMMENT_WALINE_SERVER_URL && (<div key='Waline'>
-                <WalineComponent />
-            </div>)}
+                {COMMENT_WALINE_SERVER_URL && (<div key='Waline'>
+                    <WalineComponent />
+                </div>)}
 
-            {BLOG.COMMENT_VALINE_APP_ID && (<div key='Valine' name='reply'>
-                <ValineComponent path={frontMatter.id} />
-            </div>)}
+                {COMMENT_VALINE_APP_ID && (<div key='Valine' name='reply'>
+                    <ValineComponent path={frontMatter.id} />
+                </div>)}
 
-            {BLOG.COMMENT_GISCUS_REPO && (
-                <div key="Giscus">
-                    <GiscusComponent className="px-2" />
-                </div>
-            )}
+                {COMMENT_GISCUS_REPO && (
+                    <div key="Giscus">
+                        <GiscusComponent className="px-2" />
+                    </div>
+                )}
 
-            {BLOG.COMMENT_CUSDIS_APP_ID && (<div key='Cusdis'>
-                <CusdisComponent frontMatter={frontMatter} />
-            </div>)}
+                {COMMENT_CUSDIS_APP_ID && (<div key='Cusdis'>
+                    <CusdisComponent frontMatter={frontMatter} />
+                </div>)}
 
-            {BLOG.COMMENT_UTTERRANCES_REPO && (<div key='Utterance'>
-                <UtterancesComponent issueTerm={frontMatter.id} className='px-2' />
-            </div>)}
+                {COMMENT_UTTERRANCES_REPO && (<div key='Utterance'>
+                    <UtterancesComponent issueTerm={frontMatter.id} className='px-2' />
+                </div>)}
 
-            {BLOG.COMMENT_GITALK_CLIENT_ID && (<div key='GitTalk'>
-                <GitalkComponent frontMatter={frontMatter} />
-            </div>)}
+                {COMMENT_GITALK_CLIENT_ID && (<div key='GitTalk'>
+                    <GitalkComponent frontMatter={frontMatter} />
+                </div>)}
 
-            {BLOG.COMMENT_WEBMENTION.ENABLE && (<div key='WebMention'>
-                <WebMentionComponent frontMatter={frontMatter} className="px-2" />
-            </div>)}
-        </Tabs>
-    </div>
+                {COMMENT_WEBMENTION_ENABLE && (<div key='WebMention'>
+                    <WebMentionComponent frontMatter={frontMatter} className="px-2" />
+                </div>)}
+            </Tabs>
+        </div>
   )
 }
 
diff --git a/components/CommonHead.js b/components/CommonHead.js
index 24bfae69..1aeb36dd 100644
--- a/components/CommonHead.js
+++ b/components/CommonHead.js
@@ -1,34 +1,34 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Head from 'next/head'
 
 const CommonHead = ({ meta, children }) => {
-  let url = BLOG?.PATH?.length ? `${BLOG.LINK}/${BLOG.SUB_PATH}` : BLOG.LINK
+  let url = siteConfig('PATH')?.length ? `${siteConfig('LINK')}/${siteConfig('SUB_PATH', '')}` : siteConfig('LINK')
   let image
   if (meta) {
     url = `${url}/${meta.slug}`
     image = meta.image || '/bg_image.jpg'
   }
-  const title = meta?.title || BLOG.TITLE
-  const description = meta?.description || BLOG.DESCRIPTION
+  const title = meta?.title || siteConfig('TITLE')
+  const description = meta?.description || siteConfig('DESCRIPTION')
   const type = meta?.type || 'website'
-  const keywords = meta?.tags || BLOG.KEYWORDS
-  const lang = BLOG.LANG.replace('-', '_') // Facebook OpenGraph 要 zh_CN 這樣的格式才抓得到語言
-  const category = meta?.category || BLOG.KEYWORDS || '軟體科技' // section 主要是像是 category 這樣的分類，Facebook 用這個來抓連結的分類
+  const keywords = meta?.tags || siteConfig('KEYWORDS')
+  const lang = siteConfig('LANG').replace('-', '_') // Facebook OpenGraph 要 zh_CN 這樣的格式才抓得到語言
+  const category = meta?.category || siteConfig('KEYWORDS') // section 主要是像是 category 這樣的分類，Facebook 用這個來抓連結的分類
 
   return (
         <Head>
             <title>{title}</title>
-            <meta name="theme-color" content={BLOG.BACKGROUND_DARK} />
+            <meta name="theme-color" content={siteConfig('BACKGROUND_DARK')} />
             <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, minimum-scale=1.0" />
             <meta name="robots" content="follow, index" />
             <meta charSet="UTF-8" />
-            {BLOG.SEO_GOOGLE_SITE_VERIFICATION && (
+            {siteConfig('SEO_GOOGLE_SITE_VERIFICATION') && (
                 <meta
                     name="google-site-verification"
-                    content={BLOG.SEO_GOOGLE_SITE_VERIFICATION}
+                    content={siteConfig('SEO_GOOGLE_SITE_VERIFICATION')}
                 />
             )}
-            {BLOG.SEO_BAIDU_SITE_VERIFICATION && (<meta name="baidu-site-verification" content={BLOG.SEO_BAIDU_SITE_VERIFICATION} />)}
+            {siteConfig('SEO_BAIDU_SITE_VERIFICATION') && (<meta name="baidu-site-verification" content={siteConfig('SEO_BAIDU_SITE_VERIFICATION')} />)}
             <meta name="keywords" content={keywords} />
             <meta name="description" content={description} />
             <meta property="og:locale" content={lang} />
@@ -36,33 +36,33 @@ const CommonHead = ({ meta, children }) => {
             <meta property="og:description" content={description} />
             <meta property="og:url" content={url} />
             <meta property="og:image" content={image} />
-            <meta property="og:site_name" content={BLOG.TITLE} />
+            <meta property="og:site_name" content={siteConfig('TITLE')} />
             <meta property="og:type" content={type} />
             <meta name="twitter:card" content="summary_large_image" />
             <meta name="twitter:description" content={description} />
             <meta name="twitter:title" content={title} />
 
-            {BLOG.COMMENT_WEBMENTION.ENABLE && (
+            {siteConfig('COMMENT_WEBMENTION_ENABLE') && (
                 <>
-                    <link rel="webmention" href={`https://webmention.io/${BLOG.COMMENT_WEBMENTION.HOSTNAME}/webmention`} />
-                    <link rel="pingback" href={`https://webmention.io/${BLOG.COMMENT_WEBMENTION.HOSTNAME}/xmlrpc`} />
+                    <link rel="webmention" href={`https://webmention.io/${siteConfig('COMMENT_WEBMENTION_HOSTNAME')}/webmention`} />
+                    <link rel="pingback" href={`https://webmention.io/${siteConfig('COMMENT_WEBMENTION_HOSTNAME')}/xmlrpc`} />
                 </>
             )}
 
-            {BLOG.COMMENT_WEBMENTION.ENABLE && BLOG.COMMENT_WEBMENTION.AUTH !== '' && (
-                <link href={BLOG.COMMENT_WEBMENTION.AUTH} rel="me" />
+            {siteConfig('COMMENT_WEBMENTION_ENABLE') && siteConfig('COMMENT_WEBMENTION_AUTH') !== '' && (
+                <link href={siteConfig('COMMENT_WEBMENTION_AUTH')} rel="me" />
             )}
 
-            {JSON.parse(BLOG.ANALYTICS_BUSUANZI_ENABLE) && <meta name="referrer" content="no-referrer-when-downgrade" />}
+            {JSON.parse(siteConfig('ANALYTICS_BUSUANZI_ENABLE')) && <meta name="referrer" content="no-referrer-when-downgrade" />}
             {meta?.type === 'Post' && (
                 <>
                     <meta
                         property="article:published_time"
                         content={meta.publishDay}
                     />
-                    <meta property="article:author" content={BLOG.AUTHOR} />
+                    <meta property="article:author" content={siteConfig('AUTHOR')} />
                     <meta property="article:section" content={category} />
-                    <meta property="article:publisher" content={BLOG.FACEBOOK_PAGE} />
+                    <meta property="article:publisher" content={siteConfig('FACEBOOK_PAGE')} />
                 </>
             )}
             {children}
diff --git a/components/CommonScript.js b/components/CommonScript.js
deleted file mode 100644
index b5e1fe06..00000000
--- a/components/CommonScript.js
+++ /dev/null
@@ -1,143 +0,0 @@
-import BLOG from '@/blog.config'
-
-/**
- * 第三方代码 统计脚本
- * @returns {JSX.Element}
- * @constructor
- */
-const CommonScript = () => {
-  return (<>
-
-    {BLOG.CHATBASE_ID && (<>
-        <script id={BLOG.CHATBASE_ID} src="https://www.chatbase.co/embed.min.js" defer/>
-        <script async dangerouslySetInnerHTML={{
-          __html: `
-             window.chatbaseConfig = {
-                chatbotId: "${BLOG.CHATBASE_ID}",
-            }
-        `
-        }}/>
-    </>)}
-
-    {BLOG.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: `
-                 daovoice('init', {
-                    app_id: "${BLOG.COMMENT_DAO_VOICE_ID}"
-                  });
-                  daovoice('update');
-                  `
-      }}
-      />
-    </>)}
-
-    {BLOG.AD_WWADS_ID && <script type="text/javascript" charSet="UTF-8" src="https://cdn.wwads.cn/js/makemoney.js" async></script>}
-
-    {BLOG.COMMENT_CUSDIS_APP_ID && <script defer src={`https://cusdis.com/js/widget/lang/${BLOG.LANG.toLowerCase()}.js`} />}
-
-    {BLOG.COMMENT_TWIKOO_ENV_ID && <script defer src={BLOG.COMMENT_TWIKOO_CDN_URL}/> }
-
-    {BLOG.COMMENT_ARTALK_SERVER && <script defer src={BLOG.COMMENT_ARTALK_JS}/> }
-
-    {BLOG.COMMENT_TIDIO_ID && <script async src={`//code.tidio.co/${BLOG.COMMENT_TIDIO_ID}.js`} />}
-
-    {/* gitter聊天室 */}
-    {BLOG.COMMENT_GITTER_ROOM && (<>
-      <script src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer/>
-      <script async dangerouslySetInnerHTML={{
-        __html: `
-                ((window.gitter = {}).chat = {}).options = {
-                  room: '${BLOG.COMMENT_GITTER_ROOM}'
-                };
-                `
-      }}/>
-    </>)}
-
-    {/* 代码统计 */}
-    {/* ackee统计脚本 */}
-    {/* {BLOG.ANALYTICS_ACKEE_TRACKER && (
-      <script async src={BLOG.ANALYTICS_ACKEE_TRACKER}
-              data-ackee-server={BLOG.ANALYTICS_ACKEE_DATA_SERVER}
-              data-ackee-domain-id={BLOG.ANALYTICS_ACKEE_DOMAIN_ID}
-      />
-    )} */}
-
-    {/* 百度统计 */}
-    {BLOG.ANALYTICS_BAIDU_ID && (
-      <script async
-              dangerouslySetInnerHTML={{
-                __html: `
-              var _hmt = _hmt || [];
-              (function() {
-                var hm = document.createElement("script");
-                hm.src = "https://hm.baidu.com/hm.js?${BLOG.ANALYTICS_BAIDU_ID}";
-                var s = document.getElementsByTagName("script")[0]; 
-                s.parentNode.insertBefore(hm, s);
-              })();
-              `
-              }}
-      />
-    )}
-
-    {/* 站长统计 */}
-    {BLOG.ANALYTICS_CNZZ_ID && (
-      <script async
-              dangerouslySetInnerHTML={{
-                __html: `
-              document.write(unescape("%3Cspan style='display:none' id='cnzz_stat_icon_${BLOG.ANALYTICS_CNZZ_ID}'%3E%3C/span%3E%3Cscript src='https://s9.cnzz.com/z_stat.php%3Fid%3D${BLOG.ANALYTICS_CNZZ_ID}' type='text/javascript'%3E%3C/script%3E"));
-              `
-              }}
-      />
-    )}
-
-    {/* Matomo 统计 */}
-    {BLOG.MATOMO_HOST_URL && BLOG.MATOMO_SITE_ID && (
-      <script async dangerouslySetInnerHTML={{
-        __html: `
-              var _paq = window._paq = window._paq || [];
-              _paq.push(['trackPageView']);
-              _paq.push(['enableLinkTracking']);
-              (function() {
-                var u="//${BLOG.MATOMO_HOST_URL}/";
-                _paq.push(['setTrackerUrl', u+'matomo.php']);
-                _paq.push(['setSiteId', '${BLOG.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);
-              })();
-            `
-      }}/>
-    )}
-
-    {/* 谷歌统计 */}
-    {BLOG.ANALYTICS_GOOGLE_ID && (<>
-      <script async
-              src={`https://www.googletagmanager.com/gtag/js?id=${BLOG.ANALYTICS_GOOGLE_ID}`}
-      />
-      <script async
-              dangerouslySetInnerHTML={{
-                __html: `
-                    window.dataLayer = window.dataLayer || [];
-                    function gtag(){dataLayer.push(arguments);}
-                    gtag('js', new Date());
-                    gtag('config', '${BLOG.ANALYTICS_GOOGLE_ID}', {
-                      page_path: window.location.pathname,
-                    });
-                  `
-              }}
-      />
-    </>)}
-
-    {/* 引入音乐播放 */}
-    {JSON.parse(BLOG.MUSIC_PLAYER) && <script async src={BLOG.MUSIC_PLAYER_CDN_URL} />}
-    {JSON.parse(BLOG.MUSIC_PLAYER) && JSON.parse(BLOG.MUSIC_PLAYER_METING) && <script async src="https://cdnjs.cloudflare.com/ajax/libs/meting/2.0.1/Meting.min.js" />}
-  </>)
-}
-
-export default CommonScript
diff --git a/components/CusdisComponent.js b/components/CusdisComponent.js
index ad780aea..148ee0c7 100644
--- a/components/CusdisComponent.js
+++ b/components/CusdisComponent.js
@@ -1,28 +1,34 @@
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { useEffect } from 'react'
 import { loadExternalResource } from '@/lib/utils'
+import { siteConfig } from '@/lib/config'
 
 const CusdisComponent = ({ frontMatter }) => {
-  const { locale } = useGlobal()
   const router = useRouter()
-  const { isDarkMode } = useGlobal()
+  const { isDarkMode, lang } = useGlobal()
+  const src = siteConfig('COMMENT_CUSDIS_SCRIPT_SRC')
+  const i18nForCusdis = siteConfig('LANG').toLowerCase().indexOf('zh') === 0 ? siteConfig('LANG').toLowerCase() : siteConfig('LANG').toLowerCase().substring(0, 2)
+  const langCDN = siteConfig('COMMENT_CUSDIS_LANG_SRC', `https://cusdis.com/js/widget/lang/${i18nForCusdis}.js`)
 
   //   处理cusdis主题
   useEffect(() => {
-    loadExternalResource(BLOG.COMMENT_CUSDIS_SCRIPT_SRC, 'js').then(url => {
-      const CUSDIS = window.CUSDIS
-      CUSDIS?.initial()
-    })
-  }, [isDarkMode])
+    loadCusdis()
+  }, [isDarkMode, lang])
+
+  const loadCusdis = async () => {
+    await loadExternalResource(langCDN, 'js')
+    await loadExternalResource(src, 'js')
+
+    window?.CUSDIS?.initial()
+  }
 
   return <div id="cusdis_thread"
-        lang={locale.LOCALE.toLowerCase()}
-        data-host={BLOG.COMMENT_CUSDIS_HOST}
-        data-app-id={BLOG.COMMENT_CUSDIS_APP_ID}
+        lang={lang.toLowerCase()}
+        data-host={siteConfig('COMMENT_CUSDIS_HOST')}
+        data-app-id={siteConfig('COMMENT_CUSDIS_APP_ID')}
         data-page-id={frontMatter.id}
-        data-page-url={BLOG.LINK + router.asPath}
+        data-page-url={siteConfig('LINK') + router.asPath}
         data-page-title={frontMatter.title}
         data-theme={isDarkMode ? 'dark' : 'light'}
     ></div>
diff --git a/components/CustomContextMenu.js b/components/CustomContextMenu.js
index 2d0634f6..3a6d2d4a 100644
--- a/components/CustomContextMenu.js
+++ b/components/CustomContextMenu.js
@@ -3,8 +3,8 @@ import { useRouter } from 'next/router'
 import { useEffect, useState, useRef, useLayoutEffect } from 'react'
 import { useGlobal } from '@/lib/global'
 import { saveDarkModeToCookies, THEMES } from '@/themes/theme'
-import BLOG from '@/blog.config'
 import useWindowSize from '@/hooks/useWindowSize'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 自定义右键菜单
@@ -28,7 +28,7 @@ export default function CustomContextMenu(props) {
   function handleJumpToRandomPost() {
     const randomIndex = Math.floor(Math.random() * latestPosts.length)
     const randomPost = latestPosts[randomIndex]
-    router.push(`${BLOG.SUB_PATH}/${randomPost?.slug}`)
+    router.push(`${siteConfig('SUB_PATH', '')}/${randomPost?.slug}`)
   }
 
   useLayoutEffect(() => {
diff --git a/components/DarkModeButton.js b/components/DarkModeButton.js
index aaeed000..0d875fa7 100644
--- a/components/DarkModeButton.js
+++ b/components/DarkModeButton.js
@@ -1,5 +1,4 @@
 import { useGlobal } from '@/lib/global'
-import { saveDarkModeToCookies } from '@/themes/theme'
 import { Moon, Sun } from './HeroIcons'
 import { useImperativeHandle } from 'react'
 
@@ -8,7 +7,7 @@ import { useImperativeHandle } from 'react'
  */
 const DarkModeButton = (props) => {
   const { cRef, className } = props
-  const { isDarkMode, updateDarkMode } = useGlobal()
+  const { isDarkMode, toggleDarkMode } = useGlobal()
 
   /**
    * 对外暴露方法
@@ -16,22 +15,12 @@ const DarkModeButton = (props) => {
   useImperativeHandle(cRef, () => {
     return {
       handleChangeDarkMode: () => {
-        handleChangeDarkMode()
+        toggleDarkMode()
       }
     }
   })
 
-  // 用户手动设置主题
-  const handleChangeDarkMode = () => {
-    const newStatus = !isDarkMode
-    saveDarkModeToCookies(newStatus)
-    updateDarkMode(newStatus)
-    const htmlElement = document.getElementsByTagName('html')[0]
-    htmlElement.classList?.remove(newStatus ? 'light' : 'dark')
-    htmlElement.classList?.add(newStatus ? 'dark' : 'light')
-  }
-
-  return <div onClick={handleChangeDarkMode} className={`${className || ''} flex justify-center dark:text-gray-200 text-gray-800`}>
+  return <div onClick={toggleDarkMode} className={`${className || ''} flex justify-center dark:text-gray-200 text-gray-800`}>
         <div id='darkModeButton' className=' hover:scale-110 cursor-pointer transform duration-200 w-5 h-5'> {isDarkMode ? <Sun /> : <Moon />}</div>
     </div>
 }
diff --git a/components/DebugPanel.js b/components/DebugPanel.js
index 026b5ee0..845da502 100644
--- a/components/DebugPanel.js
+++ b/components/DebugPanel.js
@@ -1,9 +1,10 @@
-import BLOG from '@/blog.config'
 import { useEffect, useState } from 'react'
 import Select from './Select'
 import { useGlobal } from '@/lib/global'
 import { THEMES } from '@/themes/theme'
 import { useRouter } from 'next/router'
+import { siteConfigMap } from '@/lib/config'
+import { getQueryParam } from '@/lib/utils'
 
 /**
  *
@@ -13,14 +14,14 @@ const DebugPanel = () => {
   const [show, setShow] = useState(false)
   const { theme, switchTheme, locale } = useGlobal()
   const router = useRouter()
+  const currentTheme = getQueryParam(router.asPath, 'theme') || theme
   const [siteConfig, updateSiteConfig] = useState({})
 
   // 主题下拉框
   const themeOptions = THEMES?.map(t => ({ value: t, text: t }))
 
   useEffect(() => {
-    updateSiteConfig(Object.assign({}, BLOG))
-    // updateThemeConfig(Object.assign({}, ThemeMap[BLOG.THEME].THEME_CONFIG))
+    updateSiteConfig(Object.assign({}, siteConfigMap()))
   }, [])
 
   function toggleShow() {
@@ -71,7 +72,7 @@ const DebugPanel = () => {
                     <div className='flex'>
                         <Select
                             label={locale.COMMON.THEME_SWITCH}
-                            value={theme}
+                            value={currentTheme}
                             options={themeOptions}
                             onChange={handleUpdateDebugTheme}
                         />
diff --git a/components/DisableCopy.js b/components/DisableCopy.js
index 80860714..9bc2cb9e 100644
--- a/components/DisableCopy.js
+++ b/components/DisableCopy.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useEffect } from 'react'
 
 /**
@@ -6,7 +6,7 @@ import { useEffect } from 'react'
  */
 export default function DisableCopy() {
   useEffect(() => {
-    if (!JSON.parse(BLOG.CAN_COPY)) {
+    if (!JSON.parse(siteConfig('CAN_COPY'))) {
       // 全栈添加禁止复制的样式
       document.getElementsByTagName('html')[0].classList.add('forbid-copy')
       // 监听复制事件
diff --git a/components/ExternalPlugins.js b/components/ExternalPlugins.js
index 5b771fbb..3c274b55 100644
--- a/components/ExternalPlugins.js
+++ b/components/ExternalPlugins.js
@@ -1,18 +1,7 @@
-import BLOG from 'blog.config'
+import { siteConfig } from '@/lib/config'
 import dynamic from 'next/dynamic'
 import WebWhiz from './Webwhiz'
 
-// import TwikooCommentCounter from '@/components/TwikooCommentCounter'
-// import { DebugPanel } from '@/components/DebugPanel'
-// import { ThemeSwitch } from '@/components/ThemeSwitch'
-// import { Fireworks } from '@/components/Fireworks'
-// import { Nest } from '@/components/Nest'
-// import { FlutteringRibbon } from '@/components/FlutteringRibbon'
-// import { Ribbon } from '@/components/Ribbon'
-// import { Sakura } from '@/components/Sakura'
-// import { StarrySky } from '@/components/StarrySky'
-// import { Analytics } from '@vercel/analytics/react'
-
 const TwikooCommentCounter = dynamic(() => import('@/components/TwikooCommentCounter'), { ssr: false })
 const DebugPanel = dynamic(() => import('@/components/DebugPanel'), { ssr: false })
 const ThemeSwitch = dynamic(() => import('@/components/ThemeSwitch'), { ssr: false })
@@ -33,35 +22,152 @@ 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 })
+
 /**
- * 各种第三方组件
+ * 各种插件脚本
  * @param {*} props
  * @returns
  */
 const ExternalPlugin = (props) => {
   return <>
-          {JSON.parse(BLOG.THEME_SWITCH) && <ThemeSwitch />}
-          {JSON.parse(BLOG.DEBUG) && <DebugPanel />}
-          {BLOG.ANALYTICS_ACKEE_TRACKER && <Ackee />}
-          {BLOG.ANALYTICS_GOOGLE_ID && <Gtag />}
-          {BLOG.ANALYTICS_VERCEL && <Analytics />}
-          {JSON.parse(BLOG.ANALYTICS_BUSUANZI_ENABLE) && <Busuanzi />}
-          {BLOG.ADSENSE_GOOGLE_ID && <GoogleAdsense />}
-          {BLOG.FACEBOOK_APP_ID && BLOG.FACEBOOK_PAGE_ID && <Messenger />}
-          {JSON.parse(BLOG.FIREWORKS) && <Fireworks />}
-          {JSON.parse(BLOG.SAKURA) && <Sakura />}
-          {JSON.parse(BLOG.STARRY_SKY) && <StarrySky />}
-          {JSON.parse(BLOG.MUSIC_PLAYER) && <MusicPlayer />}
-          {JSON.parse(BLOG.NEST) && <Nest />}
-          {JSON.parse(BLOG.FLUTTERINGRIBBON) && <FlutteringRibbon />}
-          {JSON.parse(BLOG.COMMENT_TWIKOO_COUNT_ENABLE) && <TwikooCommentCounter {...props}/>}
-          {JSON.parse(BLOG.RIBBON) && <Ribbon />}
-          {JSON.parse(BLOG.CUSTOM_RIGHT_CLICK_CONTEXT_MENU) && <CustomContextMenu {...props} />}
-          {!JSON.parse(BLOG.CAN_COPY) && <DisableCopy/>}
-          {JSON.parse(BLOG.WEB_WHIZ_ENABLED) && <WebWhiz/>}
-          {JSON.parse(BLOG.AD_WWADS_BLOCK_DETECT) && <AdBlockDetect/>}
-          <VConsole/>
-      </>
+    {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: `
+              (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: `
+             daovoice('init', {
+                app_id: "${siteConfig('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>}
+
+    {siteConfig('COMMENT_TWIKOO_ENV_ID') && <script defer src={siteConfig('COMMENT_TWIKOO_CDN_URL')} />}
+
+    {siteConfig('COMMENT_ARTALK_SERVER') && <script defer src={siteConfig('COMMENT_ARTALK_JS')} />}
+
+    {siteConfig('COMMENT_TIDIO_ID') && <script async src={`//code.tidio.co/${siteConfig('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: `
+            ((window.gitter = {}).chat = {}).options = {
+              room: '${siteConfig('COMMENT_GITTER_ROOM')}'
+            };
+            `
+      }} />
+    </>)}
+
+    {/* 百度统计 */}
+    {siteConfig('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')}";
+            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"));
+          `
+        }}
+      />
+    )}
+
+    {/* 谷歌统计 */}
+    {siteConfig('ANALYTICS_GOOGLE_ID') && (<>
+      <script async
+        src={`https://www.googletagmanager.com/gtag/js?id=${siteConfig('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')}', {
+                  page_path: window.location.pathname,
+                });
+              `
+        }}
+      />
+    </>)}
+
+    {/* Matomo 统计 */}
+    {siteConfig('MATOMO_HOST_URL') && siteConfig('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')}/";
+                _paq.push(['setTrackerUrl', u+'matomo.php']);
+                _paq.push(['setSiteId', '${siteConfig('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 af6bcead..388640d9 100644
--- a/components/FacebookMessenger.js
+++ b/components/FacebookMessenger.js
@@ -1,12 +1,12 @@
-import BLOG from '@/blog.config'
 import { Component } from 'react'
 import PropTypes from 'prop-types'
+import { siteConfig } from '@/lib/config'
 
 export default function Messenger() {
   return <MessengerCustomerChat
-    pageId={BLOG.FACEBOOK_PAGE_ID}
-    appId={BLOG.FACEBOOK_APP_ID}
-    language={BLOG.LANG.replace('-', '_')}
+    pageId={siteConfig('FACEBOOK_PAGE_ID')}
+    appId={siteConfig('FACEBOOK_APP_ID')}
+    language={siteConfig('LANG').replace('-', '_')}
     shouldShowDialog={true}
   />
 }
diff --git a/components/FacebookPage.js b/components/FacebookPage.js
index 95f77fc1..a869c1e5 100644
--- a/components/FacebookPage.js
+++ b/components/FacebookPage.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { FacebookProvider, Page } from 'react-facebook'
 import { FacebookIcon } from 'react-share'
 
@@ -7,27 +7,27 @@ import { FacebookIcon } from 'react-share'
  * @returns
  */
 const FacebookPage = () => {
-  if (!BLOG.FACEBOOK_APP_ID || !BLOG.FACEBOOK_PAGE) {
+  if (!siteConfig('FACEBOOK_APP_ID') || !siteConfig('FACEBOOK_PAGE')) {
     return <></>
   }
   return <div className="shadow-md hover:shadow-xl dark:text-gray-300 border dark:border-black rounded-xl px-2 py-4 bg-white dark:bg-hexo-black-gray lg:duration-100 justify-center">
-    {BLOG.FACEBOOK_PAGE && (
+    {siteConfig('FACEBOOK_PAGE') && (
       <div className="flex items-center pb-2">
         <a
-          href={BLOG.FACEBOOK_PAGE}
+          href={siteConfig('FACEBOOK_PAGE')}
           target="_blank"
           rel="noopener noreferrer"
           className="p-1 pr-2 pt-0"
         >
           <FacebookIcon size={28} round />
         </a>
-        <a href={BLOG.FACEBOOK_PAGE} rel="noopener noreferrer" target="_blank">
-          {BLOG.FACEBOOK_PAGE_TITLE}
+        <a href={siteConfig('FACEBOOK_PAGE')} rel="noopener noreferrer" target="_blank">
+          {siteConfig('FACEBOOK_PAGE_TITLE')}
         </a>
       </div>
     )}
-    {BLOG.FACEBOOK_APP_ID && <FacebookProvider appId={BLOG.FACEBOOK_APP_ID}>
-      <Page href={BLOG.FACEBOOK_PAGE} tabs="timeline" />
+    {siteConfig('FACEBOOK_APP_ID') && <FacebookProvider appId={siteConfig('FACEBOOK_APP_ID')}>
+      <Page href={siteConfig('FACEBOOK_PAGE')} tabs="timeline" />
     </FacebookProvider>}
   </div>
 }
diff --git a/components/Fireworks.js b/components/Fireworks.js
index d6b9a650..8d0c8cd3 100644
--- a/components/Fireworks.js
+++ b/components/Fireworks.js
@@ -4,11 +4,17 @@
  */
 import { useEffect } from 'react'
 import anime from 'animejs'
-import BLOG from 'blog.config'
+import { siteConfig } from '@/lib/config'
 
+/**
+ * 鼠标点击烟花特效
+ * @returns
+ */
 const Fireworks = () => {
+  const fireworksColor = siteConfig('FIREWORKS_COLOR')
+
   useEffect(() => {
-    createFireworks({})
+    createFireworks({ colors: fireworksColor })
   }, [])
   return <canvas id='fireworks' className='fireworks'></canvas>
 }
@@ -20,7 +26,7 @@ export default Fireworks
    */
 function createFireworks(config) {
   const defaultConfig = {
-    colors: BLOG.FIREWORKS_COLOR,
+    colors: config?.colors,
     numberOfParticules: 20,
     orbitRadius: {
       min: 50,
diff --git a/components/Giscus.js b/components/Giscus.js
index 173117bc..ed1564eb 100644
--- a/components/Giscus.js
+++ b/components/Giscus.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import Giscus from '@giscus/react'
 
@@ -15,17 +15,17 @@ const GiscusComponent = () => {
 
   return (
     <Giscus
-      repo={BLOG.COMMENT_GISCUS_REPO}
-      repoId={BLOG.COMMENT_GISCUS_REPO_ID}
-      categoryId={BLOG.COMMENT_GISCUS_CATEGORY_ID}
-      mapping={BLOG.COMMENT_GISCUS_MAPPING}
-      reactionsEnabled={BLOG.COMMENT_GISCUS_REACTIONS_ENABLED}
-      emitMetadata={BLOG.COMMENT_GISCUS_EMIT_METADATA}
+      repo={siteConfig('COMMENT_GISCUS_REPO')}
+      repoId={siteConfig('COMMENT_GISCUS_REPO_ID')}
+      categoryId={siteConfig('COMMENT_GISCUS_CATEGORY_ID')}
+      mapping={siteConfig('COMMENT_GISCUS_MAPPING')}
+      reactionsEnabled={siteConfig('COMMENT_GISCUS_REACTIONS_ENABLED')}
+      emitMetadata={siteConfig('COMMENT_GISCUS_EMIT_METADATA')}
       theme={theme}
-      inputPosition={BLOG.COMMENT_GISCUS_INPUT_POSITION}
-      lang={BLOG.COMMENT_GISCUS_LANG}
-      loading={BLOG.COMMENT_GISCUS_LOADING}
-      crossorigin={BLOG.COMMENT_GISCUS_CROSSORIGIN}
+      inputPosition={siteConfig('COMMENT_GISCUS_INPUT_POSITION')}
+      lang={siteConfig('COMMENT_GISCUS_LANG')}
+      loading={siteConfig('COMMENT_GISCUS_LOADING')}
+      crossorigin={siteConfig('COMMENT_GISCUS_CROSSORIGIN')}
     />
   )
 }
diff --git a/components/Gitalk.js b/components/Gitalk.js
index 4df0c65d..23bda017 100644
--- a/components/Gitalk.js
+++ b/components/Gitalk.js
@@ -1,37 +1,39 @@
-// import 'gitalk/dist/gitalk.css'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { loadExternalResource } from '@/lib/utils'
 import { useEffect } from 'react'
-// import GitalkComponent from 'gitalk/dist/gitalk-component'
 
+/**
+ * gitalk评论插件
+ * @param {*} param0
+ * @returns
+ */
 const Gitalk = ({ frontMatter }) => {
-  //   return <GitalkComponent options={{
-  //     id: frontMatter.id,
-  //     title: frontMatter.title,
-  //     clientID: BLOG.COMMENT_GITALK_CLIENT_ID,
-  //     clientSecret: BLOG.COMMENT_GITALK_CLIENT_SECRET,
-  //     repo: BLOG.COMMENT_GITALK_REPO,
-  //     owner: BLOG.COMMENT_GITALK_OWNER,
-  //     admin: BLOG.COMMENT_GITALK_ADMIN.split(','),
-  //     distractionFreeMode: JSON.parse(BLOG.COMMENT_GITALK_DISTRACTION_FREE_MODE)
-  //   }} />
-  const loadGitalk = async() => {
-    await loadExternalResource(BLOG.COMMENT_GITALK_CSS_CDN_URL, 'css')
-    await loadExternalResource(BLOG.COMMENT_GITALK_JS_CDN_URL, 'js')
-    const Gitalk = window.Gitalk
+  const gitalkCSSCDN = siteConfig('COMMENT_GITALK_CSS_CDN_URL')
+  const gitalkJSCDN = siteConfig('COMMENT_GITALK_JS_CDN_URL')
+  const clientId = siteConfig('COMMENT_GITALK_CLIENT_ID')
+  const clientSecret = siteConfig('COMMENT_GITALK_CLIENT_SECRET')
+  const repo = siteConfig('COMMENT_GITALK_REPO')
+  const owner = siteConfig('COMMENT_GITALK_OWNER')
+  const admin = siteConfig('COMMENT_GITALK_ADMIN').split(',')
+  const distractionFreeMode = siteConfig('COMMENT_GITALK_DISTRACTION_FREE_MODE')
 
+  const loadGitalk = async() => {
+    await loadExternalResource(gitalkCSSCDN, 'css')
+    await loadExternalResource(gitalkJSCDN, 'js')
+    const Gitalk = window.Gitalk
     const gitalk = new Gitalk({
-      clientID: BLOG.COMMENT_GITALK_CLIENT_ID,
-      clientSecret: BLOG.COMMENT_GITALK_CLIENT_SECRET,
-      repo: BLOG.COMMENT_GITALK_REPO,
-      owner: BLOG.COMMENT_GITALK_OWNER,
-      admin: BLOG.COMMENT_GITALK_ADMIN.split(','),
+      clientID: clientId,
+      clientSecret: clientSecret,
+      repo: repo,
+      owner: owner,
+      admin: admin,
       id: frontMatter.id, // Ensure uniqueness and length less than 50
-      distractionFreeMode: JSON.parse(BLOG.COMMENT_GITALK_DISTRACTION_FREE_MODE) // Facebook-like distraction free mode
+      distractionFreeMode: distractionFreeMode // Facebook-like distraction free mode
     })
 
     gitalk.render('gitalk-container')
   }
+
   useEffect(() => {
     loadGitalk()
   }, [])
diff --git a/components/GoogleAdsense.js b/components/GoogleAdsense.js
index 2163f791..61606150 100644
--- a/components/GoogleAdsense.js
+++ b/components/GoogleAdsense.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { loadExternalResource } from '@/lib/utils'
 import { useRouter } from 'next/router'
 import { useEffect } from 'react'
@@ -9,7 +9,7 @@ import { useEffect } from 'react'
  */
 export default function GoogleAdsense() {
   const initGoogleAdsense = () => {
-    loadExternalResource(`https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=${BLOG.ADSENSE_GOOGLE_ID}`, 'js').then(url => {
+    loadExternalResource(`https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=${siteConfig('ADSENSE_GOOGLE_ID')}`, 'js').then(url => {
       setTimeout(() => {
         const ads = document.getElementsByClassName('adsbygoogle')
         const adsbygoogle = window.adsbygoogle
@@ -44,7 +44,7 @@ export default function GoogleAdsense() {
  * 添加 可以在本地调试
  */
 const AdSlot = ({ type = 'show' }) => {
-  if (!BLOG.ADSENSE_GOOGLE_ID) {
+  if (!siteConfig('ADSENSE_GOOGLE_ID')) {
     return null
   }
   // 文章内嵌广告
@@ -53,9 +53,9 @@ const AdSlot = ({ type = 'show' }) => {
             style={{ display: 'block', textAlign: 'center' }}
             data-ad-layout="in-article"
             data-ad-format="fluid"
-            data-adtest={BLOG.ADSENSE_GOOGLE_TEST ? 'on' : 'off'}
-            data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
-            data-ad-slot={BLOG.ADSENSE_GOOGLE_SLOT_IN_ARTICLE}></ins>
+            data-adtest={siteConfig('ADSENSE_GOOGLE_TEST') ? 'on' : 'off'}
+            data-ad-client={siteConfig('ADSENSE_GOOGLE_ID')}
+            data-ad-slot={siteConfig('ADSENSE_GOOGLE_SLOT_IN_ARTICLE')}></ins>
   }
 
   // 信息流广告
@@ -64,9 +64,9 @@ const AdSlot = ({ type = 'show' }) => {
             data-ad-format="fluid"
             data-ad-layout-key="-5j+cz+30-f7+bf"
             style={{ display: 'block' }}
-            data-adtest={BLOG.ADSENSE_GOOGLE_TEST ? 'on' : 'off'}
-            data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
-            data-ad-slot={BLOG.ADSENSE_GOOGLE_SLOT_FLOW}></ins>
+            data-adtest={siteConfig('ADSENSE_GOOGLE_TEST') ? 'on' : 'off'}
+            data-ad-client={siteConfig('ADSENSE_GOOGLE_ID')}
+            data-ad-slot={siteConfig('ADSENSE_GOOGLE_SLOT_FLOW')}></ins>
   }
 
   // 原生广告
@@ -74,17 +74,17 @@ const AdSlot = ({ type = 'show' }) => {
     return <ins className="adsbygoogle"
             style={{ display: 'block', textAlign: 'center' }}
             data-ad-format="autorelaxed"
-            data-adtest={BLOG.ADSENSE_GOOGLE_TEST ? 'on' : 'off'}
-            data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
-            data-ad-slot={BLOG.ADSENSE_GOOGLE_SLOT_NATIVE}></ins>
+            data-adtest={siteConfig('ADSENSE_GOOGLE_TEST') ? 'on' : 'off'}
+            data-ad-client={siteConfig('ADSENSE_GOOGLE_ID')}
+            data-ad-slot={siteConfig('ADSENSE_GOOGLE_SLOT_NATIVE')}></ins>
   }
 
   //  展示广告
   return <ins className="adsbygoogle"
         style={{ display: 'block' }}
-        data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
-        data-adtest={BLOG.ADSENSE_GOOGLE_TEST ? 'on' : 'off'}
-        data-ad-slot={BLOG.ADSENSE_GOOGLE_SLOT_AUTO}
+        data-ad-client={siteConfig('ADSENSE_GOOGLE_ID')}
+        data-adtest={siteConfig('ADSENSE_GOOGLE_TEST') ? 'on' : 'off'}
+        data-ad-slot={siteConfig('ADSENSE_GOOGLE_SLOT_AUTO')}
         data-ad-format="auto"
         data-full-width-responsive="true"></ins>
 }
diff --git a/components/LazyImage.js b/components/LazyImage.js
index 4556bd0d..3e44eb4c 100644
--- a/components/LazyImage.js
+++ b/components/LazyImage.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Head from 'next/head'
 import React, { useEffect, useRef, useState } from 'react'
 
@@ -12,7 +12,7 @@ export default function LazyImage({
   id,
   src,
   alt,
-  placeholderSrc = BLOG.IMG_LAZY_LOAD_PLACEHOLDER,
+  placeholderSrc,
   className,
   width,
   height,
@@ -22,6 +22,9 @@ export default function LazyImage({
 }) {
   const imageRef = useRef(null)
   const [imageLoaded, setImageLoaded] = useState(false)
+  if (!placeholderSrc) {
+    placeholderSrc = siteConfig('IMG_LAZY_LOAD_PLACEHOLDER')
+  }
 
   const handleImageLoad = () => {
     setImageLoaded(true)
diff --git a/components/Live2D.js b/components/Live2D.js
index 6a2fc624..c232ddbb 100644
--- a/components/Live2D.js
+++ b/components/Live2D.js
@@ -1,12 +1,13 @@
 /* eslint-disable no-undef */
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { loadExternalResource } from '@/lib/utils'
 import { useEffect } from 'react'
 
 export default function Live2D() {
   const { theme, switchTheme } = useGlobal()
-  const showPet = JSON.parse(BLOG.WIDGET_PET)
+  const showPet = JSON.parse(siteConfig('WIDGET_PET'))
+  const petLink = siteConfig('WIDGET_PET_LINK')
 
   useEffect(() => {
     if (showPet) {
@@ -16,7 +17,7 @@ export default function Live2D() {
         if (typeof window?.loadlive2d !== 'undefined') {
           // https://github.com/xiazeyu/live2d-widget-models
           try {
-            loadlive2d('live2d', BLOG.WIDGET_PET_LINK)
+            loadlive2d('live2d', petLink)
           } catch (error) {
             console.error('读取PET模型', error)
           }
@@ -26,7 +27,7 @@ export default function Live2D() {
   }, [theme])
 
   function handleClick() {
-    if (JSON.parse(BLOG.WIDGET_PET_SWITCH_THEME)) {
+    if (JSON.parse(siteConfig('WIDGET_PET_SWITCH_THEME'))) {
       switchTheme()
     }
   }
diff --git a/components/NotionPage.js b/components/NotionPage.js
index 16e8716e..e6e82046 100644
--- a/components/NotionPage.js
+++ b/components/NotionPage.js
@@ -4,11 +4,10 @@ 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 BLOG from '@/blog.config'
 import 'katex/dist/katex.min.css'
 import { mapImgUrl } from '@/lib/notion/mapImage'
 import { isBrowser } from '@/lib/utils'
+import { siteConfig } from '@/lib/config'
 
 const Code = dynamic(() =>
   import('react-notion-x/build/third-party/code').then(async (m) => {
@@ -63,7 +62,7 @@ const NotionPage = ({ post, className }) => {
 
   useEffect(() => {
     // 将相册gallery下的图片加入放大功能
-    if (JSON.parse(BLOG.POST_DISABLE_GALLERY_CLICK)) {
+    if (siteConfig('POST_DISABLE_GALLERY_CLICK')) {
       setTimeout(() => {
         if (isBrowser) {
           const imgList = document?.querySelectorAll('.notion-collection-card-cover img')
diff --git a/components/Player.js b/components/Player.js
index 82295e69..8c252615 100644
--- a/components/Player.js
+++ b/components/Player.js
@@ -1,27 +1,54 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
+import { loadExternalResource } from '@/lib/utils'
 import { useEffect, useRef, useState } from 'react'
 
+/**
+ * 音乐播放器
+ * @returns
+ */
 const Player = () => {
   const [player, setPlayer] = useState()
   const ref = useRef(null)
+  const lrcType = JSON.parse(siteConfig('MUSIC_PLAYER_LRC_TYPE'))
+  const playerVisible = JSON.parse(siteConfig('MUSIC_PLAYER_VISIBLE'))
+  const autoPlay = JSON.parse(siteConfig('MUSIC_PLAYER_AUTO_PLAY'))
+  const meting = JSON.parse(siteConfig('MUSIC_PLAYER_METING'))
+  const order = siteConfig('MUSIC_PLAYER_ORDER')
+  const audio = siteConfig('MUSIC_PLAYER_AUDIO_LIST')
 
-  const lrcType = JSON.parse(BLOG.MUSIC_PLAYER_LRC_TYPE)
-  const playerVisible = JSON.parse(BLOG.MUSIC_PLAYER_VISIBLE)
-  const autoPlay = JSON.parse(BLOG.MUSIC_PLAYER_AUTO_PLAY)
+  const musicPlayerEnable = siteConfig('MUSIC_PLAYER')
+  const musicPlayerCDN = siteConfig('MUSIC_PLAYER_CDN_URL')
+  const musicMetingEnable = siteConfig('MUSIC_PLAYER_METING')
+  const musicMetingCDNUrl = siteConfig('MUSIC_PLAYER_METING_CDN_URL', 'https://cdnjs.cloudflare.com/ajax/libs/meting/2.0.1/Meting.min.js')
 
-  const meting = JSON.parse(BLOG.MUSIC_PLAYER_METING)
+  const initMusicPlayer = async () => {
+    if (!musicPlayerEnable) {
+      return
+    }
+    try {
+      await loadExternalResource(musicPlayerCDN, 'js')
+    } catch (error) {
+      console.error('音乐组件异常', error)
+    }
+
+    if (musicMetingEnable) {
+      await loadExternalResource(musicMetingCDNUrl, 'js')
+    }
 
-  useEffect(() => {
     if (!meting && window.APlayer) {
       setPlayer(new window.APlayer({
         container: ref.current,
         fixed: true,
         lrcType: lrcType,
         autoplay: autoPlay,
-        order: BLOG.MUSIC_PLAYER_ORDER,
-        audio: BLOG.MUSIC_PLAYER_AUDIO_LIST
+        order: order,
+        audio: audio
       }))
     }
+  }
+
+  useEffect(() => {
+    initMusicPlayer()
     return () => {
       setPlayer(undefined)
     }
@@ -39,11 +66,11 @@ const Player = () => {
             fixed="true"
             type="playlist"
             preload="auto"
-            lrc-type={BLOG.MUSIC_PLAYER_METING_LRC_TYPE}
+            lrc-type={siteConfig('MUSIC_PLAYER_METING_LRC_TYPE')}
             autoplay={autoPlay}
-            order={BLOG.MUSIC_PLAYER_ORDER}
-            server={BLOG.MUSIC_PLAYER_METING_SERVER}
-            id={BLOG.MUSIC_PLAYER_METING_ID}
+            order={siteConfig('MUSIC_PLAYER_ORDER')}
+            server={siteConfig('MUSIC_PLAYER_METING_SERVER')}
+            id={siteConfig('MUSIC_PLAYER_METING_ID')}
           />
         : <div ref={ref} data-player={player} />
       }
diff --git a/components/PrismMac.js b/components/PrismMac.js
index 3e568e9f..c92d594d 100644
--- a/components/PrismMac.js
+++ b/components/PrismMac.js
@@ -10,10 +10,10 @@ import 'prismjs/plugins/line-numbers/prism-line-numbers'
 import 'prismjs/plugins/line-numbers/prism-line-numbers.css'
 
 // mermaid图
-import BLOG from '@/blog.config'
 import { loadExternalResource } from '@/lib/utils'
 import { useRouter } from 'next/navigation'
 import { useGlobal } from '@/lib/global'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 代码美化相关
@@ -23,22 +23,36 @@ import { useGlobal } from '@/lib/global'
 const PrismMac = () => {
   const router = useRouter()
   const { isDarkMode } = useGlobal()
+  const codeMacBar = siteConfig('CODE_MAC_BAR')
+  const prismjsAutoLoader = siteConfig('PRISM_JS_AUTO_LOADER')
+  const prismjsPath = siteConfig('PRISM_JS_PATH')
+
+  const prismThemeSwitch = siteConfig('PRISM_THEME_SWITCH')
+  const prismThemeDarkPath = siteConfig('PRISM_THEME_DARK_PATH')
+  const prismThemeLightPath = siteConfig('PRISM_THEME_LIGHT_PATH')
+  const prismThemePrefixPath = siteConfig('PRISM_THEME_PREFIX_PATH')
+
+  const mermaidCDN = siteConfig('MERMAID_CDN')
+  const codeLineNumbers = siteConfig('CODE_LINE_NUMBERS')
+
+  const codeCollapse = siteConfig('CODE_COLLAPSE')
+  const codeCollapseExpandDefault = siteConfig('CODE_COLLAPSE_EXPAND_DEFAULT')
 
   useEffect(() => {
-    if (JSON.parse(BLOG.CODE_MAC_BAR)) {
+    if (codeMacBar) {
       loadExternalResource('/css/prism-mac-style.css', 'css')
     }
     // 加载prism样式
-    loadPrismThemeCSS(isDarkMode)
+    loadPrismThemeCSS(isDarkMode, prismThemeSwitch, prismThemeDarkPath, prismThemeLightPath, prismThemePrefixPath)
     // 折叠代码
-    loadExternalResource(BLOG.PRISM_JS_AUTO_LOADER, 'js').then((url) => {
+    loadExternalResource(prismjsAutoLoader, 'js').then((url) => {
       if (window?.Prism?.plugins?.autoloader) {
-        window.Prism.plugins.autoloader.languages_path = BLOG.PRISM_JS_PATH
+        window.Prism.plugins.autoloader.languages_path = prismjsPath
       }
 
-      renderPrismMac()
-      renderMermaid()
-      renderCollapseCode()
+      renderPrismMac(codeLineNumbers)
+      renderMermaid(mermaidCDN)
+      renderCollapseCode(codeCollapse, codeCollapseExpandDefault)
     })
   }, [router, isDarkMode])
 
@@ -46,18 +60,18 @@ const PrismMac = () => {
 }
 
 /**
- * 加载样式
+ * 加载Prism主题样式
  */
-const loadPrismThemeCSS = (isDarkMode) => {
+const loadPrismThemeCSS = (isDarkMode, prismThemeSwitch, prismThemeDarkPath, prismThemeLightPath, prismThemePrefixPath) => {
   let PRISM_THEME
   let PRISM_PREVIOUS
-  if (JSON.parse(BLOG.PRISM_THEME_SWITCH)) {
+  if (prismThemeSwitch) {
     if (isDarkMode) {
-      PRISM_THEME = BLOG.PRISM_THEME_DARK_PATH
-      PRISM_PREVIOUS = BLOG.PRISM_THEME_LIGHT_PATH
+      PRISM_THEME = prismThemeDarkPath
+      PRISM_PREVIOUS = prismThemeLightPath
     } else {
-      PRISM_THEME = BLOG.PRISM_THEME_LIGHT_PATH
-      PRISM_PREVIOUS = BLOG.PRISM_THEME_DARK_PATH
+      PRISM_THEME = prismThemeLightPath
+      PRISM_PREVIOUS = prismThemeDarkPath
     }
     const previousTheme = document.querySelector(`link[href="${PRISM_PREVIOUS}"]`)
     if (previousTheme) {
@@ -65,15 +79,15 @@ const loadPrismThemeCSS = (isDarkMode) => {
     }
     loadExternalResource(PRISM_THEME, 'css')
   } else {
-    loadExternalResource(BLOG.PRISM_THEME_PREFIX_PATH, 'css')
+    loadExternalResource(prismThemePrefixPath, 'css')
   }
 }
 
 /*
  * 将代码块转为可折叠对象
  */
-const renderCollapseCode = () => {
-  if (!JSON.parse(BLOG.CODE_COLLAPSE)) {
+const renderCollapseCode = (codeCollapse, codeCollapseExpandDefault) => {
+  if (!codeCollapse) {
     return
   }
   const codeBlocks = document.querySelectorAll('.code-toolbar')
@@ -116,7 +130,7 @@ const renderCollapseCode = () => {
     // 点击后折叠展开代码
     header.addEventListener('click', collapseCode)
     // 是否自动展开
-    if (JSON.parse(BLOG.CODE_COLLAPSE_EXPAND_DEFAULT)) {
+    if (codeCollapseExpandDefault) {
       header.click()
     }
   }
@@ -125,7 +139,7 @@ const renderCollapseCode = () => {
 /**
  * 将mermaid语言 渲染成图片
  */
-const renderMermaid = async() => {
+const renderMermaid = async(mermaidCDN) => {
   const observer = new MutationObserver(async mutationsList => {
     for (const m of mutationsList) {
       if (m.target.className === 'notion-code language-mermaid') {
@@ -146,7 +160,7 @@ const renderMermaid = async() => {
             }
           }
           if (needLoad) {
-            loadExternalResource(BLOG.MERMAID_CDN, 'js').then(url => {
+            loadExternalResource(mermaidCDN, 'js').then(url => {
               setTimeout(() => {
                 const mermaid = window.mermaid
                 mermaid?.contentLoaded()
@@ -162,11 +176,11 @@ const renderMermaid = async() => {
   }
 }
 
-function renderPrismMac() {
+function renderPrismMac(codeLineNumbers) {
   const container = document?.getElementById('notion-article')
 
   // Add line numbers
-  if (JSON.parse(BLOG.CODE_LINE_NUMBERS)) {
+  if (codeLineNumbers) {
     const codeBlocks = container?.getElementsByTagName('pre')
     if (codeBlocks) {
       Array.from(codeBlocks).forEach(item => {
@@ -200,7 +214,7 @@ function renderPrismMac() {
   }
 
   // 折叠代码行号bug
-  if (JSON.parse(BLOG.CODE_LINE_NUMBERS)) {
+  if (codeLineNumbers) {
     fixCodeLineStyle()
   }
 }
diff --git a/components/QrCode.js b/components/QrCode.js
index 081a695f..09a203a7 100644
--- a/components/QrCode.js
+++ b/components/QrCode.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { loadExternalResource } from '@/lib/utils'
 import { useEffect } from 'react'
 
@@ -6,22 +6,26 @@ import { useEffect } from 'react'
  * 二维码生成
  */
 export default function QrCode({ value }) {
+  const qrCodeCDN = siteConfig('QR_CODE_CDN')
+
   useEffect(() => {
     let qrcode
     if (!value) {
       return
     }
-    loadExternalResource(BLOG.QR_CODE_CDN, 'js').then(url => {
-      const QRCode = window.QRCode
-      qrcode = new QRCode(document.getElementById('qrcode'), {
-        text: value,
-        width: 256,
-        height: 256,
-        colorDark: '#000000',
-        colorLight: '#ffffff',
-        correctLevel: QRCode.CorrectLevel.H
-      })
-    //   console.log('二维码', qrcode, value)
+    loadExternalResource(qrCodeCDN, 'js').then(url => {
+      const QRCode = window?.QRCode
+      if (typeof QRCode !== 'undefined') {
+        qrcode = new QRCode(document.getElementById('qrcode'), {
+          text: value,
+          width: 256,
+          height: 256,
+          colorDark: '#000000',
+          colorLight: '#ffffff',
+          correctLevel: QRCode.CorrectLevel.H
+        })
+        //   console.log('二维码', qrcode, value)
+      }
     })
     return () => {
       if (qrcode) {
diff --git a/components/ShareBar.js b/components/ShareBar.js
index caf03666..ba773b06 100644
--- a/components/ShareBar.js
+++ b/components/ShareBar.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useRouter } from 'next/router'
 import React from 'react'
 import ShareButtons from './ShareButtons'
@@ -6,18 +6,18 @@ import ShareButtons from './ShareButtons'
 const ShareBar = ({ post }) => {
   const router = useRouter()
 
-  if (!JSON.parse(BLOG.POST_SHARE_BAR_ENABLE) || !post || post?.type !== 'Post') {
+  if (!JSON.parse(siteConfig('POST_SHARE_BAR_ENABLE')) || !post || post?.type !== 'Post') {
     return <></>
   }
 
-  const shareUrl = BLOG.LINK + router.asPath
+  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 +
                 ' | ' +
-                BLOG.TITLE +
+                siteConfig('TITLE') +
                 ' ' +
                 shareUrl +
                 ' ' +
diff --git a/components/ShareButtons.js b/components/ShareButtons.js
index efd3ab87..bbd06d7a 100644
--- a/components/ShareButtons.js
+++ b/components/ShareButtons.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import copy from 'copy-to-clipboard'
 import dynamic from 'next/dynamic'
@@ -57,8 +57,8 @@ const QrCode = dynamic(() => import('@/components/QrCode'), { ssr: false })
  * @returns
  */
 const ShareButtons = ({ shareUrl, title, body, image }) => {
-  const services = BLOG.POSTS_SHARE_SERVICES.split(',')
-  const titleWithSiteInfo = title + ' | ' + BLOG.TITLE
+  const services = siteConfig('POSTS_SHARE_SERVICES').split(',')
+  const titleWithSiteInfo = title + ' | ' + siteConfig('TITLE')
   const { locale } = useGlobal()
   const [qrCodeShow, setQrCodeShow] = useState(false)
 
@@ -93,7 +93,7 @@ const ShareButtons = ({ shareUrl, title, body, image }) => {
                         <FacebookMessengerShareButton
                             key={singleService}
                             url={shareUrl}
-                            appId={BLOG.FACEBOOK_APP_ID}
+                            appId={siteConfig('FACEBOOK_APP_ID')}
                             className="mx-1"
                         >
                             <FacebookMessengerIcon size={32} round />
diff --git a/components/Tabs.js b/components/Tabs.js
index b354e533..c497bd0c 100644
--- a/components/Tabs.js
+++ b/components/Tabs.js
@@ -12,7 +12,7 @@ const Tabs = ({ className, children }) => {
     return <></>
   }
 
-  children = children.filter(c => c !== '')
+  children = children.filter(c => c && c !== '')
 
   let count = 0
   children.forEach(e => {
diff --git a/components/ThemeSwitch.js b/components/ThemeSwitch.js
index 1e140d79..5ec52819 100644
--- a/components/ThemeSwitch.js
+++ b/components/ThemeSwitch.js
@@ -1,21 +1,25 @@
 import { useGlobal } from '@/lib/global'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { Draggable } from './Draggable'
 import { THEMES } from '@/themes/theme'
 import { useRouter } from 'next/router'
 import DarkModeButton from './DarkModeButton'
+import { getQueryParam } from '@/lib/utils'
+import LANGS from '@/lib/lang'
 /**
  *
  * @returns 主题切换
  */
 const ThemeSwitch = () => {
-  const { theme } = useGlobal()
+  const { theme, lang, changeLang, locale, isDarkMode, toggleDarkMode } = useGlobal()
   const router = useRouter()
+  const currentTheme = getQueryParam(router.asPath, 'theme') || theme
+  //   const currentLang = getQueryParam(router.asPath, 'lang') || lang
   const [isLoading, setIsLoading] = useState(false)
 
   // 修改当前路径url中的 theme 参数
   // 例如 http://localhost?theme=hexo 跳转到 http://localhost?theme=newTheme
-  const onSelectChange = (e) => {
+  const onThemeSelectChange = (e) => {
     setIsLoading(true)
     const newTheme = e.target.value
     const query = router.query
@@ -25,27 +29,52 @@ const ThemeSwitch = () => {
     })
   }
 
+  const onLangSelectChange = (e) => {
+    const newLang = e.target.value
+    changeLang(newLang)
+  }
+
   return (<>
         <Draggable>
-            <div id="draggableBox" style={{ left: '10px', top: '80vh' }} className="fixed z-50 dark:text-white bg-gray-50 dark:bg-black rounded-2xl drop-shadow-lg">
-                <div className="p-3 w-full flex items-center text-sm group duration-200 transition-all">
-                    <DarkModeButton className='mr-2' />
-                    <div className='w-0 group-hover:w-20 transition-all duration-200 overflow-hidden'>
-                        <select value={theme} onChange={onSelectChange} name="themes" className='appearance-none outline-none dark:text-white bg-gray-50 dark:bg-black uppercase cursor-pointer'>
+            <div id="draggableBox" style={{ left: '0px', top: '80vh' }} className="fixed group space-y-2 overflow-hidden z-50 p-3 flex flex-col items-start dark:text-white bg-gray-50 dark:bg-black rounded-xl shadow-lg border dark:border-gray-800">
+                {/* 深色按钮 */}
+                <div className="text-sm flex items-center w-0 group-hover:w-32 transition-all duration-200">
+                    <DarkModeButton />
+                    <div onClick={toggleDarkMode} className='cursor-pointer w-0 group-hover:w-24 transition-all duration-200 overflow-hidden whitespace-nowrap pl-1 h-auto'>{isDarkMode ? locale.MENU.DARK_MODE : locale.MENU.LIGHT_MODE}</div>
+                </div>
+
+                {/* 翻译按钮 */}
+                <div className="text-sm flex items-center group-hover:w-32 transition-all duration-200">
+                    <i className="fa-solid fa-language w-5" />
+                    <div className='w-0 group-hover:w-24 transition-all duration-200 overflow-hidden'>
+                        <select value={lang} onChange={onLangSelectChange} name="themes" className='pl-1 bg-gray-50 dark:bg-black appearance-none outline-none dark:text-white uppercase cursor-pointer'>
+                            {Object.keys(LANGS)?.map(t => {
+                              return <option key={t} value={t}>{LANGS[t].LOCALE}</option>
+                            })}
+                        </select>
+                    </div>
+                </div>
+
+                {/* 主题切换按钮 */}
+                <div className="text-sm flex items-center group-hover:w-32 transition-all duration-200">
+                    <i className="fa-solid fa-palette w-5" />
+                    <div className='w-0 group-hover:w-24 transition-all duration-200 overflow-hidden'>
+                        <select value={currentTheme} onChange={onThemeSelectChange} name="themes" className='pl-1 bg-gray-50 dark:bg-black appearance-none outline-none dark:text-white uppercase cursor-pointer'>
                             {THEMES?.map(t => {
                               return <option key={t} value={t}>{t}</option>
                             })}
                         </select>
                     </div>
-                    <i className="fa-solid fa-palette pl-2"></i>
                 </div>
             </div>
-            {/* 切换主题加载时的全屏遮罩 */}
-            <div className={`${isLoading ? 'opacity-50 ' : 'opacity-0'} w-screen h-screen bg-black text-white shadow-text flex justify-center items-center
-                              transition-all fixed top-0 left-0 pointer-events-none duration-1000 z-50 shadow-inner`}>
-                <i className='text-3xl mr-5 fas fa-spinner animate-spin' />
-            </div>
         </Draggable>
+
+        {/* 切换主题加载时的全屏遮罩 */}
+        <div className={`${isLoading ? 'opacity-50 ' : 'opacity-0'} 
+            w-screen h-screen bg-black text-white shadow-text flex justify-center items-center
+            transition-all fixed top-0 left-0 pointer-events-none duration-1000 z-50 shadow-inner`}>
+            <i className='text-3xl mr-5 fas fa-spinner animate-spin' />
+        </div>
     </>
   )
 }
diff --git a/components/Twikoo.js b/components/Twikoo.js
index 309467f2..6899cfaa 100644
--- a/components/Twikoo.js
+++ b/components/Twikoo.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 // import { loadExternalResource } from '@/lib/utils'
 import { useEffect } from 'react'
 
@@ -10,14 +10,21 @@ import { useEffect } from 'react'
  */
 
 const Twikoo = ({ isDarkMode }) => {
+  const envId = siteConfig('COMMENT_TWIKOO_ENV_ID')
+  const el = siteConfig('COMMENT_TWIKOO_ELEMENT_ID', '#twikoo')
+
+  const lang = siteConfig('LANG')
   useEffect(() => {
-    window?.twikoo?.init({
-      envId: BLOG.COMMENT_TWIKOO_ENV_ID, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）
-      el: '#twikoo', // 容器元素
-      lang: BLOG.LANG // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js
-      // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填
-      // path: location.pathname, // 用于区分不同文章的自定义 js 路径，如果您的文章路径不是 location.pathname，需传此参数
-    })
+    const twikoo = window?.twikoo
+    if (typeof twikoo !== 'undefined' && twikoo && typeof twikoo.init === 'function') {
+      twikoo.init({
+        envId: envId, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）
+        el: el, // 容器元素
+        lang: lang // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js
+        // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填
+        // path: location.pathname, // 用于区分不同文章的自定义 js 路径，如果您的文章路径不是 location.pathname，需传此参数
+      })
+    }
   }, [isDarkMode])
   return (
         <div id="twikoo"></div>
diff --git a/components/TwikooCommentCount.js b/components/TwikooCommentCount.js
index eb5cd605..29408d21 100644
--- a/components/TwikooCommentCount.js
+++ b/components/TwikooCommentCount.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 // import twikoo from 'twikoo'
 
 /**
@@ -8,7 +8,7 @@ import BLOG from '@/blog.config'
  */
 
 const TwikooCommentCount = ({ post, className }) => {
-  if (!JSON.parse(BLOG.COMMENT_TWIKOO_COUNT_ENABLE)) {
+  if (!JSON.parse(siteConfig('COMMENT_TWIKOO_COUNT_ENABLE'))) {
     return null
   }
   return <a href={`${post.slug}?target=comment`} className={`mx-1 hidden comment-count-wrapper-${post.id} ${className || ''}`}>
diff --git a/components/TwikooCommentCounter.js b/components/TwikooCommentCounter.js
index 87c16aaf..7e2a15df 100644
--- a/components/TwikooCommentCounter.js
+++ b/components/TwikooCommentCounter.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { loadExternalResource } from '@/lib/utils'
 import { useRouter } from 'next/router'
@@ -13,16 +13,37 @@ import { useEffect } from 'react'
 const TwikooCommentCounter = (props) => {
   let commentsData = []
   const { theme } = useGlobal()
+  const router = useRouter()
 
+  useEffect(() => {
+    // console.log('路由触发评论计数')
+    if (props?.posts && props?.posts?.length > 0) {
+      fetchTwikooData(props.posts)
+    }
+  }, [router.events])
+
+  // 监控主题变化时的的评论数
+  useEffect(() => {
+    // console.log('主题触发评论计数', commentsData)
+    updateCommentCount()
+  }, [theme])
+
+  const twikooCDNURL = siteConfig('COMMENT_TWIKOO_CDN_URL')
+  const twikooENVID = siteConfig('COMMENT_TWIKOO_ENV_ID')
+
+  /**
+   * 加载外部twikoojs
+   * @param {*} posts
+   */
   const fetchTwikooData = async (posts) => {
     posts.forEach(post => {
       post.slug = post.slug.startsWith('/') ? post.slug : `/${post.slug}`
     })
     try {
-      await loadExternalResource(BLOG.COMMENT_TWIKOO_CDN_URL, 'js')
+      await loadExternalResource(twikooCDNURL, 'js')
       const twikoo = window.twikoo
       twikoo.getCommentsCount({
-        envId: BLOG.COMMENT_TWIKOO_ENV_ID, // 环境 ID
+        envId: twikooENVID, // 环境 ID
         // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，如果您的环境地域不是上海，需传此参数
         urls: posts?.map(post => post.slug), // 不包含协议、域名、参数的文章路径列表，必传参数
         includeReply: true // 评论数是否包括回复，默认：false
@@ -58,20 +79,7 @@ const TwikooCommentCounter = (props) => {
       }
     })
   }
-  const router = useRouter()
 
-  useEffect(() => {
-    // console.log('路由触发评论计数')
-    if (props?.posts && props?.posts?.length > 0) {
-      fetchTwikooData(props.posts)
-    }
-  }, [router.events])
-
-  // 监控主题变化时的的评论数
-  useEffect(() => {
-    // console.log('主题触发评论计数', commentsData)
-    updateCommentCount()
-  }, [theme])
   return null
 }
 
diff --git a/components/Utterances.js b/components/Utterances.js
index e0298daf..3524c646 100644
--- a/components/Utterances.js
+++ b/components/Utterances.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useEffect } from 'react'
 
 /**
@@ -11,9 +11,9 @@ import { useEffect } from 'react'
 const Utterances = ({ issueTerm, layout }) => {
   useEffect(() => {
     const theme =
-      BLOG.APPEARANCE === 'auto'
+      siteConfig('APPEARANCE') === 'auto'
         ? 'preferred-color-scheme'
-        : BLOG.APPEARANCE === 'light'
+        : siteConfig('APPEARANCE') === 'light'
           ? 'github-light'
           : 'github-dark'
     const script = document.createElement('script')
@@ -21,7 +21,7 @@ const Utterances = ({ issueTerm, layout }) => {
     script.setAttribute('src', 'https://utteranc.es/client.js')
     script.setAttribute('crossorigin', 'anonymous')
     script.setAttribute('async', true)
-    script.setAttribute('repo', BLOG.COMMENT_UTTERRANCES_REPO)
+    script.setAttribute('repo', siteConfig('COMMENT_UTTERRANCES_REPO'))
     script.setAttribute('issue-term', 'title')
     script.setAttribute('theme', theme)
     anchor.appendChild(script)
diff --git a/components/ValineComponent.js b/components/ValineComponent.js
index 0a7ab6cb..b26fb34d 100644
--- a/components/ValineComponent.js
+++ b/components/ValineComponent.js
@@ -1,23 +1,23 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { loadExternalResource } from '@/lib/utils'
 import { useEffect } from 'react'
 
 const ValineComponent = ({ path }) => {
   const loadValine = async () => {
     try {
-      await loadExternalResource(BLOG.COMMENT_VALINE_CDN, 'js')
+      await loadExternalResource(siteConfig('COMMENT_VALINE_CDN'), 'js')
       const Valine = window.Valine
       // eslint-disable-next-line no-unused-vars
       const valine = new Valine({
         el: '#valine', // 容器元素
-        lang: BLOG.LANG, // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js
-        appId: BLOG.COMMENT_VALINE_APP_ID,
-        appKey: BLOG.COMMENT_VALINE_APP_KEY,
+        lang: siteConfig('LANG'), // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js
+        appId: siteConfig('COMMENT_VALINE_APP_ID'),
+        appKey: siteConfig('COMMENT_VALINE_APP_KEY'),
         avatar: '',
         path,
         recordIP: true,
-        placeholder: BLOG.COMMENT_VALINE_PLACEHOLDER,
-        serverURLs: BLOG.COMMENT_VALINE_SERVER_URLS,
+        placeholder: siteConfig('COMMENT_VALINE_PLACEHOLDER'),
+        serverURLs: siteConfig('COMMENT_VALINE_SERVER_URLS'),
         visitor: true
       })
     } catch (error) {
diff --git a/components/WWAds.js b/components/WWAds.js
index 87901f39..d1f786a4 100644
--- a/components/WWAds.js
+++ b/components/WWAds.js
@@ -1,5 +1,4 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 万维广告插件
@@ -8,11 +7,13 @@ import BLOG from '@/blog.config'
  * @returns {JSX.Element | null} - 返回渲染的 JSX 元素或 null
  */
 export default function WWAds({ orientation = 'vertical', sticky = false, className }) {
-  if (!JSON.parse(BLOG.AD_WWADS_ID)) {
+  const adWWADSId = siteConfig('AD_WWADS_ID')
+
+  if (!adWWADSId) {
     return null
   }
 
-  return (
-    <div className={`wwads-cn ${orientation === 'vertical' ? 'wwads-vertical' : 'wwads-horizontal'} ${sticky ? 'wwads-sticky' : ''} z-10 ${className || ''}`} data-id={BLOG.AD_WWADS_ID}></div>
-  )
+  return <div data-id={adWWADSId} className={`wwads-cn 
+            ${orientation === 'vertical' ? 'wwads-vertical' : 'wwads-horizontal'}
+            ${sticky ? 'wwads-sticky' : ''} z-10 ${className || ''}`} />
 }
diff --git a/components/WalineComponent.js b/components/WalineComponent.js
index 0b033922..37247d48 100644
--- a/components/WalineComponent.js
+++ b/components/WalineComponent.js
@@ -1,8 +1,8 @@
-import React from 'react'
+import React, { createRef } from 'react'
 import { init } from '@waline/client'
-import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import '@waline/client/dist/waline.css'
+import { siteConfig } from '@/lib/config'
 
 const path = ''
 let waline = null
@@ -12,7 +12,7 @@ let waline = null
  * @returns
  */
 const WalineComponent = (props) => {
-  const containerRef = React.createRef()
+  const containerRef = createRef()
   const router = useRouter()
 
   const updateWaline = url => {
@@ -26,8 +26,8 @@ const WalineComponent = (props) => {
       waline = init({
         ...props,
         el: containerRef.current,
-        serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
-        lang: BLOG.lang,
+        serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
+        lang: siteConfig('LANG'),
         reaction: true,
         dark: 'html.dark',
         emoji: [
diff --git a/components/WebMention.js b/components/WebMention.js
index 375a0141..61e11c69 100644
--- a/components/WebMention.js
+++ b/components/WebMention.js
@@ -1,7 +1,7 @@
-import BLOG from '@/blog.config'
 import { useEffect, useState } from 'react'
 import { useRouter } from 'next/router'
 import Image from 'next/image'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 评论插件
@@ -78,7 +78,7 @@ const WebmentionReplies = ({ target }) => {
   const [mentions, setMentions] = useState([])
   const fetchMentions = async (target) =>
     fetch(
-      `https://webmention.io/api/mentions.jf2?per-page=500&target=${encodeURIComponent(target)}&token=${BLOG.COMMENT_WEBMENTION.TOKEN}`
+      `https://webmention.io/api/mentions.jf2?per-page=500&target=${encodeURIComponent(target)}&token=${siteConfig('COMMENT_WEBMENTION_TOKEN')}`
     ).then((response) => (response.json ? response.json() : response))
   useEffect(() => {
     async function getMentions() {
@@ -137,8 +137,8 @@ const WebmentionReplies = ({ target }) => {
 
 const WebMentionBlock = ({ frontMatter }) => {
   const router = useRouter()
-  const url = `https://${BLOG.COMMENT_WEBMENTION.HOSTNAME}${router.asPath}`
-  const tweet = `${frontMatter.title} by @${BLOG.COMMENT_WEBMENTION.TWITTER_USERNAME} ${url}`
+  const url = `https://${siteConfig('COMMENT_WEBMENTION_HOSTNAME')}${router.asPath}`
+  const tweet = `${frontMatter.title} by @${siteConfig('COMMENT_WEBMENTION_TWITTER_USERNAME')} ${url}`
 
   return (
     <div className='webmention-block'>
diff --git a/components/Webwhiz.js b/components/Webwhiz.js
index 690333cb..4a736647 100644
--- a/components/Webwhiz.js
+++ b/components/Webwhiz.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import ExternalScript from './ExternalScript'
 
 /**
@@ -10,8 +10,8 @@ export default function WebWhiz() {
   const props = {
     id: '__webwhizSdk__',
     src: 'https://www.unpkg.com/webwhiz@1.0.0/dist/sdk.js',
-    baseUrl: BLOG.WEB_WHIZ_BASE_URL,
-    chatbotId: BLOG.WEB_WHIZ_CHAT_BOT_ID
+    baseUrl: siteConfig('WEB_WHIZ_BASE_URL'),
+    chatbotId: siteConfig('WEB_WHIZ_CHAT_BOT_ID')
   }
   return <ExternalScript {...props}/>
 }
diff --git a/lib/cache/cache_manager.js b/lib/cache/cache_manager.js
index 8796d3f4..4928bca9 100644
--- a/lib/cache/cache_manager.js
+++ b/lib/cache/cache_manager.js
@@ -3,15 +3,6 @@ import FileCache from './local_file_cache'
 import MongoCache from './mongo_db_cache'
 import BLOG from '@/blog.config'
 
-let api
-if (process.env.MONGO_DB_URL && process.env.MONGO_DB_NAME) {
-  api = MongoCache
-} else if (process.env.ENABLE_FILE_CACHE) {
-  api = FileCache
-} else {
-  api = MemoryCache
-}
-
 /**
  * 为减少频繁接口请求，notion数据将被缓存
  * @param {*} key
@@ -19,11 +10,11 @@ if (process.env.MONGO_DB_URL && process.env.MONGO_DB_NAME) {
  */
 export async function getDataFromCache(key, force) {
   if (BLOG.ENABLE_CACHE || force) {
-    const dataFromCache = await api.getCache(key)
+    const dataFromCache = await getApi().getCache(key)
     if (JSON.stringify(dataFromCache) === '[]') {
       return null
     }
-    return api.getCache(key)
+    return getApi().getCache(key)
   } else {
     return null
   }
@@ -33,12 +24,26 @@ export async function setDataToCache(key, data) {
   if (!data) {
     return
   }
-  await api.setCache(key, data)
+  await getApi().setCache(key, data)
 }
 
 export async function delCacheData(key) {
   if (!BLOG.ENABLE_CACHE) {
     return
   }
-  await api.delCache(key)
+  await getApi().delCache(key)
+}
+
+/**
+ * 缓存实现类
+ * @returns
+ */
+function getApi() {
+  if (process.env.MONGO_DB_URL && process.env.MONGO_DB_NAME) {
+    return MongoCache
+  } else if (process.env.ENABLE_FILE_CACHE) {
+    return FileCache
+  } else {
+    return MemoryCache
+  }
 }
diff --git a/lib/cache/local_file_cache.js b/lib/cache/local_file_cache.js
index cda7f35a..c411d6e5 100644
--- a/lib/cache/local_file_cache.js
+++ b/lib/cache/local_file_cache.js
@@ -41,7 +41,7 @@ export async function setCache (key, data) {
   fs.writeFileSync(jsonFile, JSON.stringify(json))
 }
 
-export async function delCache (key, data) {
+export async function delCache (key) {
   const exist = await fs.existsSync(jsonFile)
   const json = exist ? JSON.parse(await fs.readFileSync(jsonFile)) : {}
   delete json.key
@@ -49,4 +49,12 @@ export async function delCache (key, data) {
   fs.writeFileSync(jsonFile, JSON.stringify(json))
 }
 
+/**
+ * 清理缓存
+ */
+export async function cleanCache() {
+  const json = {}
+  fs.writeFileSync(jsonFile, JSON.stringify(json))
+}
+
 export default { getCache, setCache, delCache }
diff --git a/lib/config.js b/lib/config.js
new file mode 100644
index 00000000..e2630825
--- /dev/null
+++ b/lib/config.js
@@ -0,0 +1,93 @@
+'use client'
+
+import BLOG from '@/blog.config'
+import { useGlobal } from './global'
+import { deepClone } from './utils'
+
+/**
+ * 读取配置顺序
+ * 1. 优先读取NotionConfig表
+ * 2. 其次读取环境变量
+ * 3. 再读取blog.config.js / 或各个主题的CONFIG文件
+ * @param {*} key ； 参数名
+ * @param {*} defaultVal ; 参数不存在默认返回值
+ * @param {*} extendConfig ; 参考配置对象{key:val}，如果notion中找不到优先尝试在这里面查找
+ * @returns
+ */
+export const siteConfig = (key, defaultVal = null, extendConfig = null) => {
+  let global = null
+  try {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    global = useGlobal()
+  } catch (error) {}
+
+  // 首先 配置最优先读取NOTION中的表格配置
+  let val = null
+  let siteInfo = null
+
+  if (global) {
+    val = global.NOTION_CONFIG?.[key]
+    siteInfo = global.siteInfo
+    // console.log('当前变量', key, val)
+  }
+
+  if (!val) {
+    // 这里针对部分key做一些兼容处理
+    switch (key) {
+      case 'HOME_BANNER_IMAGE':
+        val = siteInfo?.pageCover // 封面图取Notion的封面
+        break
+      case 'AVATAR':
+        val = siteInfo?.icon // 封面图取Notion的头像
+        break
+      case 'TITLE':
+        val = siteInfo?.title // 标题取Notion中的标题
+        break
+      case 'DESCRIPTION':
+        val = siteInfo?.description // 标题取Notion中的标题
+        break
+    }
+  }
+
+  // 其次 有传入的配置参考，则尝试读取
+  if (!val && extendConfig) {
+    val = extendConfig[key]
+  }
+
+  // 其次 NOTION没有找到配置，则会读取blog.config.js文件
+  if (!val) {
+    val = BLOG[key]
+  }
+
+  if (!val) {
+    return defaultVal
+  } else {
+    if (typeof val === 'string') {
+      return val;
+    } else {
+      try {
+        return JSON.parse(val);
+      } catch (error) {
+        // 如果值是一个字符串但不是有效的 JSON 格式，直接返回字符串
+        return val;
+      }
+    }
+  }
+}
+
+/**
+ * 读取所有配置
+ * 1. 优先读取NotionConfig表
+ * 2. 其次读取环境变量
+ * 3. 再读取blog.config.js文件
+ * @param {*} key
+ * @returns
+ */
+export const siteConfigMap = () => {
+  const val = deepClone(BLOG)
+  for (const key in val) {
+    val[key] = siteConfig(key)
+    // console.log('site', key, val[key], siteConfig(key))
+  }
+  return val
+}
diff --git a/lib/global.js b/lib/global.js
index c290a9e0..df119ac3 100644
--- a/lib/global.js
+++ b/lib/global.js
@@ -1,34 +1,65 @@
 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 { THEMES, initDarkMode } from '@/themes/theme'
 import NProgress from 'nprogress'
-import { getQueryVariable, isBrowser } from './utils'
 
 const GlobalContext = createContext()
 
 /**
- * 全局变量Provider，包括语言本地化、样式主题、搜索词
+ * 定义全局变量，包括语言、主题、深色模式、加载状态
  * @param children
  * @returns {JSX.Element}
  * @constructor
  */
 export function GlobalContextProvider(props) {
-  const { children, siteInfo, categoryOptions, tagOptions } = props
+  const { children, siteInfo, categoryOptions, tagOptions, NOTION_CONFIG } = props
   const router = useRouter()
-  const [lang, updateLang] = useState(BLOG.LANG) // 默认语言
-  const [locale, updateLocale] = useState(generateLocaleDict(BLOG.LANG)) // 默认语言
-  const [theme, setTheme] = useState(BLOG.THEME) // 默认博客主题
-  const [isDarkMode, updateDarkMode] = useState(BLOG.APPEARANCE === 'dark') // 默认深色模式
+  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 [onLoading, setOnLoading] = useState(false) // 抓取文章数据
 
+  // 切换主题
+  function switchTheme() {
+    const currentIndex = THEMES.indexOf(theme)
+    const newIndex = currentIndex < THEMES.length - 1 ? currentIndex + 1 : 0
+    const newTheme = THEMES[newIndex]
+    const query = router.query
+    query.theme = newTheme
+    router.push({ pathname: router.pathname, query })
+    return newTheme
+  }
+
+  // 切换深色模式
+  const toggleDarkMode = () => {
+    const newStatus = !isDarkMode
+    saveDarkModeToCookies(newStatus)
+    updateDarkMode(newStatus)
+    const htmlElement = document.getElementsByTagName('html')[0]
+    htmlElement.classList?.remove(newStatus ? 'light' : 'dark')
+    htmlElement.classList?.add(newStatus ? 'dark' : 'light')
+  }
+
+  /**
+   * 更新语言
+   */
+  function changeLang(lang) {
+    if (lang) {
+      updateLang(lang)
+      updateLocale(generateLocaleDict(lang))
+    }
+  }
+
   useEffect(() => {
-    initLocale(lang, locale, updateLang, updateLocale)
     initDarkMode(updateDarkMode)
-    initTheme()
+    initLocale(lang, locale, updateLang, updateLocale)
   }, [])
 
+  // 加载进度条
   useEffect(() => {
     const handleStart = (url) => {
       NProgress.start()
@@ -43,8 +74,7 @@ export function GlobalContextProvider(props) {
       NProgress.done()
       setOnLoading(false)
     }
-    const queryTheme = getQueryVariable('theme') || BLOG.THEME
-    setTheme(queryTheme)
+
     router.events.on('routeChangeStart', handleStart)
     router.events.on('routeChangeError', handleStop)
     router.events.on('routeChangeComplete', handleStop)
@@ -55,21 +85,14 @@ export function GlobalContextProvider(props) {
     }
   }, [router])
 
-  // 切换主题
-  function switchTheme() {
-    const currentIndex = THEMES.indexOf(theme)
-    const newIndex = currentIndex < THEMES.length - 1 ? currentIndex + 1 : 0
-    const newTheme = THEMES[newIndex]
-    const query = router.query
-    query.theme = newTheme
-    router.push({ pathname: router.pathname, query })
-    return newTheme
-  }
-
   return (
         <GlobalContext.Provider value={{
+          NOTION_CONFIG,
+          toggleDarkMode,
           onLoading,
           setOnLoading,
+          lang,
+          changeLang,
           locale,
           updateLocale,
           isDarkMode,
@@ -86,23 +109,4 @@ export function GlobalContextProvider(props) {
   )
 }
 
-/**
- * 切换主题时的特殊处理
- * @param {*} setTheme
- */
-const initTheme = () => {
-  if (isBrowser) {
-    setTimeout(() => {
-      const elements = document.querySelectorAll('[id^="theme-"]')
-      if (elements?.length > 1) {
-        elements[elements.length - 1].scrollIntoView()
-        // 删除前面的元素，只保留最后一个元素
-        for (let i = 0; i < elements.length - 1; i++) {
-          elements[i].parentNode.removeChild(elements[i])
-        }
-      }
-    }, 500)
-  }
-}
-
 export const useGlobal = () => useContext(GlobalContext)
diff --git a/lib/lang.js b/lib/lang.js
index abc51354..3e2307f7 100644
--- a/lib/lang.js
+++ b/lib/lang.js
@@ -12,7 +12,7 @@ import { getQueryVariable, isBrowser, mergeDeep } from './utils'
  * 在这里配置所有支持的语言
  * 国家-地区
  */
-const lang = {
+const LANGS = {
   'en-US': enUS,
   'zh-CN': zhCN,
   'zh-HK': zhHK,
@@ -22,7 +22,7 @@ const lang = {
   'ja-JP': jaJP
 }
 
-export default lang
+export default LANGS
 
 /**
  * 获取当前语言字典
@@ -30,33 +30,33 @@ export default lang
  * @returns 不同语言对应字典
  */
 export function generateLocaleDict(langString) {
-  const supportedLocales = Object.keys(lang)
+  const supportedLocales = Object.keys(LANGS)
   let userLocale
 
   // 将语言字符串拆分为语言和地区代码，例如将 "zh-CN" 拆分为 "zh" 和 "CN"
-  const [language, region] = langString.split(/[-_]/)
+  const [language, region] = langString?.split(/[-_]/)
 
   // 优先匹配语言和地区都匹配的情况
   const specificLocale = `${language}-${region}`
   if (supportedLocales.includes(specificLocale)) {
-    userLocale = lang[specificLocale]
+    userLocale = LANGS[specificLocale]
   }
 
   // 然后尝试匹配只有语言匹配的情况
   if (!userLocale) {
     const languageOnlyLocales = supportedLocales.filter(locale => locale.startsWith(language))
     if (languageOnlyLocales.length > 0) {
-      userLocale = lang[languageOnlyLocales[0]]
+      userLocale = LANGS[languageOnlyLocales[0]]
     }
   }
 
   // 如果还没匹配到，则返回最接近的语言包
   if (!userLocale) {
     const fallbackLocale = supportedLocales.find(locale => locale.startsWith('en'))
-    userLocale = lang[fallbackLocale]
+    userLocale = LANGS[fallbackLocale]
   }
 
-  return mergeDeep({}, lang['en-US'], userLocale)
+  return mergeDeep({}, LANGS['en-US'], userLocale)
 }
 
 /**
@@ -65,11 +65,12 @@ export function generateLocaleDict(langString) {
  */
 export function initLocale(lang, locale, changeLang, changeLocale) {
   if (isBrowser) {
-    const queryLang = getQueryVariable('lang') || loadLangFromCookies() || window.navigator.language
+    const queryLang = getQueryVariable('lang') || loadLangFromCookies()
     let currentLang = lang
-    if (queryLang !== lang) {
+    if (queryLang && queryLang !== 'undefined' && queryLang !== lang) {
       currentLang = queryLang
     }
+
     changeLang(currentLang)
     saveLangToCookies(currentLang)
 
diff --git a/lib/lang/en-US.js b/lib/lang/en-US.js
index 51e38115..594ddfc0 100644
--- a/lib/lang/en-US.js
+++ b/lib/lang/en-US.js
@@ -1,5 +1,5 @@
 export default {
-  LOCALE: 'en-US',
+  LOCALE: 'English',
   MENU: {
     WALK_AROUND: 'Walk Around',
     CATEGORY: 'Category',
diff --git a/lib/lang/fr-FR.js b/lib/lang/fr-FR.js
index 30089a70..2bc40057 100644
--- a/lib/lang/fr-FR.js
+++ b/lib/lang/fr-FR.js
@@ -1,5 +1,5 @@
 export default {
-  LOCALE: 'fr-FR',
+  LOCALE: 'français',
   NAV: {
     INDEX: 'Accueil',
     RSS: 'RSS',
diff --git a/lib/lang/ja-JP.js b/lib/lang/ja-JP.js
index ab0e81f8..c27eef0b 100644
--- a/lib/lang/ja-JP.js
+++ b/lib/lang/ja-JP.js
@@ -1,5 +1,5 @@
 export default {
-  LOCALE: 'ja-JP',
+  LOCALE: '日本語',
   NAV: {
     INDEX: 'ホーム',
     RSS: '購読',
diff --git a/lib/lang/tr-TR.js b/lib/lang/tr-TR.js
index 227b3fba..5be7a520 100644
--- a/lib/lang/tr-TR.js
+++ b/lib/lang/tr-TR.js
@@ -1,5 +1,5 @@
 export default {
-  LOCALE: 'tr-TR',
+  LOCALE: 'Türkçe',
   NAV: {
     INDEX: 'Blog',
     RSS: 'RSS',
diff --git a/lib/lang/zh-CN.js b/lib/lang/zh-CN.js
index 91a4600a..e29af3d5 100644
--- a/lib/lang/zh-CN.js
+++ b/lib/lang/zh-CN.js
@@ -1,5 +1,5 @@
 export default {
-  LOCALE: 'zh-CN',
+  LOCALE: '中文(简体)',
   MENU: {
     WALK_AROUND: '随便逛逛',
     CATEGORY: '博客分类',
diff --git a/lib/lang/zh-HK.js b/lib/lang/zh-HK.js
index 6a05df55..f434fe6e 100644
--- a/lib/lang/zh-HK.js
+++ b/lib/lang/zh-HK.js
@@ -1,4 +1,5 @@
 export default {
+  LOCALE: '中文(繁体香港)',
   NAV: {
     INDEX: '網誌',
     RSS: '訂閱',
diff --git a/lib/lang/zh-TW.js b/lib/lang/zh-TW.js
index 673fe109..de746c08 100644
--- a/lib/lang/zh-TW.js
+++ b/lib/lang/zh-TW.js
@@ -1,5 +1,5 @@
 export default {
-  LOCALE: 'zh-TW',
+  LOCALE: '中文(繁体台湾)',
   NAV: {
     INDEX: '部落格',
     RSS: '訂閱',
diff --git a/lib/notion/getNotionConfig.js b/lib/notion/getNotionConfig.js
new file mode 100644
index 00000000..7d026fbd
--- /dev/null
+++ b/lib/notion/getNotionConfig.js
@@ -0,0 +1,136 @@
+/**
+ * 从Notion中读取站点配置;
+ * 在Notion模板中创建一个类型为CONFIG的页面，再添加一个数据库表格，即可用于填写配置
+ * Notion数据库配置优先级最高，将覆盖vercel环境变量以及blog.config.js中的配置
+ * --注意--
+ * 数据库请从模板复制 https://www.notion.so/tanghh/287869a92e3d4d598cf366bd6994755e
+ *
+ */
+import { getDateValue, getTextContent } from 'notion-utils'
+import { getPostBlocks } from './getPostBlocks'
+import getAllPageIds from './getAllPageIds'
+
+/**
+ * 从Notion中读取Config配置表
+ * @param {*} allPages
+ * @returns
+ */
+export async function getConfigMapFromConfigPage(allPages) {
+  // 默认返回配置文件
+  const notionConfig = {}
+
+  if (!allPages || !Array.isArray(allPages) || allPages.length === 0) {
+    console.warn('[Notion配置] 忽略的配置')
+    return null
+  }
+  const configPage = allPages?.find(post => {
+    return post && post?.type && post?.type === 'CONFIG'
+  })
+
+  if (!configPage) {
+    console.warn('[Notion配置] 未找到配置页面')
+    return null
+  }
+  const configPageId = configPage.id
+
+  //   console.log('[Notion配置]请求配置数据 ', configPage.id)
+  const pageRecordMap = await getPostBlocks(configPageId, 'config-table')
+  //   console.log('配置中心Page', configPageId, pageRecordMap)
+  const content = pageRecordMap.block[configPageId].value.content
+
+  if (!content) {
+    console.warn('[Notion配置] 未找到配置表格', pageRecordMap.block[configPageId], pageRecordMap.block[configPageId].value)
+    return null
+  }
+
+  // 找到配置文件中的database
+  //   for (const contentId of content) {
+  //     console.log('内容', contentId, configPageRecordMap.block[contentId].value.type === 'collection_view')
+  //   }
+  const configTableId = content?.find(contentId => {
+    return pageRecordMap.block[contentId].value.type === 'collection_view'
+  })
+
+  // eslint-disable-next-line no-constant-condition, no-self-compare
+  if (!configTableId) {
+    console.warn('[Notion配置]未找到配置表格数据', pageRecordMap.block[configPageId], pageRecordMap.block[configPageId].value)
+    return null
+  }
+
+  // 页面查找
+  const databaseRecordMap = pageRecordMap.block[configTableId]
+  const block = pageRecordMap.block || {}
+  const rawMetadata = databaseRecordMap.value
+  // Check Type Page-Database和Inline-Database
+  if (
+    rawMetadata?.type !== 'collection_view_page' && rawMetadata?.type !== 'collection_view'
+  ) {
+    console.error(`pageId "${configTableId}" is not a database`)
+    return null
+  }
+  //   console.log('表格', databaseRecordMap, block, rawMetadata)
+  const collectionId = rawMetadata?.collection_id
+  const collection = pageRecordMap.collection[collectionId].value
+  const collectionQuery = pageRecordMap.collection_query
+  const collectionView = pageRecordMap.collection_view
+  const schema = collection?.schema
+  const viewIds = rawMetadata?.view_ids
+  const pageIds = getAllPageIds(collectionQuery, collectionId, collectionView, viewIds)
+  if (pageIds?.length === 0) {
+    console.error('[Notion配置]获取到的文章列表为空，请检查notion模板', collectionQuery, collection, collectionView, viewIds, databaseRecordMap)
+  }
+  // 遍历用户的表格
+  for (let i = 0; i < pageIds.length; i++) {
+    const id = pageIds[i]
+    const value = block[id]?.value
+    if (!value) {
+      continue
+    }
+    const rawProperties = Object.entries(block?.[id]?.value?.properties || [])
+    const excludeProperties = ['date', 'select', 'multi_select', 'person']
+    const properties = {}
+    for (let i = 0; i < rawProperties.length; i++) {
+      const [key, val] = rawProperties[i]
+      properties.id = id
+      if (schema[key]?.type && !excludeProperties.includes(schema[key].type)) {
+        properties[schema[key].name] = getTextContent(val)
+      } else {
+        switch (schema[key]?.type) {
+          case 'date': {
+            const dateProperty = getDateValue(val)
+            delete dateProperty.type
+            properties[schema[key].name] = dateProperty
+            break
+          }
+          case 'select':
+          case 'multi_select': {
+            const selects = getTextContent(val)
+            if (selects[0]?.length) {
+              properties[schema[key].name] = selects.split(',')
+            }
+            break
+          }
+          default:
+            break
+        }
+      }
+    }
+
+    if (properties) {
+      // 将表格中的字段映射成 英文
+      const config = {
+        enable: properties['启用'] === 'Yes',
+        key: properties['配置名'],
+        value: properties['配置值']
+      }
+
+      // 只导入生效的配置
+      if (config.enable) {
+        // console.log('[Notion配置]', config.key, config.value)
+        notionConfig[config.key] = config.value
+      }
+    }
+  }
+
+  return notionConfig
+}
diff --git a/lib/notion/getNotionData.js b/lib/notion/getNotionData.js
index f885f22b..5b77e716 100755
--- a/lib/notion/getNotionData.js
+++ b/lib/notion/getNotionData.js
@@ -8,6 +8,7 @@ import getAllPageIds from './getAllPageIds'
 import { getAllTags } from './getAllTags'
 import getPageProperties from './getPageProperties'
 import { mapImgUrl, compressImage } from './mapImage'
+import { getConfigMapFromConfigPage } from './getNotionConfig'
 
 /**
  * 获取博客数据
@@ -272,6 +273,7 @@ async function getDataBaseInfoByNotionAPI({ pageId, from }) {
 
   // 文章计数
   let postCount = 0
+
   // 查找所有的Post和Page
   const allPages = collectionData.filter(post => {
     if (post?.type === 'Post' && post.status === 'Published') {
@@ -282,6 +284,9 @@ async function getDataBaseInfoByNotionAPI({ pageId, from }) {
      (post?.status === 'Invisible' || post?.status === 'Published')
   })
 
+  // 站点配置优先读取配置表格，否则读取blog.config.js 文件
+  const NOTION_CONFIG = await getConfigMapFromConfigPage(collectionData) || {}
+
   // Sort by date
   if (BLOG.POSTS_SORT_BY === 'date') {
     allPages.sort((a, b) => {
@@ -300,6 +305,7 @@ async function getDataBaseInfoByNotionAPI({ pageId, from }) {
   const allNavPages = getNavPages({ allPages })
 
   return {
+    NOTION_CONFIG,
     notice,
     siteInfo,
     allPages,
diff --git a/lib/notion/getPageProperties.js b/lib/notion/getPageProperties.js
index ddf47f3e..3ea1ce28 100644
--- a/lib/notion/getPageProperties.js
+++ b/lib/notion/getPageProperties.js
@@ -6,6 +6,15 @@ import formatDate from '../formatDate'
 import md5 from 'js-md5'
 import { mapImgUrl } from './mapImage'
 
+/**
+ * 获取页面元素成员属性
+ * @param {*} id
+ * @param {*} block
+ * @param {*} schema
+ * @param {*} authToken
+ * @param {*} tagOptions
+ * @returns
+ */
 export default async function getPageProperties(id, block, schema, authToken, tagOptions) {
   const rawProperties = Object.entries(block?.[id]?.value?.properties || [])
   const excludeProperties = ['date', 'select', 'multi_select', 'person']
@@ -108,6 +117,7 @@ export default async function getPageProperties(id, block, schema, authToken, ta
       properties.slug += '.html'
     }
   }
+  // 密码字段md5
   properties.password = properties.password ? md5(properties.slug + properties.password) : ''
   return properties
 }
diff --git a/lib/utils.js b/lib/utils.js
index 75278521..30e0e038 100644
--- a/lib/utils.js
+++ b/lib/utils.js
@@ -75,7 +75,6 @@ export function getQueryVariable(key) {
   }
   return (false)
 }
-
 /**
  * 获取 URL 中指定参数的值
  * @param {string} url
@@ -83,8 +82,10 @@ export function getQueryVariable(key) {
  * @returns {string|null}
  */
 export function getQueryParam(url, param) {
-  const searchParams = new URLSearchParams(url.split('?')[1])
-  return searchParams.get(param)
+  // 移除哈希部分
+  const urlWithoutHash = url.split('#')[0];
+  const searchParams = new URLSearchParams(urlWithoutHash.split('?')[1]);
+  return searchParams.get(param);
 }
 
 /**
@@ -202,3 +203,46 @@ export const isMobile = () => {
 
   return isMobile
 }
+
+/**
+ * 扫描页面上的所有文本节点，将url格式的文本转为可点击链接
+ * @param {*} node
+ */
+export const scanAndConvertToLinks = (node) => {
+  if (node.nodeType === Node.TEXT_NODE) {
+    const text = node.textContent;
+    const urlRegex = /https?:\/\/[^\s]+/g;
+    let lastIndex = 0;
+    let match;
+
+    const newNode = document.createElement('span');
+
+    while ((match = urlRegex.exec(text)) !== null) {
+      const beforeText = text.substring(lastIndex, match.index);
+      const url = match[0];
+
+      if (beforeText) {
+        newNode.appendChild(document.createTextNode(beforeText));
+      }
+
+      const link = document.createElement('a');
+      link.href = url;
+      link.target = '_blank'
+      link.textContent = url;
+
+      newNode.appendChild(link);
+
+      lastIndex = urlRegex.lastIndex;
+    }
+
+    if (lastIndex < text.length) {
+      newNode.appendChild(document.createTextNode(text.substring(lastIndex)));
+    }
+
+    node.parentNode.replaceChild(newNode, node);
+  } else if (node.nodeType === Node.ELEMENT_NODE) {
+    for (const childNode of node.childNodes) {
+      scanAndConvertToLinks(childNode);
+    }
+  }
+}
diff --git a/next-sitemap.config.js b/next-sitemap.config.js
index a094e809..29e1ca67 100644
--- a/next-sitemap.config.js
+++ b/next-sitemap.config.js
@@ -1,5 +1,8 @@
 const BLOG = require('./blog.config')
 
+/**
+ * 通常没啥用，sitemap交给 /pages/sitemap.xml.js 动态生成
+ */
 module.exports = {
   siteUrl: BLOG.LINK,
   changefreq: 'daily',
diff --git a/next.config.js b/next.config.js
index 0a8bd36d..aff79920 100644
--- a/next.config.js
+++ b/next.config.js
@@ -91,6 +91,7 @@ module.exports = withBundleAnalyzer({
     //   })
     // }
     // 动态主题：添加 resolve.alias 配置，将动态路径映射到实际路径
+    console.log('加载默认主题', path.resolve(__dirname, 'themes', THEME))
     config.resolve.alias['@theme-components'] = path.resolve(__dirname, 'themes', THEME)
     return config
   },
diff --git a/package.json b/package.json
index 6164cbb4..ca67780c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "notion-next",
-  "version": "4.0.18",
+  "version": "4.1.0",
   "homepage": "https://github.com/tangly1024/NotionNext.git",
   "license": "MIT",
   "repository": {
diff --git a/pages/404.js b/pages/404.js
index c770385f..ae8eea37 100644
--- a/pages/404.js
+++ b/pages/404.js
@@ -1,7 +1,7 @@
 import { getGlobalData } from '@/lib/notion/getNotionData'
-import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 404
@@ -9,13 +9,12 @@ import { getLayoutByTheme } from '@/themes/theme'
  * @returns
  */
 const NoFound = props => {
-  const { siteInfo } = useGlobal()
-  const meta = { title: `${props?.siteInfo?.title} | 页面找不到啦`, image: siteInfo?.pageCover }
+  const meta = { title: `${siteConfig('TITLE')} | 页面找不到啦`, image: siteConfig('HOME_BANNER_IMAGE') }
 
   props = { ...props, meta }
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   return <Layout {...props} />
 }
diff --git a/pages/[prefix]/index.js b/pages/[prefix]/index.js
index 6fa5d47b..dfc90fcc 100644
--- a/pages/[prefix]/index.js
+++ b/pages/[prefix]/index.js
@@ -10,6 +10,7 @@ import { getLayoutByTheme } from '@/themes/theme'
 import md5 from 'js-md5'
 import { isBrowser } from '@/lib/utils'
 import { uploadDataToAlgolia } from '@/lib/algolia'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 根据notion的slug访问页面
@@ -66,7 +67,7 @@ const Slug = props => {
   }, [post])
 
   const meta = {
-    title: post ? `${post?.title} | ${siteInfo?.title}` : `${props?.siteInfo?.title || BLOG.TITLE} | loading`,
+    title: post ? `${post?.title} | ${siteConfig('TITLE')}` : `${siteConfig('TITLE')} | loading`,
     description: post?.summary,
     type: post?.type,
     slug: post?.slug,
@@ -76,7 +77,7 @@ const Slug = props => {
   }
   props = { ...props, lock, meta, setLock, validPassword }
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
   return <Layout {...props} />
 }
 
diff --git a/pages/_app.js b/pages/_app.js
index a16513b9..a19933cb 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -11,12 +11,11 @@ import { GlobalContextProvider } from '@/lib/global'
 
 import AOS from 'aos'
 import 'aos/dist/aos.css' // You can also use <link> for styles
-import dynamic from 'next/dynamic'
 import { isBrowser, loadExternalResource } from '@/lib/utils'
 import BLOG from '@/blog.config'
-
 // 各种扩展插件 动画等
-const ExternalPlugins = dynamic(() => import('@/components/ExternalPlugins'))
+import ExternalPlugins from '@/components/ExternalPlugins'
+// const ExternalPlugins = dynamic(() => import('@/components/ExternalPlugins'))
 
 const MyApp = ({ Component, pageProps }) => {
   // 自定义样式css和js引入
diff --git a/pages/_document.js b/pages/_document.js
index 9c7bd4c8..976a45fb 100644
--- a/pages/_document.js
+++ b/pages/_document.js
@@ -1,7 +1,6 @@
 // eslint-disable-next-line @next/next/no-document-import-in-page
 import Document, { Html, Head, Main, NextScript } from 'next/document'
 import BLOG from '@/blog.config'
-import CommonScript from '@/components/CommonScript'
 
 class MyDocument extends Document {
   static async getInitialProps(ctx) {
@@ -14,7 +13,6 @@ class MyDocument extends Document {
             <Html lang={BLOG.LANG}>
                 <Head>
                 <link rel='icon' href= {`${BLOG.BLOG_FAVICON}`} />
-                  <CommonScript />
                   {/* 预加载字体 */}
                   {BLOG.FONT_AWESOME && <>
                       <link rel='preload' href={BLOG.FONT_AWESOME} as="style" crossOrigin="anonymous" />
diff --git a/pages/api/cache.js b/pages/api/cache.js
new file mode 100644
index 00000000..97738651
--- /dev/null
+++ b/pages/api/cache.js
@@ -0,0 +1,15 @@
+import { cleanCache } from '@/lib/cache/local_file_cache'
+
+/**
+ * 清理缓存
+ * @param {*} req
+ * @param {*} res
+ */
+export default async function handler(req, res) {
+  try {
+    await cleanCache()
+    res.status(200).json({ status: 'success', message: 'Clean cache successful!' })
+  } catch (error) {
+    res.status(400).json({ status: 'error', message: 'Clean cache failed!', error })
+  }
+}
diff --git a/pages/archive/index.js b/pages/archive/index.js
index 106ad7d2..a0a57f28 100644
--- a/pages/archive/index.js
+++ b/pages/archive/index.js
@@ -6,13 +6,14 @@ import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
 import { isBrowser } from '@/lib/utils'
 import { formatDateFmt } from '@/lib/formatDate'
+import { siteConfig } from '@/lib/config'
 
 const ArchiveIndex = props => {
   const { siteInfo } = props
   const { locale } = useGlobal()
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   useEffect(() => {
     if (isBrowser) {
@@ -29,8 +30,8 @@ const ArchiveIndex = props => {
   }, [])
 
   const meta = {
-    title: `${locale.NAV.ARCHIVE} | ${siteInfo?.title}`,
-    description: siteInfo?.description,
+    title: `${locale.NAV.ARCHIVE} | ${siteConfig('TITLE')}`,
+    description: siteConfig('DESCRIPTION'),
     image: siteInfo?.pageCover,
     slug: 'archive',
     type: 'website'
diff --git a/pages/category/[category]/index.js b/pages/category/[category]/index.js
index 03cd4fbd..a623cc6b 100644
--- a/pages/category/[category]/index.js
+++ b/pages/category/[category]/index.js
@@ -4,6 +4,7 @@ import { useGlobal } from '@/lib/global'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 分类页
@@ -15,13 +16,13 @@ export default function Category(props) {
   const { locale } = useGlobal()
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
     title: `${props.category} | ${locale.COMMON.CATEGORY} | ${
-      siteInfo?.title || ''
+      siteConfig('TITLE') || ''
     }`,
-    description: siteInfo?.description,
+    description: siteConfig('DESCRIPTION'),
     slug: 'category/' + props.category,
     image: siteInfo?.pageCover,
     type: 'website'
diff --git a/pages/category/[category]/page/[page].js b/pages/category/[category]/page/[page].js
index 9174e117..ae5124b1 100644
--- a/pages/category/[category]/page/[page].js
+++ b/pages/category/[category]/page/[page].js
@@ -4,6 +4,7 @@ import { useGlobal } from '@/lib/global'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 分类页
@@ -15,13 +16,13 @@ export default function Category(props) {
   const { siteInfo } = props
   const { locale } = useGlobal()
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
     title: `${props.category} | ${locale.COMMON.CATEGORY} | ${
-      siteInfo?.title || ''
+      siteConfig('TITLE') || ''
     }`,
-    description: siteInfo?.description,
+    description: siteConfig('DESCRIPTION'),
     slug: 'category/' + props.category,
     image: siteInfo?.pageCover,
     type: 'website'
diff --git a/pages/category/index.js b/pages/category/index.js
index b4872000..85121910 100644
--- a/pages/category/index.js
+++ b/pages/category/index.js
@@ -4,6 +4,7 @@ import { useGlobal } from '@/lib/global'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 分类首页
@@ -15,11 +16,11 @@ export default function Category(props) {
   const { siteInfo } = props
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
-    title: `${locale.COMMON.CATEGORY} | ${siteInfo?.title}`,
-    description: siteInfo?.description,
+    title: `${locale.COMMON.CATEGORY} | ${siteConfig('TITLE')}`,
+    description: siteConfig('DESCRIPTION'),
     image: siteInfo?.pageCover,
     slug: 'category',
     type: 'website'
diff --git a/pages/index.js b/pages/index.js
index 328ece1e..18f7ec47 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -3,8 +3,9 @@ import { getPostBlocks } from '@/lib/notion'
 import { getGlobalData } from '@/lib/notion/getNotionData'
 import { generateRss } from '@/lib/rss'
 import { generateRobotsTxt } from '@/lib/robots.txt'
-import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
+import { useRouter } from 'next/router'
 
 /**
  * 首页布局
@@ -13,8 +14,16 @@ import { getLayoutByTheme } from '@/themes/theme'
  */
 const Index = props => {
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
-  return <Layout {...props} />
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
+
+  const meta = {
+    title: `${siteConfig('TITLE')} | ${siteConfig('DESCRIPTION')}`,
+    description: siteConfig('DESCRIPTION'),
+    image: siteConfig('HOME_BANNER_IMAGE'),
+    slug: '',
+    type: 'website'
+  }
+  return <Layout meta={meta} {...props} />
 }
 
 /**
@@ -25,16 +34,8 @@ export async function getStaticProps() {
   const from = 'index'
   const props = await getGlobalData({ from })
 
-  const { siteInfo } = props
   props.posts = props.allPages?.filter(page => page.type === 'Post' && page.status === 'Published')
 
-  const meta = {
-    title: `${siteInfo?.title} | ${siteInfo?.description}`,
-    description: siteInfo?.description,
-    image: siteInfo?.pageCover,
-    slug: '',
-    type: 'website'
-  }
   // 处理分页
   if (BLOG.POST_LIST_STYLE === 'scroll') {
     // 滚动列表默认给前端返回所有数据
@@ -65,10 +66,7 @@ export async function getStaticProps() {
   delete props.allPages
 
   return {
-    props: {
-      meta,
-      ...props
-    },
+    props,
     revalidate: parseInt(BLOG.NEXT_REVALIDATE_SECOND)
   }
 }
diff --git a/pages/page/[page].js b/pages/page/[page].js
index 02b847a8..c34aef1d 100644
--- a/pages/page/[page].js
+++ b/pages/page/[page].js
@@ -3,6 +3,7 @@ import { getPostBlocks } from '@/lib/notion'
 import { getGlobalData } from '@/lib/notion/getNotionData'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 文章列表分页
@@ -13,11 +14,11 @@ const Page = props => {
   const { siteInfo } = props
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
-    title: `${props?.page} | Page | ${siteInfo?.title}`,
-    description: siteInfo?.description,
+    title: `${props?.page} | Page | ${siteConfig('TITLE')}`,
+    description: siteConfig('DESCRIPTION'),
     image: siteInfo?.pageCover,
     slug: 'page/' + props.page,
     type: 'website'
diff --git a/pages/search/[keyword]/index.js b/pages/search/[keyword]/index.js
index 042bbf85..cd6166ed 100644
--- a/pages/search/[keyword]/index.js
+++ b/pages/search/[keyword]/index.js
@@ -4,17 +4,18 @@ import { getDataFromCache } from '@/lib/cache/cache_manager'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 const Index = props => {
   const { keyword, siteInfo } = props
   const { locale } = useGlobal()
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
-    title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${siteInfo?.title}`,
-    description: siteInfo?.title,
+    title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${siteConfig('TITLE')}`,
+    description: siteConfig('TITLE'),
     image: siteInfo?.pageCover,
     slug: 'search/' + (keyword || ''),
     type: 'website'
diff --git a/pages/search/[keyword]/page/[page].js b/pages/search/[keyword]/page/[page].js
index 20240f19..9de43cc1 100644
--- a/pages/search/[keyword]/page/[page].js
+++ b/pages/search/[keyword]/page/[page].js
@@ -4,17 +4,18 @@ import { getDataFromCache } from '@/lib/cache/cache_manager'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 const Index = props => {
   const { keyword, siteInfo } = props
   const { locale } = useGlobal()
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
-    title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${siteInfo?.title}`,
-    description: siteInfo?.title,
+    title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${siteConfig('TITLE')}`,
+    description: siteConfig('TITLE'),
     image: siteInfo?.pageCover,
     slug: 'search/' + (keyword || ''),
     type: 'website'
diff --git a/pages/search/index.js b/pages/search/index.js
index 22061cbd..fa45d2d5 100644
--- a/pages/search/index.js
+++ b/pages/search/index.js
@@ -3,6 +3,7 @@ import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import BLOG from '@/blog.config'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 搜索路由
@@ -14,7 +15,7 @@ const Search = props => {
   const { locale } = useGlobal()
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const router = useRouter()
   const keyword = getSearchKey(router)
@@ -34,8 +35,8 @@ const Search = props => {
   }
 
   const meta = {
-    title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${siteInfo?.title}`,
-    description: siteInfo?.description,
+    title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${siteConfig('TITLE')}`,
+    description: siteConfig('DESCRIPTION'),
     image: siteInfo?.pageCover,
     slug: 'search',
     type: 'website'
diff --git a/pages/tag/[tag]/index.js b/pages/tag/[tag]/index.js
index bd9f7529..1d6c94d2 100644
--- a/pages/tag/[tag]/index.js
+++ b/pages/tag/[tag]/index.js
@@ -3,6 +3,7 @@ import { getGlobalData } from '@/lib/notion/getNotionData'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 标签下的文章列表
@@ -14,11 +15,11 @@ const Tag = props => {
   const { tag, siteInfo } = props
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
-    title: `${tag} | ${locale.COMMON.TAGS} | ${siteInfo?.title}`,
-    description: siteInfo?.description,
+    title: `${tag} | ${locale.COMMON.TAGS} | ${siteConfig('TITLE')}`,
+    description: siteConfig('DESCRIPTION'),
     image: siteInfo?.pageCover,
     slug: 'tag/' + tag,
     type: 'website'
diff --git a/pages/tag/[tag]/page/[page].js b/pages/tag/[tag]/page/[page].js
index 2eaef518..ab28fdbc 100644
--- a/pages/tag/[tag]/page/[page].js
+++ b/pages/tag/[tag]/page/[page].js
@@ -3,17 +3,18 @@ import { getGlobalData } from '@/lib/notion/getNotionData'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 const Tag = props => {
   const { locale } = useGlobal()
   const { tag, siteInfo } = props
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
-    title: `${tag} | ${locale.COMMON.TAGS} | ${siteInfo?.title}`,
-    description: siteInfo?.description,
+    title: `${tag} | ${locale.COMMON.TAGS} | ${siteConfig('TITLE')}`,
+    description: siteConfig('DESCRIPTION'),
     image: siteInfo?.pageCover,
     slug: 'tag/' + tag,
     type: 'website'
diff --git a/pages/tag/index.js b/pages/tag/index.js
index 54dab9a4..bb618414 100644
--- a/pages/tag/index.js
+++ b/pages/tag/index.js
@@ -3,6 +3,7 @@ import { useGlobal } from '@/lib/global'
 import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { getLayoutByTheme } from '@/themes/theme'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 标签首页
@@ -14,11 +15,11 @@ const TagIndex = props => {
   const { siteInfo } = props
 
   // 根据页面路径加载不同Layout文件
-  const Layout = getLayoutByTheme(useRouter())
+  const Layout = getLayoutByTheme({ theme: siteConfig('THEME'), router: useRouter() })
 
   const meta = {
-    title: `${locale.COMMON.TAGS} | ${siteInfo?.title}`,
-    description: siteInfo?.description,
+    title: `${locale.COMMON.TAGS} | ${siteConfig('TITLE')}`,
+    description: siteConfig('DESCRIPTION'),
     image: siteInfo?.pageCover,
     slug: 'tag',
     type: 'website'
diff --git a/styles/notion.css b/styles/notion.css
index c7d939be..50ce45f3 100644
--- a/styles/notion.css
+++ b/styles/notion.css
@@ -724,7 +724,6 @@ svg.notion-page-icon {
 .notion-text {
   width: 100%;
   white-space: pre-wrap;
-  line-height: 1.5rem !important;
   word-break: break-word;
   padding: 3px 2px !important;
   margin: 1px 0 !important;
diff --git a/themes/example/components/BlogListGroupByDate.js b/themes/example/components/BlogListGroupByDate.js
index ac5f9cbd..29598f0b 100644
--- a/themes/example/components/BlogListGroupByDate.js
+++ b/themes/example/components/BlogListGroupByDate.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 
 /**
@@ -24,7 +24,7 @@ export default function BlogListGroupByDate({ archiveTitle, archivePosts }) {
                         {post?.publishDay}
                     </span>{' '}
                     &nbsp;
-                    <Link href={`${BLOG.SUB_PATH}/${post.slug}`} className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
+                    <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
                         {post.title}
                     </Link>
                 </div>
diff --git a/themes/example/components/BlogListPage.js b/themes/example/components/BlogListPage.js
index 429ee30e..5ae2cf5c 100644
--- a/themes/example/components/BlogListPage.js
+++ b/themes/example/components/BlogListPage.js
@@ -1,5 +1,5 @@
 
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import Link from 'next/link'
@@ -10,14 +10,14 @@ export const BlogListPage = props => {
   const { page = 1, posts, postCount } = props
   const { locale } = useGlobal()
   const router = useRouter()
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
   const currentPage = +page
 
   const showPrev = currentPage > 1
   const showNext = page < totalPage
   const pagePrefix = router.asPath.split('?')[0].replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
 
-  const showPageCover = CONFIG.POST_LIST_COVER
+  const showPageCover = siteConfig('EXAMPLE_POST_LIST_COVER', null, CONFIG)
 
   return (
         <div className={`w-full ${showPageCover ? 'md:pr-2' : 'md:pr-12'} mb-12`}>
diff --git a/themes/example/components/BlogListScroll.js b/themes/example/components/BlogListScroll.js
index ad6df10e..e876f312 100644
--- a/themes/example/components/BlogListScroll.js
+++ b/themes/example/components/BlogListScroll.js
@@ -1,6 +1,6 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
-import React, { useEffect } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import throttle from 'lodash.throttle'
 import BlogPostCard from './BlogPostCard'
 import CONFIG from '../config'
@@ -9,33 +9,33 @@ export const BlogListScroll = props => {
   const { posts } = props
   const { locale } = useGlobal()
 
-  const [page, updatePage] = React.useState(1)
+  const [page, updatePage] = useState(1)
 
   let hasMore = false
   const postsToShow = posts
-    ? Object.assign(posts).slice(0, BLOG.POSTS_PER_PAGE * page)
+    ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
     : []
 
   if (posts) {
     const totalCount = posts.length
-    hasMore = page * BLOG.POSTS_PER_PAGE < totalCount
+    hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
   }
   const handleGetMore = () => {
     if (!hasMore) return
     updatePage(page + 1)
   }
 
-  const targetRef = React.useRef(null)
+  const targetRef = useRef(null)
 
   // 监听滚动自动分页加载
-  const scrollTrigger = React.useCallback(throttle(() => {
+  const scrollTrigger = useCallback(throttle(() => {
     const scrollS = window.scrollY + window.outerHeight
     const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
     if (scrollS > clientHeight + 100) {
       handleGetMore()
     }
   }, 500))
-  const showPageCover = CONFIG.POST_LIST_COVER
+  const showPageCover = siteConfig('EXAMPLE_POST_LIST_COVER', null, CONFIG)
 
   useEffect(() => {
     window.addEventListener('scroll', scrollTrigger)
diff --git a/themes/example/components/BlogPostCard.js b/themes/example/components/BlogPostCard.js
index faf1753d..5b690743 100644
--- a/themes/example/components/BlogPostCard.js
+++ b/themes/example/components/BlogPostCard.js
@@ -1,11 +1,11 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import CONFIG from '../config'
 import Link from 'next/link'
 import TwikooCommentCount from '@/components/TwikooCommentCount'
 import LazyImage from '@/components/LazyImage'
 
 const BlogPostCard = ({ post }) => {
-  const showPageCover = CONFIG.POST_LIST_COVER && post?.pageCoverThumbnail
+  const showPageCover = siteConfig('EXAMPLE_POST_LIST_COVER', null, CONFIG) && post?.pageCoverThumbnail
 
   return <article className={`${showPageCover ? 'flex md:flex-row flex-col-reverse' : ''} replace mb-12 `}>
         <div className={`${showPageCover ? 'md:w-7/12' : ''}`}>
@@ -18,7 +18,7 @@ const BlogPostCard = ({ post }) => {
             </h2>
 
             <div className="mb-4 text-sm text-gray-700 dark:text-gray-300">
-                by <a href="#" className="text-gray-700 dark:text-gray-300">{BLOG.AUTHOR}</a> on {post.date?.start_date || post.createdTime}
+                by <a href="#" className="text-gray-700 dark:text-gray-300">{siteConfig('AUTHOR')}</a> on {post.date?.start_date || post.createdTime}
                 <TwikooCommentCount post={post} className='pl-1'/>
                 <span className="font-bold mx-1"> | </span>
                 <a href={`/category${post.category}`} className="text-gray-700 dark:text-gray-300 hover:underline">{post.category}</a>
@@ -40,9 +40,9 @@ const BlogPostCard = ({ post }) => {
         </div>
         {/* 图片封面 */}
         {showPageCover && (
-            <div className="md:w-5/12 w-full overflow-hidden p-1">
-                <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
-                    <LazyImage src={post?.pageCoverThumbnail} className='h-44 bg-center bg-cover hover:scale-110 duration-200' />
+            <div className="md:w-5/12 w-full h-44 overflow-hidden p-1">
+                <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
+                    <LazyImage src={post?.pageCoverThumbnail} className='w-full bg-cover hover:scale-110 duration-200' />
                 </Link>
             </div>
         )}
diff --git a/themes/example/components/ExampleRecentComments.js b/themes/example/components/ExampleRecentComments.js
index b1555c1d..e5097740 100644
--- a/themes/example/components/ExampleRecentComments.js
+++ b/themes/example/components/ExampleRecentComments.js
@@ -1,5 +1,5 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { useEffect, useState } from 'react'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import { RecentComments } from '@waline/client'
 
@@ -9,11 +9,11 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const ExampleRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [comments, updateComments] = useState([])
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/example/components/Footer.js b/themes/example/components/Footer.js
index 09af18fe..77c8bad6 100644
--- a/themes/example/components/Footer.js
+++ b/themes/example/components/Footer.js
@@ -1,28 +1,24 @@
-import BLOG from '@/blog.config'
 import DarkModeButton from '@/components/DarkModeButton'
+import { siteConfig } from '@/lib/config'
 
 export const Footer = (props) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return <footer className="z-10 relative w-full bg-white px-6 border-t dark:border-hexo-black-gray dark:bg-hexo-black-gray ">
         <DarkModeButton className='text-center pt-4'/>
 
         <div className="container mx-auto max-w-4xl py-6 md:flex flex-wrap md:flex-no-wrap md:justify-between items-center text-sm">
-            <div className='text-center'> &copy;{`${copyrightDate}`} {BLOG.AUTHOR}. All rights reserved.</div>
+            <div className='text-center'> &copy;{`${copyrightDate}`} {siteConfig('AUTHOR')}. All rights reserved.</div>
             <div className="md:p-0 text-center md:text-right text-xs">
                 {/* 右侧链接 */}
                 {/* <a href="#" className="text-black no-underline hover:underline">Privacy Policy</a> */}
-                {BLOG.BEI_AN && (<a href="https://beian.miit.gov.cn/" className="text-black dark:text-gray-200 no-underline hover:underline ml-4">{BLOG.BEI_AN} </a>)}
+                {siteConfig('BEI_AN') && (<a href="https://beian.miit.gov.cn/" className="text-black dark:text-gray-200 no-underline hover:underline ml-4">{siteConfig('BEI_AN')} </a>)}
                 <span className='dark:text-gray-200 no-underline ml-4'>
                     Powered by
-                    <a href="https://github.com/tangly1024/NotionNext" className=' hover:underline'> NotionNext {BLOG.VERSION}  </a>
+                    <a href="https://github.com/tangly1024/NotionNext" className=' hover:underline'> NotionNext {siteConfig('VERSION')}  </a>
                 </span>
             </div>
         </div>
diff --git a/themes/example/components/Header.js b/themes/example/components/Header.js
index 0cd85268..2ec1e27b 100644
--- a/themes/example/components/Header.js
+++ b/themes/example/components/Header.js
@@ -1,12 +1,11 @@
 import Link from 'next/link'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 网站顶部
  * @returns
  */
 export const Header = (props) => {
-  const { siteInfo } = props
-
   return (
       <header className="w-full px-6 bg-white  dark:bg-black relative z-10">
             <div className="container mx-auto max-w-4xl md:flex justify-between items-center">
@@ -14,7 +13,7 @@ export const Header = (props) => {
                     href='/'
                     className="py-6 w-full text-center md:text-left md:w-auto text-gray-dark no-underline flex justify-center items-center">
 
-                    {siteInfo?.title}
+                    {siteConfig('TITLE')}
                 </Link>
                 <div className="w-full md:w-auto text-center md:text-right">
                     {/* 右侧文字 */}
diff --git a/themes/example/components/JumpToTopButton.js b/themes/example/components/JumpToTopButton.js
index 30e684a8..f5e22b61 100644
--- a/themes/example/components/JumpToTopButton.js
+++ b/themes/example/components/JumpToTopButton.js
@@ -1,5 +1,4 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 
 /**
  * 跳转到网页顶部
diff --git a/themes/example/components/Nav.js b/themes/example/components/Nav.js
index c00dc8aa..beb2c32e 100644
--- a/themes/example/components/Nav.js
+++ b/themes/example/components/Nav.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
 import { MenuItemDrop } from './MenuItemDrop'
@@ -13,10 +13,10 @@ export const Nav = (props) => {
   const { locale } = useGlobal()
 
   let links = [
-    { id: 1, icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { id: 2, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { id: 3, icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { id: 4, icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { id: 1, icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('EXAMPLE_MENU_SEARCH', null, CONFIG) },
+    { id: 2, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('EXAMPLE_MENU_ARCHIVE', null, CONFIG) },
+    { id: 3, icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('EXAMPLE_MENU_CATEGORY', null, CONFIG) },
+    { id: 4, icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('EXAMPLE_MENU_TAG', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -24,7 +24,7 @@ export const Nav = (props) => {
   }
 
   // 如果 开启自定义菜单，则不再使用 Page生成菜单。
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/example/components/SideBar.js b/themes/example/components/SideBar.js
index 39ffead7..ea0531b7 100644
--- a/themes/example/components/SideBar.js
+++ b/themes/example/components/SideBar.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Live2D from '@/components/Live2D'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
@@ -51,7 +51,7 @@ export const SideBar = (props) => {
 
             <Announcement post={notice}/>
 
-            {BLOG.COMMENT_WALINE_SERVER_URL && BLOG.COMMENT_WALINE_RECENT && <aside className="rounded shadow overflow-hidden mb-6">
+            {siteConfig('COMMENT_WALINE_SERVER_URL') && siteConfig('COMMENT_WALINE_RECENT') && <aside className="rounded shadow overflow-hidden mb-6">
                 <h3 className="text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b">{locale.COMMON.RECENT_COMMENTS}</h3>
 
                 <div className="p-4">
diff --git a/themes/example/components/Title.js b/themes/example/components/Title.js
index e57e2347..5c251b0d 100644
--- a/themes/example/components/Title.js
+++ b/themes/example/components/Title.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 标题栏
@@ -6,9 +6,9 @@ import BLOG from '@/blog.config'
  * @returns
  */
 export const Title = (props) => {
-  const { siteInfo, post } = props
-  const title = post?.title || siteInfo?.description
-  const description = post?.description || BLOG.AUTHOR
+  const { post } = props
+  const title = post?.title || siteConfig('TITLE')
+  const description = post?.description || siteConfig('AUTHOR')
 
   return <div className="text-center px-6 py-12 mb-6 bg-gray-100 dark:bg-hexo-black-gray dark:border-hexo-black-gray border-b">
         <h1 className=" text-xl md:text-4xl pb-4">{title}</h1>
diff --git a/themes/example/config.js b/themes/example/config.js
index 27b8a34d..181d3a93 100644
--- a/themes/example/config.js
+++ b/themes/example/config.js
@@ -3,12 +3,12 @@
  */
 const CONFIG = {
   // 菜单配置
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  EXAMPLE_MENU_CATEGORY: true, // 显示分类
+  EXAMPLE_MENU_TAG: true, // 显示标签
+  EXAMPLE_MENU_ARCHIVE: true, // 显示归档
+  EXAMPLE_MENU_SEARCH: true, // 显示搜索
 
-  POST_LIST_COVER: true // 列表显示文章封面
+  EXAMPLE_POST_LIST_COVER: true // 列表显示文章封面
 
 }
 export default CONFIG
diff --git a/themes/example/index.js b/themes/example/index.js
index 0e106434..38a9cb1c 100644
--- a/themes/example/index.js
+++ b/themes/example/index.js
@@ -1,6 +1,5 @@
 'use client'
 
-import BLOG from '@/blog.config'
 import CONFIG from './config'
 import { useEffect } from 'react'
 import { Header } from './components/Header'
@@ -27,6 +26,7 @@ import { useRouter } from 'next/router'
 import { Transition } from '@headlessui/react'
 import { Style } from './style'
 import CommonHead from '@/components/CommonHead'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 基础布局框架
@@ -67,7 +67,7 @@ const LayoutBase = props => {
                 {/* 标题栏 */}
                 <Title {...props} />
 
-                <div id='container-wrapper' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + 'relative container mx-auto justify-center md:flex items-start py-8 px-2'}>
+                <div id='container-wrapper' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + 'relative container mx-auto justify-center md:flex items-start py-8 px-2'}>
 
                     {/* 内容 */}
                     <div className='w-full max-w-3xl xl:px-14 lg:px-4 '>
@@ -134,7 +134,7 @@ const LayoutPostList = props => {
   }
   return (
         <LayoutBase {...props} slotTop={slotTop}>
-            {BLOG.POST_LIST_STYLE === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
+            {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
         </LayoutBase>
   )
 }
diff --git a/themes/fukasawa/components/ArticleDetail.js b/themes/fukasawa/components/ArticleDetail.js
index 9e47a925..31294304 100644
--- a/themes/fukasawa/components/ArticleDetail.js
+++ b/themes/fukasawa/components/ArticleDetail.js
@@ -8,6 +8,7 @@ import ArticleAround from './ArticleAround'
 import { AdSlot } from '@/components/GoogleAdsense'
 import LazyImage from '@/components/LazyImage'
 import { formatDateFmt } from '@/lib/formatDate'
+import WWAds from '@/components/WWAds'
 
 /**
  *
@@ -81,8 +82,7 @@ export default function ArticleDetail(props) {
 
           </section>
 
-          <AdSlot type='in-article'/>
-
+          <WWAds className='w-full' orientation='horizontal'/>
         </header>
 
         {/* Notion文章主体 */}
@@ -91,6 +91,7 @@ export default function ArticleDetail(props) {
         </section>
 
         <section>
+          <AdSlot type='in-article'/>
            {/* 分享 */}
            <ShareBar post={post} />
         </section>
diff --git a/themes/fukasawa/components/AsideLeft.js b/themes/fukasawa/components/AsideLeft.js
index bf6edb45..991b9ce4 100644
--- a/themes/fukasawa/components/AsideLeft.js
+++ b/themes/fukasawa/components/AsideLeft.js
@@ -12,9 +12,7 @@ import SocialButton from './SocialButton'
 import { useFukasawaGlobal } from '..'
 import CONFIG from '@/themes/fukasawa/config'
 import { AdSlot } from '@/components/GoogleAdsense'
-
-// import { debounce } from 'lodash'
-// import { useEffect } from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 侧边栏
@@ -22,7 +20,7 @@ import { AdSlot } from '@/components/GoogleAdsense'
  * @returns
  */
 function AsideLeft(props) {
-  const { tagOptions, currentTag, categoryOptions, currentCategory, post, slot, siteInfo, notice } = props
+  const { tagOptions, currentTag, categoryOptions, currentCategory, post, slot, notice } = props
   const router = useRouter()
   const { isCollapsed, setIsCollapse } = useFukasawaGlobal()
   // 折叠侧边栏
@@ -56,7 +54,7 @@ function AsideLeft(props) {
 
   return <div className={`sideLeft relative ${isCollapsed ? 'w-0' : 'w-80'} duration-150 transition-all bg-white dark:bg-hexo-black-gray min-h-screen hidden lg:block z-20`}>
         {/* 折叠按钮 */}
-        {CONFIG.SIDEBAR_COLLAPSE_BUTTON && <div className={`${isCollapsed ? '' : 'ml-80'} hidden lg:block sticky top-0 mx-2 cursor-pointer hover:scale-110 duration-150 px-3 py-2`} onClick={toggleOpen}>
+        {siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_BUTTON', null, CONFIG) && <div className={`${isCollapsed ? '' : 'ml-80'} hidden lg:block sticky top-0 mx-2 cursor-pointer hover:scale-110 duration-150 px-3 py-2`} onClick={toggleOpen}>
             {isCollapsed ? <i className="fa-solid fa-indent text-xl"></i> : <i className='fas fa-bars text-xl'></i>}
         </div>}
 
@@ -65,7 +63,7 @@ function AsideLeft(props) {
             <Logo {...props} />
 
             <section className='siteInfo flex flex-col dark:text-gray-300 pt-8'>
-                {siteInfo?.description}
+                {siteConfig('DESCRIPTION')}
             </section>
 
             <section className='flex flex-col text-gray-600'>
diff --git a/themes/fukasawa/components/BlogCard.js b/themes/fukasawa/components/BlogCard.js
index ec9070f4..ba73eaed 100644
--- a/themes/fukasawa/components/BlogCard.js
+++ b/themes/fukasawa/components/BlogCard.js
@@ -1,17 +1,16 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import TagItemMini from './TagItemMini'
-import React from 'react'
-import CONFIG_FUKA from '../config'
+import CONFIG from '../config'
 import LazyImage from '@/components/LazyImage'
 
 const BlogCard = ({ index, post, showSummary, siteInfo }) => {
-  const showPreview = CONFIG_FUKA.POST_LIST_PREVIEW && post.blockMap
+  const showPreview = siteConfig('FUKASAWA_POST_LIST_PREVIEW', null, CONFIG) && post.blockMap
   // fukasawa 强制显示图片
-  if (CONFIG_FUKA.POST_LIST_COVER_FORCE && post && !post.pageCover) {
+  if (siteConfig('FUKASAWA_POST_LIST_COVER_FORCE', null, CONFIG) && post && !post.pageCover) {
     post.pageCoverThumbnail = siteInfo?.pageCover
   }
-  const showPageCover = CONFIG_FUKA.POST_LIST_COVER && post?.pageCoverThumbnail
+  const showPageCover = siteConfig('FUKASAWA_POST_LIST_COVER', null, CONFIG) && post?.pageCoverThumbnail
 
   return (
         <div
@@ -26,10 +25,10 @@ const BlogCard = ({ index, post, showSummary, siteInfo }) => {
                 {/* 封面图 */}
                 {showPageCover && (
                     <div className="flex-grow mb-3 w-full duration-200 cursor-pointer transform overflow-hidden">
-                        <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
+                        <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
                             <LazyImage
                                 src={post?.pageCoverThumbnail}
-                                alt={post?.title || BLOG.TITLE}
+                                alt={post?.title || siteConfig('TITLE')}
                                 className="object-cover w-full h-full hover:scale-125 transform duration-500"
                             />
                         </Link>
@@ -38,7 +37,7 @@ const BlogCard = ({ index, post, showSummary, siteInfo }) => {
 
                 {/* 文字部分 */}
                 <div className="flex flex-col w-full">
-                    <Link passHref href={`${BLOG.SUB_PATH}/${post.slug}`}
+                    <Link passHref href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                          className={`break-words cursor-pointer font-bold hover:underline text-xl ${showPreview ? 'justify-center' : 'justify-start'} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}
                     >
                         {post.title}
diff --git a/themes/fukasawa/components/BlogListPage.js b/themes/fukasawa/components/BlogListPage.js
index 30f0c38b..68d4a6c5 100644
--- a/themes/fukasawa/components/BlogListPage.js
+++ b/themes/fukasawa/components/BlogListPage.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { deepClone, isBrowser } from '@/lib/utils'
 import BlogCard from './BlogCard'
 import BlogPostListEmpty from './BlogListEmpty'
@@ -15,7 +15,7 @@ import { AdSlot } from '@/components/GoogleAdsense'
  * @constructor
  */
 const BlogListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
   const showNext = page < totalPage
 
   const [columns, setColumns] = useState(calculateColumns())
@@ -59,7 +59,7 @@ const BlogListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
               <BlogCard index={posts.indexOf(post)} key={post.id} post={post} siteInfo={siteInfo} />
             </div>
           ))}
-          {BLOG.ADSENSE_GOOGLE_ID && (
+          {siteConfig('ADSENSE_GOOGLE_ID') && (
             <div className='p-3'>
                 <AdSlot type='flow'/>
             </div>
diff --git a/themes/fukasawa/components/BlogListScroll.js b/themes/fukasawa/components/BlogListScroll.js
index b1752000..b3fdef35 100644
--- a/themes/fukasawa/components/BlogListScroll.js
+++ b/themes/fukasawa/components/BlogListScroll.js
@@ -1,5 +1,5 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
+import { useEffect, useRef, useState } from 'react'
 import BlogCard from './BlogCard'
 import BlogPostListEmpty from './BlogListEmpty'
 import { useGlobal } from '@/lib/global'
@@ -15,18 +15,18 @@ import { useGlobal } from '@/lib/global'
 const BlogListScroll = props => {
   const { posts = [], siteInfo } = props
   const { locale } = useGlobal()
-  const targetRef = React.useRef(null)
+  const targetRef = useRef(null)
 
-  const [page, updatePage] = React.useState(1)
+  const [page, updatePage] = useState(1)
 
   let hasMore = false
   const postsToShow = posts
-    ? Object.assign(posts).slice(0, BLOG.POSTS_PER_PAGE * page)
+    ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
     : []
 
   if (posts) {
     const totalCount = posts.length
-    hasMore = page * BLOG.POSTS_PER_PAGE < totalCount
+    hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
   }
   const handleGetMore = () => {
     if (!hasMore) return
@@ -44,7 +44,7 @@ const BlogListScroll = props => {
     })
   }
 
-  React.useEffect(() => {
+  useEffect(() => {
     window.addEventListener('scroll', scrollTrigger)
     return () => {
       window.removeEventListener('scroll', scrollTrigger)
diff --git a/themes/fukasawa/components/BlogPostArchive.js b/themes/fukasawa/components/BlogPostArchive.js
index 08557ae3..c1a77718 100644
--- a/themes/fukasawa/components/BlogPostArchive.js
+++ b/themes/fukasawa/components/BlogPostArchive.js
@@ -1,6 +1,6 @@
-import React from 'react'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
+
 /**
  * 博客归档
  * @param posts 所有文章
@@ -30,7 +30,7 @@ const BlogArchiveItem = ({ posts = [], archiveTitle }) => {
                 <span className="text-gray-400">{post.date?.start_date}</span>{' '}
                 &nbsp;
                 <Link
-                  href={`${BLOG.SUB_PATH}/${post.slug}`}
+                  href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                   passHref
                   className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
 
diff --git a/themes/fukasawa/components/Catalog.js b/themes/fukasawa/components/Catalog.js
index 4a5414d2..9f0a054c 100644
--- a/themes/fukasawa/components/Catalog.js
+++ b/themes/fukasawa/components/Catalog.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import throttle from 'lodash.throttle'
 import { uuidToId } from 'notion-utils'
 import { useGlobal } from '@/lib/global'
diff --git a/themes/fukasawa/components/GroupCategory.js b/themes/fukasawa/components/GroupCategory.js
index f9cd00cc..1753afd2 100644
--- a/themes/fukasawa/components/GroupCategory.js
+++ b/themes/fukasawa/components/GroupCategory.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 function GroupCategory ({ currentCategory, categories }) {
   if (!categories) {
diff --git a/themes/fukasawa/components/Logo.js b/themes/fukasawa/components/Logo.js
index 3b6720fb..1b28e1ec 100644
--- a/themes/fukasawa/components/Logo.js
+++ b/themes/fukasawa/components/Logo.js
@@ -1,13 +1,13 @@
 import Link from 'next/link'
+import { siteConfig } from '@/lib/config'
 
 const Logo = props => {
-  const { siteInfo } = props
   return (
    <section className='flex'>
     <Link
      href='/'
      className='hover:bg-black hover:text-white border-black border-2 duration-500 px-4 py-2 cursor-pointer dark:text-gray-300 dark:border-gray-300 font-black'>
-     {siteInfo?.title}
+     {siteConfig('TITLE')}
     </Link>
    </section>
   );
diff --git a/themes/fukasawa/components/MenuItemCollapse.js b/themes/fukasawa/components/MenuItemCollapse.js
index a70e43bb..f854c16f 100644
--- a/themes/fukasawa/components/MenuItemCollapse.js
+++ b/themes/fukasawa/components/MenuItemCollapse.js
@@ -48,8 +48,8 @@ export const MenuItemCollapse = (props) => {
 
         {/* 折叠子菜单 */}
         {hasSubMenu && <Collapse isOpen={isOpen} onHeightChange={props.onHeightChange}>
-            {link.subMenus.map(sLink => {
-              return <div key={sLink.id} className='whitespace-nowrap dark:text-gray-200
+            {link.subMenus.map((sLink, index) => {
+              return <div key={index} className='whitespace-nowrap dark:text-gray-200
               not:last-child:border-b-0 border-b dark:border-gray-800 py-2 px-14 cursor-pointer hover:bg-gray-100
               font-extralight dark:bg-black text-left justify-start text-gray-600 bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
diff --git a/themes/fukasawa/components/MenuList.js b/themes/fukasawa/components/MenuList.js
index 52bae336..0445f338 100644
--- a/themes/fukasawa/components/MenuList.js
+++ b/themes/fukasawa/components/MenuList.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import CONFIG_FUKA from '../config'
-import BLOG from '@/blog.config'
+import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemDrop } from './MenuItemDrop'
 import { MenuItemCollapse } from './MenuItemCollapse'
 
@@ -10,10 +10,10 @@ export const MenuList = (props) => {
 
   let links = [
     { name: locale.NAV.INDEX, to: '/' || '/', show: true },
-    { name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG_FUKA.MENU_CATEGORY },
-    { name: locale.COMMON.TAGS, to: '/tag', show: CONFIG_FUKA.MENU_TAG },
-    { name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG_FUKA.MENU_ARCHIVE },
-    { name: locale.NAV.SEARCH, to: '/search', show: CONFIG_FUKA.MENU_SEARCH }
+    { name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('FUKASAWA_MENU_CATEGORY', null, CONFIG) },
+    { name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('FUKASAWA_MENU_TAG', null, CONFIG) },
+    { name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('FUKASAWA_MENU_ARCHIVE', null, CONFIG) },
+    { name: locale.NAV.SEARCH, to: '/search', show: siteConfig('FUKASAWA_MENU_SEARCH', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -21,7 +21,7 @@ export const MenuList = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/fukasawa/components/SiteInfo.js b/themes/fukasawa/components/SiteInfo.js
index 3a18bcd1..95472442 100644
--- a/themes/fukasawa/components/SiteInfo.js
+++ b/themes/fukasawa/components/SiteInfo.js
@@ -1,27 +1,23 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 function SiteInfo ({ title }) {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return (
         <footer
             className='relative leading-6 justify-start w-full text-gray-600 dark:text-gray-300 text-xs font-sans'
         >
-            <span> © {`${copyrightDate}`} <span> <a href={BLOG.LINK}> <i className='mx-1 animate-pulse fas fa-heart'/> {BLOG.AUTHOR}</a>. <br /></span>
+            <span> © {`${copyrightDate}`} <span> <a href={siteConfig('LINK')}> <i className='mx-1 animate-pulse fas fa-heart'/> {siteConfig('AUTHOR')}</a>. <br /></span>
 
-            {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
+            {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a><br/></>}
 
             <span className='hidden busuanzi_container_site_pv'> <i className='fas fa-eye' /><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
             <span className='pl-2 hidden busuanzi_container_site_uv'> <i className='fas fa-users' /> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
             <br />
-            <span className='text-xs font-serif'> Powered by <a href='https://github.com/tangly1024/NotionNext' className='underline'>NotionNext {BLOG.VERSION}</a></span><br /></span>
+            <span className='text-xs font-serif'> Powered by <a href='https://github.com/tangly1024/NotionNext' className='underline'>NotionNext {siteConfig('VERSION')}</a></span><br /></span>
             <h1>{title}</h1>
         </footer>
   )
diff --git a/themes/fukasawa/components/SocialButton.js b/themes/fukasawa/components/SocialButton.js
index 234182cf..796d5c5f 100644
--- a/themes/fukasawa/components/SocialButton.js
+++ b/themes/fukasawa/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -9,34 +8,34 @@ import React from 'react'
 const SocialButton = () => {
   return <div className='w-52 flex-wrap flex'>
     <div className='space-x-3 text-lg text-gray-500 dark:text-gray-400'>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {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>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='fab fa-twitter transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='fab fa-telegram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkedIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkedIn'} >
         <i className='fab fa-linkedin transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='fab fa-weibo transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='fab fa-instagram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='fas fa-envelope transform hover:scale-125 duration-150'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='fas fa-rss transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+      {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
         <i className='fab fa-bilibili transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+      {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
         <i className='fab fa-youtube transform hover:scale-125 duration-150'/>
       </a>}
     </div>
diff --git a/themes/fukasawa/components/TagItem.js b/themes/fukasawa/components/TagItem.js
index 18511426..179da9db 100644
--- a/themes/fukasawa/components/TagItem.js
+++ b/themes/fukasawa/components/TagItem.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 
 const TagItem = ({ tag, selected }) => {
diff --git a/themes/fukasawa/config.js b/themes/fukasawa/config.js
index f9265e8c..86e641bd 100644
--- a/themes/fukasawa/config.js
+++ b/themes/fukasawa/config.js
@@ -1,17 +1,17 @@
 const CONFIG = {
 
-  POST_LIST_COVER: true, // 文章列表显示图片封面
-  POST_LIST_COVER_FORCE: false, // 即使没有封面也将站点背景图设置为封面
-  POST_LIST_PREVIEW: false, // 显示文章预览
+  FUKASAWA_POST_LIST_COVER: true, // 文章列表显示图片封面
+  FUKASAWA_POST_LIST_COVER_FORCE: false, // 即使没有封面也将站点背景图设置为封面
+  FUKASAWA_POST_LIST_PREVIEW: false, // 显示文章预览
 
   // 菜单
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: false, // 显示搜索
+  FUKASAWA_MENU_CATEGORY: true, // 显示分类
+  FUKASAWA_MENU_TAG: true, // 显示标签
+  FUKASAWA_MENU_ARCHIVE: true, // 显示归档
+  FUKASAWA_MENU_SEARCH: false, // 显示搜索
 
-  SIDEBAR_COLLAPSE_BUTTON: true, // 侧边栏折叠按钮
-  SIDEBAR_COLLAPSE_SATUS_DEFAULT: false // 侧边栏默认折叠收起
+  FUKASAWA_SIDEBAR_COLLAPSE_BUTTON: true, // 侧边栏折叠按钮
+  FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT: false // 侧边栏默认折叠收起
 
 }
 export default CONFIG
diff --git a/themes/fukasawa/index.js b/themes/fukasawa/index.js
index 0782b4e5..7ab72892 100644
--- a/themes/fukasawa/index.js
+++ b/themes/fukasawa/index.js
@@ -3,7 +3,6 @@
 import CONFIG from './config'
 import TopNav from './components/TopNav'
 import AsideLeft from './components/AsideLeft'
-import BLOG from '@/blog.config'
 import { isBrowser } from '@/lib/utils'
 import { useGlobal } from '@/lib/global'
 import BlogListPage from './components/BlogListPage'
@@ -21,6 +20,8 @@ import { AdSlot } from '@/components/GoogleAdsense'
 import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
 import CommonHead from '@/components/CommonHead'
+import { siteConfig } from '@/lib/config'
+import WWAds from '@/components/WWAds'
 
 const Live2D = dynamic(() => import('@/components/Live2D'))
 
@@ -50,9 +51,9 @@ const LayoutBase = (props) => {
   // 侧边栏折叠从 本地存储中获取 open 状态的初始值
   const [isCollapsed, setIsCollapse] = useState(() => {
     if (typeof window !== 'undefined') {
-      return localStorage.getItem('fukasawa-sidebar-collapse') === 'true' || CONFIG.SIDEBAR_COLLAPSE_SATUS_DEFAULT
+      return localStorage.getItem('fukasawa-sidebar-collapse') === 'true' || siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT', null, CONFIG)
     }
-    return CONFIG.SIDEBAR_COLLAPSE_SATUS_DEFAULT
+    return siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_SATUS_DEFAULT', null, CONFIG)
   })
 
   // 在组件卸载时保存 open 状态到本地存储中
@@ -72,7 +73,7 @@ const LayoutBase = (props) => {
 
                 <TopNav {...props} />
 
-                <div className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + ' flex'}>
+                <div className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + ' flex'}>
                     {/* 侧边抽屉 */}
                     <AsideLeft {...props} slot={leftAreaSlot} />
 
@@ -124,7 +125,10 @@ const LayoutIndex = (props) => {
             */
 const LayoutPostList = (props) => {
   return <LayoutBase {...props}>
-        {BLOG.POST_LIST_STYLE === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
+
+        <div className='w-full p-2'><WWAds className='w-full' orientation='horizontal'/></div>
+
+         {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
     </LayoutBase>
 }
 
diff --git a/themes/gitbook/components/BlogArchiveItem.js b/themes/gitbook/components/BlogArchiveItem.js
index 8e9693dc..efd67565 100644
--- a/themes/gitbook/components/BlogArchiveItem.js
+++ b/themes/gitbook/components/BlogArchiveItem.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 
 /**
@@ -23,7 +23,7 @@ export default function BlogArchiveItem({ archiveTitle, archivePosts }) {
                             </span>{' '}
                             &nbsp;
 
-                            <Link passHref href={`${BLOG.SUB_PATH}/${post.slug}`}
+                            <Link passHref href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                 className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
                                 {post.title}
                             </Link>
diff --git a/themes/gitbook/components/BlogPostCard.js b/themes/gitbook/components/BlogPostCard.js
index 15ff21ef..4dcd9686 100644
--- a/themes/gitbook/components/BlogPostCard.js
+++ b/themes/gitbook/components/BlogPostCard.js
@@ -1,7 +1,6 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
-import React from 'react'
 
 const BlogPostCard = ({ post, className }) => {
   const router = useRouter()
@@ -9,7 +8,7 @@ const BlogPostCard = ({ post, className }) => {
   return (
         <div key={post.id} className={`${className} py-1 cursor-pointer px-2 hover:bg-gray-50 rounded-md dark:hover:bg-gray-600  ${currentSelected ? 'bg-green-50 text-green-500' : ''}`}>
             <div className="flex flex-col w-full select-none">
-                <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref>
+                <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref>
                     {post.title}
                 </Link>
             </div>
diff --git a/themes/gitbook/components/BlogPostListPage.js b/themes/gitbook/components/BlogPostListPage.js
index d9228b51..3d68f154 100644
--- a/themes/gitbook/components/BlogPostListPage.js
+++ b/themes/gitbook/components/BlogPostListPage.js
@@ -1,5 +1,5 @@
 import BlogPostCard from './BlogPostCard'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import NavPostListEmpty from './NavPostListEmpty'
 import PaginationSimple from './PaginationSimple'
 
@@ -12,7 +12,7 @@ import PaginationSimple from './PaginationSimple'
  * @constructor
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
 
   if (!posts || posts.length === 0) {
     return <NavPostListEmpty />
diff --git a/themes/gitbook/components/BottomMenuBar.js b/themes/gitbook/components/BottomMenuBar.js
index 101fd572..234221b5 100644
--- a/themes/gitbook/components/BottomMenuBar.js
+++ b/themes/gitbook/components/BottomMenuBar.js
@@ -1,5 +1,4 @@
 import { useGitBookGlobal } from '@/themes/gitbook'
-import React from 'react'
 import JumpToTopButton from './JumpToTopButton'
 
 export default function BottomMenuBar({ post, className }) {
diff --git a/themes/gitbook/components/CategoryGroup.js b/themes/gitbook/components/CategoryGroup.js
index 1516c038..71f40a0d 100644
--- a/themes/gitbook/components/CategoryGroup.js
+++ b/themes/gitbook/components/CategoryGroup.js
@@ -1,4 +1,4 @@
-import React from 'react'
+
 import CategoryItem from './CategoryItem'
 
 const CategoryGroup = ({ currentCategory, categoryOptions }) => {
diff --git a/themes/gitbook/components/Footer.js b/themes/gitbook/components/Footer.js
index fb1d339c..1f7d86fb 100644
--- a/themes/gitbook/components/Footer.js
+++ b/themes/gitbook/components/Footer.js
@@ -1,15 +1,10 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 const Footer = ({ siteInfo }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function () {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return (
         <footer
@@ -18,19 +13,19 @@ const Footer = ({ siteInfo }) => {
             <hr className='pb-2' />
 
             <div className='flex justify-center'>
-                <div><i className='mx-1 animate-pulse fas fa-heart' /> <a href={BLOG.LINK} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.<br /></div>
+                <div><i className='mx-1 animate-pulse fas fa-heart' /> <a href={siteConfig('LINK')} className='underline font-bold text-gray-500 dark:text-gray-300 '>{siteConfig('AUTHOR')}</a>.<br /></div>
                 © {`${copyrightDate}`}
             </div>
 
             <div className='text-xs font-serif'>Powered By <a href='https://github.com/tangly1024/NotionNext' className='underline text-gray-500 dark:text-gray-300'>NotionNext</a></div>
 
-            {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br /></>}
+            {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a><br /></>}
 
             <span className='hidden busuanzi_container_site_pv'>
                 <i className='fas fa-eye' /><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
             <span className='pl-2 hidden busuanzi_container_site_uv'>
                 <i className='fas fa-users' /> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
-            <h1 className='pt-1'>{siteInfo?.title}</h1>
+            <h1 className='pt-1'>{siteConfig('TITLE')}</h1>
 
         </footer>
   )
diff --git a/themes/gitbook/components/InfoCard.js b/themes/gitbook/components/InfoCard.js
index 13fe31c8..4b6e5cfe 100644
--- a/themes/gitbook/components/InfoCard.js
+++ b/themes/gitbook/components/InfoCard.js
@@ -1,18 +1,17 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import Router from 'next/router'
-import React from 'react'
 import SocialButton from './SocialButton'
+import { siteConfig } from '@/lib/config'
 
 const InfoCard = (props) => {
   const { siteInfo } = props
   return <div id='info-card' className='py-4'>
     <div className='items-center justify-center'>
         <div className='hover:scale-105 transform duration-200 cursor-pointer flex justify-center' onClick={ () => { Router.push('/about') }}>
-            <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={BLOG.AUTHOR}/>
+            <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={siteConfig('AUTHOR')}/>
          </div>
-        <div className='text-xl py-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-300'>{BLOG.AUTHOR}</div>
-        <div className='font-light text-gray-600 mb-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-400'>{BLOG.BIO}</div>
+        <div className='text-xl py-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-300'>{siteConfig('AUTHOR')}</div>
+        <div className='font-light text-gray-600 mb-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-400'>{siteConfig('BIO')}</div>
         <SocialButton/>
     </div>
   </div>
diff --git a/themes/gitbook/components/LeftMenuBar.js b/themes/gitbook/components/LeftMenuBar.js
index e6636e19..6bde6c51 100644
--- a/themes/gitbook/components/LeftMenuBar.js
+++ b/themes/gitbook/components/LeftMenuBar.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 export default function LeftMenuBar () {
   return (
diff --git a/themes/gitbook/components/LogoBar.js b/themes/gitbook/components/LogoBar.js
index 70c96b46..e0f7b4cb 100644
--- a/themes/gitbook/components/LogoBar.js
+++ b/themes/gitbook/components/LogoBar.js
@@ -1,7 +1,7 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import { useGitBookGlobal } from '@/themes/gitbook'
 import Link from 'next/link'
+import { siteConfig } from '@/lib/config'
 
 /**
  * Logo区域
@@ -21,8 +21,8 @@ export default function LogoBar(props) {
                 <i className={`fa-solid ${pageNavVisible ? 'fa-align-justify' : 'fa-indent'}`}></i>
             </div>
             <Link href='/' className='flex text-md md:text-xl dark:text-gray-200'>
-                <LazyImage src={siteInfo?.icon} width={24} height={24} alt={BLOG.AUTHOR} className='mr-2 hidden md:block' />
-                {siteInfo?.title}
+                <LazyImage src={siteInfo?.icon} width={24} height={24} alt={siteConfig('AUTHOR')} className='mr-2 hidden md:block' />
+                {siteConfig('TITLE')}
             </Link>
         </div>
   )
diff --git a/themes/gitbook/components/MenuBarMobile.js b/themes/gitbook/components/MenuBarMobile.js
index 2db19133..4a361a2f 100644
--- a/themes/gitbook/components/MenuBarMobile.js
+++ b/themes/gitbook/components/MenuBarMobile.js
@@ -1,7 +1,6 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemCollapse } from './MenuItemCollapse'
 
 export const MenuBarMobile = (props) => {
@@ -10,10 +9,10 @@ export const MenuBarMobile = (props) => {
 
   let links = [
     // { name: locale.NAV.INDEX, to: '/' || '/', show: true },
-    { name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG },
-    { name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE }
-    // { name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH }
+    { name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('GITBOOK_MENU_CATEGORY', null, CONFIG) },
+    { name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('GITBOOK_BOOK_MENU_TAG', null, CONFIG) },
+    { name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('GITBOOK_MENU_ARCHIVE', null, CONFIG) }
+    // { name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MENU_SEARCH', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -21,7 +20,7 @@ export const MenuBarMobile = (props) => {
   }
 
   // 如果 开启自定义菜单，则不再使用 Page生成菜单。
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/gitbook/components/NavPostItem.js b/themes/gitbook/components/NavPostItem.js
index 66ffa6dd..e83046ce 100644
--- a/themes/gitbook/components/NavPostItem.js
+++ b/themes/gitbook/components/NavPostItem.js
@@ -1,5 +1,5 @@
 import BlogPostCard from './BlogPostCard'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import Collapse from '@/components/Collapse'
 
 /**
diff --git a/themes/gitbook/components/NavPostList.js b/themes/gitbook/components/NavPostList.js
index ceef2105..58b894d8 100644
--- a/themes/gitbook/components/NavPostList.js
+++ b/themes/gitbook/components/NavPostList.js
@@ -2,6 +2,7 @@ import NavPostListEmpty from './NavPostListEmpty'
 import { useRouter } from 'next/router'
 import NavPostItem from './NavPostItem'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 博客列表滚动分页
@@ -19,7 +20,7 @@ const NavPostList = (props) => {
 
     let existingGroup = null
     // 开启自动分组排序
-    if (JSON.parse(CONFIG.AUTO_SORT)) {
+    if (JSON.parse(siteConfig('GITBOOK_AUTO_SORT', true, CONFIG))) {
       existingGroup = groups.find(group => group.category === categoryName) // 搜索同名的最后一个分组
     } else {
       existingGroup = groups[groups.length - 1] // 获取最后一个分组
diff --git a/themes/gitbook/components/Progress.js b/themes/gitbook/components/Progress.js
index 669d09a8..29feef49 100644
--- a/themes/gitbook/components/Progress.js
+++ b/themes/gitbook/components/Progress.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { isBrowser } from '@/lib/utils'
 
 /**
diff --git a/themes/gitbook/components/SocialButton.js b/themes/gitbook/components/SocialButton.js
index 164a71fc..b1bd85f9 100644
--- a/themes/gitbook/components/SocialButton.js
+++ b/themes/gitbook/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -8,28 +7,28 @@ import React from 'react'
  */
 const SocialButton = () => {
   return <div className='space-x-3 text-xl text-gray-600 dark:text-gray-400 flex-wrap flex justify-center '>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {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 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='fab fa-twitter transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='fab fa-telegram transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkedIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkedIn'} >
         <i className='transform hover:scale-125 duration-150 fab fa-linkedin dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='fab fa-weibo transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='fab fa-instagram transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='fas fa-envelope transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='fas fa-rss transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
     </div>
diff --git a/themes/gitbook/components/TopNavBar.js b/themes/gitbook/components/TopNavBar.js
index 24837feb..c2257fb5 100644
--- a/themes/gitbook/components/TopNavBar.js
+++ b/themes/gitbook/components/TopNavBar.js
@@ -4,7 +4,7 @@ import Collapse from '@/components/Collapse'
 import { MenuBarMobile } from './MenuBarMobile'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemDrop } from './MenuItemDrop'
 import DarkModeButton from '@/components/DarkModeButton'
 
@@ -21,10 +21,10 @@ export default function TopNavBar(props) {
   const { locale } = useGlobal()
 
   const defaultLinks = [
-    { icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG },
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH }
+    { icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('GITBOOK_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('GITBOOK_BOOK_MENU_TAG', null, CONFIG) },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('GITBOOK_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('GITBOOK_MENU_SEARCH', null, CONFIG) }
   ]
 
   let links = defaultLinks.concat(customNav)
@@ -34,7 +34,7 @@ export default function TopNavBar(props) {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/gitbook/config.js b/themes/gitbook/config.js
index 25feb4b8..9a7778ff 100644
--- a/themes/gitbook/config.js
+++ b/themes/gitbook/config.js
@@ -1,17 +1,17 @@
 const CONFIG = {
 
-  INDEX_PAGE: 'about', // 文档首页显示的文章，请确此路径包含在您的notion数据库中
+  GITBOOK_INDEX_PAGE: 'about', // 文档首页显示的文章，请确此路径包含在您的notion数据库中
 
-  AUTO_SORT: process.env.NEXT_PUBLIC_GITBOOK_AUTO_SORT || true, // 是否自动按分类名 归组排序文章；自动归组可能会打乱您Notion中的文章顺序
+  GITBOOK_AUTO_SORT: process.env.NEXT_PUBLIC_GITBOOK_AUTO_SORT || true, // 是否自动按分类名 归组排序文章；自动归组可能会打乱您Notion中的文章顺序
 
   // 菜单
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  GITBOOK_MENU_CATEGORY: true, // 显示分类
+  GITBOOK_BOOK_MENU_TAG: true, // 显示标签
+  GITBOOK_MENU_ARCHIVE: true, // 显示归档
+  GITBOOK_MENU_SEARCH: true, // 显示搜索
 
   // Widget
-  WIDGET_REVOLVER_MAPS: process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
-  WIDGET_TO_TOP: true // 跳回顶部
+  GITBOOK_WIDGET_REVOLVER_MAPS: process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
+  GITBOOK_WIDGET_TO_TOP: true // 跳回顶部
 }
 export default CONFIG
diff --git a/themes/gitbook/index.js b/themes/gitbook/index.js
index cb0b728a..2e42b314 100644
--- a/themes/gitbook/index.js
+++ b/themes/gitbook/index.js
@@ -11,7 +11,6 @@ import TopNavBar from './components/TopNavBar'
 import SearchInput from './components/SearchInput'
 import { useGlobal } from '@/lib/global'
 import Live2D from '@/components/Live2D'
-import BLOG from '@/blog.config'
 import NavPostList from './components/NavPostList'
 import ArticleInfo from './components/ArticleInfo'
 import Catalog from './components/Catalog'
@@ -35,6 +34,7 @@ import BlogArchiveItem from './components/BlogArchiveItem'
 import BlogPostListPage from './components/BlogPostListPage'
 import Link from 'next/link'
 import dynamic from 'next/dynamic'
+import { siteConfig } from '@/lib/config'
 const WWAds = dynamic(() => import('@/components/WWAds'), { ssr: false })
 
 // 主题全局变量
@@ -70,7 +70,7 @@ const LayoutBase = (props) => {
                 {/* 顶部导航栏 */}
                 <TopNavBar {...props} />
 
-                <main id='wrapper' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + 'relative flex justify-between w-full h-full mx-auto'}>
+                <main id='wrapper' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + 'relative flex justify-between w-full h-full mx-auto'}>
 
                     {/* 左侧推拉抽屉 */}
                     <div className={'font-sans hidden md:block border-r dark:border-transparent relative z-10 '}>
@@ -133,7 +133,7 @@ const LayoutBase = (props) => {
                                 {slotRight}
                                 {router.route === '/' && <>
                                     <InfoCard {...props} />
-                                    {CONFIG.WIDGET_REVOLVER_MAPS === 'true' && <RevolverMaps />}
+                                    {siteConfig('GITBOOK_WIDGET_REVOLVER_MAPS', null, CONFIG) === 'true' && <RevolverMaps />}
                                     <Live2D />
                                 </>}
                                 {/* gitbook主题首页只显示公告 */}
@@ -173,15 +173,15 @@ const LayoutBase = (props) => {
 const LayoutIndex = (props) => {
   const router = useRouter()
   useEffect(() => {
-    router.push(CONFIG.INDEX_PAGE).then(() => {
-      // console.log('跳转到指定首页', CONFIG.INDEX_PAGE)
+    router.push(siteConfig('GITBOOK_INDEX_PAGE', null, CONFIG)).then(() => {
+      // console.log('跳转到指定首页', siteConfig('INDEX_PAGE', null, CONFIG))
       setTimeout(() => {
         if (isBrowser) {
           const article = document.getElementById('notion-article')
           if (!article) {
-            console.log('请检查您的Notion数据库中是否包含此slug页面： ', CONFIG.INDEX_PAGE)
+            console.log('请检查您的Notion数据库中是否包含此slug页面： ', siteConfig('GITBOOK_INDEX_PAGE', null, CONFIG))
             const containerInner = document.querySelector('#theme-gitbook #container-inner')
-            const newHTML = `<h1 class="text-3xl pt-12  dark:text-gray-300">配置有误</h1><blockquote class="notion-quote notion-block-ce76391f3f2842d386468ff1eb705b92"><div>请在您的notion中添加一个slug为${CONFIG.INDEX_PAGE}的文章</div></blockquote>`
+            const newHTML = `<h1 class="text-3xl pt-12  dark:text-gray-300">配置有误</h1><blockquote class="notion-quote notion-block-ce76391f3f2842d386468ff1eb705b92"><div>请在您的notion中添加一个slug为${siteConfig('GITBOOK_INDEX_PAGE', null, CONFIG)}的文章</div></blockquote>`
             containerInner?.insertAdjacentHTML('afterbegin', newHTML)
           }
         }
@@ -230,9 +230,9 @@ const LayoutSlug = (props) => {
                     <ShareBar post={post} />
                     {/* 文章分类和标签信息 */}
                     <div className='flex justify-between'>
-                        {CONFIG.POST_DETAIL_CATEGORY && post?.category && <CategoryItem category={post.category} />}
+                        {siteConfig('POST_DETAIL_CATEGORY', null, CONFIG) && post?.category && <CategoryItem category={post.category} />}
                         <div>
-                            {CONFIG.POST_DETAIL_TAG && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
+                            {siteConfig('POST_DETAIL_TAG', null, CONFIG) && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
                         </div>
                     </div>
 
diff --git a/themes/heo/components/AnalyticsCard.js b/themes/heo/components/AnalyticsCard.js
index a9d30477..835f4900 100644
--- a/themes/heo/components/AnalyticsCard.js
+++ b/themes/heo/components/AnalyticsCard.js
@@ -1,4 +1,5 @@
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 博客统计卡牌
@@ -6,7 +7,7 @@ import CONFIG from '../config'
  * @returns
  */
 export function AnalyticsCard(props) {
-  const targetDate = new Date(CONFIG.SITE_CREATE_TIME)
+  const targetDate = new Date(siteConfig('HEO_SITE_CREATE_TIME', null, CONFIG))
   const today = new Date()
   const diffTime = today.getTime() - targetDate.getTime() // 获取两个日期之间的毫秒数差值
   const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)) // 将毫秒数差值转换为天数差值
diff --git a/themes/heo/components/ArticleAdjacent.js b/themes/heo/components/ArticleAdjacent.js
index 9fb34a5e..d905be08 100644
--- a/themes/heo/components/ArticleAdjacent.js
+++ b/themes/heo/components/ArticleAdjacent.js
@@ -2,6 +2,7 @@ import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 上一篇，下一篇文章
@@ -42,7 +43,7 @@ export default function ArticleAdjacent({ prev, next }) {
     }
   }, [])
 
-  if (!prev || !next || !CONFIG.ARTICLE_ADJACENT) {
+  if (!prev || !next || !siteConfig('HEO_ARTICLE_ADJACENT', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/heo/components/ArticleCopyright.js b/themes/heo/components/ArticleCopyright.js
index 78500ddf..285eb2d4 100644
--- a/themes/heo/components/ArticleCopyright.js
+++ b/themes/heo/components/ArticleCopyright.js
@@ -1,20 +1,20 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function ArticleCopyright () {
   const router = useRouter()
-  const [path, setPath] = useState(BLOG.LINK + router.asPath)
+  const [path, setPath] = useState(siteConfig('LINK') + router.asPath)
   useEffect(() => {
     setPath(window.location.href)
   })
 
   const { locale } = useGlobal()
 
-  if (!CONFIG.ARTICLE_COPYRIGHT) {
+  if (!siteConfig('HEO_ARTICLE_COPYRIGHT', null, CONFIG)) {
     return <></>
   }
 
@@ -24,7 +24,7 @@ export default function ArticleCopyright () {
         <li>
           <strong className='mr-2'>{locale.COMMON.AUTHOR}:</strong>
           <Link href={'/about'} className="hover:underline">
-            {BLOG.AUTHOR}
+            {siteConfig('AUTHOR')}
           </Link>
         </li>
         <li>
diff --git a/themes/heo/components/ArticleRecommend.js b/themes/heo/components/ArticleRecommend.js
index f7f6c738..02fa0b7f 100644
--- a/themes/heo/components/ArticleRecommend.js
+++ b/themes/heo/components/ArticleRecommend.js
@@ -1,8 +1,8 @@
 import Link from 'next/link'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 关联推荐文章
@@ -13,7 +13,7 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
   const { locale } = useGlobal()
 
   if (
-    !CONFIG.ARTICLE_RECOMMEND ||
+    !siteConfig('HEO_ARTICLE_RECOMMEND', null, CONFIG) ||
         !recommendPosts ||
         recommendPosts.length === 0
   ) {
@@ -43,7 +43,7 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
                     (<Link
                             key={post.id}
                             title={post.title}
-                            href={`${BLOG.SUB_PATH}/${post.slug}`}
+                            href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                             passHref
                             className="flex h-40 cursor-pointer overflow-hidden rounded-2xl">
 
diff --git a/themes/heo/components/BlogPostArchive.js b/themes/heo/components/BlogPostArchive.js
index 4f471444..7a285d6d 100644
--- a/themes/heo/components/BlogPostArchive.js
+++ b/themes/heo/components/BlogPostArchive.js
@@ -1,9 +1,8 @@
-import React from 'react'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
 import CONFIG from '../config'
 import TagItemMini from './TagItemMini'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 /**
  * 博客归档列表
  * @param posts 所有文章
@@ -25,17 +24,17 @@ const BlogPostArchive = ({ posts = [], archiveTitle, siteInfo }) => {
                 </div>
                 <ul>
                     {posts?.map(post => {
-                      const showPreview = CONFIG.POST_LIST_PREVIEW && post.blockMap
-                      if (post && !post.pageCoverThumbnail && CONFIG.POST_LIST_COVER_DEFAULT) {
+                      const showPreview = siteConfig('HEO_POST_LIST_PREVIEW', null, CONFIG) && post.blockMap
+                      if (post && !post.pageCoverThumbnail && siteConfig('HEO_POST_LIST_COVER_DEFAULT', null, CONFIG)) {
                         post.pageCoverThumbnail = siteInfo?.pageCover
                       }
-                      const showPageCover = CONFIG.POST_LIST_COVER && post?.pageCoverThumbnail && !showPreview
+                      const showPageCover = siteConfig('HEO_POST_LIST_COVER', null, CONFIG) && post?.pageCoverThumbnail && !showPreview
                       return <div key={post.id} className={'cursor-pointer flex flex-row mb-4 h-24 md:flex-row group w-full  dark:border-gray-600 hover:border-indigo-600  dark:hover:border-yellow-600 duration-300 transition-colors justify-between overflow-hidden'}>
 
                             {/* 图片封面 */}
                             {showPageCover && (
                                 <div>
-                                    <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
+                                    <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
                                         <LazyImage className={'rounded-xl bg-center bg-cover w-40 h-24'} src={post?.pageCoverThumbnail}/>
                                     </Link>
                                 </div>
@@ -54,7 +53,7 @@ const BlogPostArchive = ({ posts = [], archiveTitle, siteInfo }) => {
 
                                     {/* 标题 */}
                                     <Link
-                                        href={`${BLOG.SUB_PATH}/${post.slug}`}
+                                        href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                         passHref
                                         className={' group-hover:text-indigo-700 group-hover:dark:text-indigo-400 text-black dark:text-gray-100 dark:group-hover:text-yellow-600 line-clamp-2 replace cursor-pointer text-xl font-extrabold leading-tight'}>
                                         <span className='menu-link '>{post.title}</span>
diff --git a/themes/heo/components/BlogPostCard.js b/themes/heo/components/BlogPostCard.js
index 7c6079f9..f88aabbe 100644
--- a/themes/heo/components/BlogPostCard.js
+++ b/themes/heo/components/BlogPostCard.js
@@ -1,17 +1,17 @@
 import Link from 'next/link'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
 import TagItemMini from './TagItemMini'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 
 const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
-  const showPreview = CONFIG.POST_LIST_PREVIEW && post.blockMap
-  if (post && !post.pageCoverThumbnail && CONFIG.POST_LIST_COVER_DEFAULT) {
+  const showPreview = siteConfig('HEO_POST_LIST_PREVIEW', null, CONFIG) && post.blockMap
+  if (post && !post.pageCoverThumbnail && siteConfig('HEO_POST_LIST_COVER_DEFAULT', null, CONFIG)) {
     post.pageCoverThumbnail = siteInfo?.pageCover
   }
-  const showPageCover = CONFIG.POST_LIST_COVER && post?.pageCoverThumbnail && !showPreview
+  const showPageCover = siteConfig('HEO_POST_LIST_COVER', null, CONFIG) && post?.pageCoverThumbnail && !showPreview
   return (
-        <div className={` ${CONFIG.POST_LIST_COVER_HOVER_ENLARGE ? ' hover:scale-110 transition-all duration-150' : ''}`} >
+        <div className={` ${siteConfig('HEO_POST_LIST_COVER_HOVER_ENLARGE', null, CONFIG) ? ' hover:scale-110 transition-all duration-150' : ''}`} >
 
             <div
                 data-aos="fade-up"
@@ -22,7 +22,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
 
                 {/* 图片封面 */}
                 {showPageCover && (
-                    <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
+                    <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
                         <div className="w-full md:w-5/12 2xl:w-full overflow-hidden">
                             <LazyImage priority={index === 0} src={post?.pageCoverThumbnail} alt={post?.title} className='h-60 w-full object-cover group-hover:scale-105 group-hover:brightness-75 transition-all duration-300' />
                         </div>
@@ -42,7 +42,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
 
                         {/* 标题 */}
                         <Link
-                            href={`${BLOG.SUB_PATH}/${post.slug}`}
+                            href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                             passHref
                             className={' group-hover:text-indigo-700 dark:hover:text-yellow-700 dark:group-hover:text-yellow-600 text-black dark:text-gray-100  line-clamp-2 replace cursor-pointer text-xl font-extrabold leading-tight'}>
                             <span className='menu-link '>{post.title}</span>
diff --git a/themes/heo/components/BlogPostListPage.js b/themes/heo/components/BlogPostListPage.js
index 52683984..dcb6afa3 100644
--- a/themes/heo/components/BlogPostListPage.js
+++ b/themes/heo/components/BlogPostListPage.js
@@ -1,7 +1,7 @@
 import BlogPostCard from './BlogPostCard'
 import PaginationNumber from './PaginationNumber'
-import BLOG from '@/blog.config'
 import BlogPostListEmpty from './BlogPostListEmpty'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 文章列表分页表格
@@ -12,8 +12,8 @@ import BlogPostListEmpty from './BlogPostListEmpty'
  * @constructor
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
-  const showPagination = postCount >= BLOG.POSTS_PER_PAGE
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+  const showPagination = postCount >= parseInt(siteConfig('POSTS_PER_PAGE'))
   if (!posts || posts.length === 0 || page > totalPage) {
     return <BlogPostListEmpty />
   } else {
diff --git a/themes/heo/components/BlogPostListScroll.js b/themes/heo/components/BlogPostListScroll.js
index 20202a9f..95063b16 100644
--- a/themes/heo/components/BlogPostListScroll.js
+++ b/themes/heo/components/BlogPostListScroll.js
@@ -1,10 +1,10 @@
-import BLOG from '@/blog.config'
 import BlogPostCard from './BlogPostCard'
 import BlogPostListEmpty from './BlogPostListEmpty'
 import { useGlobal } from '@/lib/global'
-import React, { useEffect, useRef, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import CONFIG from '../config'
 import { getListByPage } from '@/lib/utils'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 博客列表滚动分页
@@ -13,8 +13,8 @@ import { getListByPage } from '@/lib/utils'
  * @returns {JSX.Element}
  * @constructor
  */
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.POST_LIST_SUMMARY, siteInfo }) => {
-  const postsPerPage = BLOG.POSTS_PER_PAGE
+const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('HEO_POST_LIST_SUMMARY', null, CONFIG), siteInfo }) => {
+  const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
   const [page, updatePage] = useState(1)
   const postsToShow = getListByPage(posts, page, postsPerPage)
 
diff --git a/themes/heo/components/CategoryGroup.js b/themes/heo/components/CategoryGroup.js
index 811ad9ff..21915d72 100644
--- a/themes/heo/components/CategoryGroup.js
+++ b/themes/heo/components/CategoryGroup.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 const CategoryGroup = ({ currentCategory, categories }) => {
   if (!categories) {
diff --git a/themes/heo/components/FloatDarkModeButton.js b/themes/heo/components/FloatDarkModeButton.js
index f693d1f0..ec480ee4 100644
--- a/themes/heo/components/FloatDarkModeButton.js
+++ b/themes/heo/components/FloatDarkModeButton.js
@@ -1,11 +1,12 @@
 import { useGlobal } from '@/lib/global'
 import { saveDarkModeToCookies } from '@/themes/theme'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function FloatDarkModeButton () {
   const { isDarkMode, updateDarkMode } = useGlobal()
 
-  if (!CONFIG.WIDGET_DARK_MODE) {
+  if (!siteConfig('HEO_WIDGET_DARK_MODE', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/heo/components/Footer.js b/themes/heo/components/Footer.js
index 772ade19..bc366cb2 100644
--- a/themes/heo/components/Footer.js
+++ b/themes/heo/components/Footer.js
@@ -1,17 +1,11 @@
-import React from 'react'
-import BLOG from '@/blog.config'
 import SocialButton from './SocialButton'
-// import DarkModeButton from '@/components/DarkModeButton'
+import { siteConfig } from '@/lib/config'
 
 const Footer = ({ title }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function () {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return (
         <footer
@@ -34,18 +28,18 @@ const Footer = ({ title }) => {
             <div id='footer-bottom' className='w-full h-20 flex flex-col p-3 lg:flex-row justify-between px-6 items-center bg-[#f1f3f7] dark:bg-[#30343f]'>
 
                 <div id='footer-bottom-left'>
-                   NotionNext {BLOG.VERSION} <i className='fas fa-copyright' /> {`${copyrightDate}`} <i className='mx-1 animate-pulse fas fa-heart' /> <a href={BLOG.LINK} className='underline font-bold  dark:text-gray-300 '>{BLOG.AUTHOR}</a>.
+                   NotionNext {siteConfig('VERSION')} <i className='fas fa-copyright' /> {`${copyrightDate}`} <i className='mx-1 animate-pulse fas fa-heart' /> <a href={siteConfig('LINK')} className='underline font-bold  dark:text-gray-300 '>{siteConfig('AUTHOR')}</a>.
                 </div>
 
             <div id='footer-bottom-right'>
-                {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a></>}
+                {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a></>}
 
                 <span className='hidden busuanzi_container_site_pv'>
                     <i className='fas fa-eye' /><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
                 <span className='pl-2 hidden busuanzi_container_site_uv'>
                     <i className='fas fa-users' /> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
 
-                {/* <h1 className='text-xs pt-4 text-light-400 dark:text-gray-400'>{title} {BLOG.BIO && <>|</>} {BLOG.BIO}</h1> */}
+                {/* <h1 className='text-xs pt-4 text-light-400 dark:text-gray-400'>{title} {siteConfig('BIO') && <>|</>} {siteConfig('BIO')}</h1> */}
 
             </div>
         </div>
diff --git a/themes/heo/components/Hero.js b/themes/heo/components/Hero.js
index a0ff3f73..3f2ddbf1 100644
--- a/themes/heo/components/Hero.js
+++ b/themes/heo/components/Hero.js
@@ -1,8 +1,7 @@
 // import Image from 'next/image'
-
-import BLOG from '@/blog.config'
 import { ArrowSmallRight, PlusSmall } from '@/components/HeroIcons'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useImperativeHandle, useRef, useState } from 'react'
@@ -70,7 +69,7 @@ function Banner(props) {
   function handleClickBanner() {
     const randomIndex = Math.floor(Math.random() * latestPosts.length)
     const randomPost = latestPosts[randomIndex]
-    router.push(`${BLOG.SUB_PATH}/${randomPost?.slug}`)
+    router.push(`${siteConfig('SUB_PATH', '')}/${randomPost?.slug}`)
   }
 
   return (
@@ -81,12 +80,12 @@ function Banner(props) {
     >
       <div id="banner-title" className="flex flex-col absolute top-10 left-10">
         <div className="text-4xl font-bold mb-3  dark:text-white">
-          {CONFIG.HERO_TITLE_1}
+          {siteConfig('HEO_HERO_TITLE_1', null, CONFIG)}
           <br />
-          {CONFIG.HERO_TITLE_2}
+          {siteConfig('HEO_HERO_TITLE_2', null, CONFIG)}
         </div>
         <div className="text-xs text-gray-600  dark:text-gray-200">
-          {CONFIG.HERO_TITLE_3}
+          {siteConfig('HEO_HERO_TITLE_3', null, CONFIG)}
         </div>
       </div>
 
@@ -117,7 +116,7 @@ function Banner(props) {
  * 英雄区左上角banner条中斜向滚动的图标
  */
 function TagsGroupBar() {
-  const groupIcons = CONFIG.GROUP_ICONS.concat(CONFIG.GROUP_ICONS)
+  const groupIcons = siteConfig('HEO_GROUP_ICONS', null, CONFIG).concat(siteConfig('HEO_GROUP_ICONS', null, CONFIG))
 
   return (
     <div className="tags-group-all flex -rotate-[30deg] h-full">
@@ -167,11 +166,11 @@ function GroupMenu() {
   return (
     <div className="h-[165px] select-none xl:h-20 flex flex-col justify-between xl:space-y-0 xl:flex-row w-28 lg:w-48 xl:w-full xl:flex-nowrap xl:space-x-3">
       <Link
-        href={CONFIG.HERO_CATEGORY_1?.url}
+        href={siteConfig('HEO_HERO_CATEGORY_1', null, CONFIG)?.url}
         className="group relative overflow-hidden bg-gradient-to-r from-blue-500 to-blue-400 flex h-20 justify-start items-center text-white rounded-xl xl:hover:w-1/2 xl:w-1/3 transition-all duration-500 ease-in"
       >
         <div className="font-bold lg:text-lg  pl-5 relative -mt-2">
-          {CONFIG.HERO_CATEGORY_1?.title}
+          {siteConfig('HEO_HERO_CATEGORY_1', null, CONFIG)?.title}
           <span className="absolute -bottom-0.5 left-5 w-5 h-0.5 bg-white rounded-full"></span>
         </div>
         <div className="hidden lg:block absolute right-6  duration-700 ease-in-out transition-all scale-[2] translate-y-6 rotate-12 opacity-20 group-hover:opacity-80 group-hover:scale-100 group-hover:translate-y-0 group-hover:rotate-0">
@@ -179,11 +178,11 @@ function GroupMenu() {
         </div>
       </Link>
       <Link
-        href={CONFIG.HERO_CATEGORY_2?.url}
+        href={siteConfig('HEO_HERO_CATEGORY_2', null, CONFIG)?.url}
         className="group relative overflow-hidden bg-gradient-to-r from-red-500 to-yellow-500 flex h-20 justify-start items-center text-white rounded-xl xl:hover:w-1/2 xl:w-1/3 transition-all duration-500 ease-in"
       >
         <div className="font-bold lg:text-lg pl-5 relative -mt-2">
-          {CONFIG.HERO_CATEGORY_2?.title}
+          {siteConfig('HEO_HERO_CATEGORY_2', null, CONFIG)?.title}
           <span className="absolute -bottom-0.5 left-5 w-5 h-0.5 bg-white rounded-full"></span>
         </div>
         <div className="hidden lg:block absolute right-6  duration-700 ease-in-out transition-all scale-[2] translate-y-6 rotate-12 opacity-20 group-hover:opacity-80 group-hover:scale-100 group-hover:translate-y-0 group-hover:rotate-0">
@@ -192,11 +191,11 @@ function GroupMenu() {
       </Link>
       {/* 第三个标签在小屏上不显示 */}
       <Link
-        href={CONFIG.HERO_CATEGORY_3?.url}
+        href={siteConfig('HEO_HERO_CATEGORY_3', null, CONFIG)?.url}
         className="group relative overflow-hidden bg-gradient-to-r from-teal-300 to-cyan-300 hidden h-20 xl:flex justify-start items-center text-white rounded-xl xl:hover:w-1/2 xl:w-1/3 transition-all duration-500 ease-in"
       >
         <div className="font-bold text-lg pl-5 relative -mt-2">
-          {CONFIG.HERO_CATEGORY_3?.title}
+          {siteConfig('HEO_HERO_CATEGORY_3', null, CONFIG)?.title}
           <span className="absolute -bottom-0.5 left-5 w-5 h-0.5 bg-white rounded-full"></span>
         </div>
         <div className="absolute right-6 duration-700 ease-in-out transition-all scale-[2] translate-y-6 rotate-12 opacity-20 group-hover:opacity-80 group-hover:scale-100 group-hover:translate-y-0 group-hover:rotate-0">
@@ -233,7 +232,7 @@ function TopGroup(props) {
       >
         {topPosts?.map((p, index) => {
           return (
-            <Link href={`${BLOG.SUB_PATH}/${p?.slug}`} key={index}>
+            <Link href={`${siteConfig('SUB_PATH', '')}/${p?.slug}`} key={index}>
               <div className="cursor-pointer h-[164px] group relative flex flex-col w-52 xl:w-full overflow-hidden shadow bg-white dark:bg-black dark:text-white rounded-xl">
                 <LazyImage
                   priority={index === 0}
@@ -264,8 +263,8 @@ function TopGroup(props) {
 function getTopPosts({ latestPosts, allNavPages }) {
   // 默认展示最近更新
   if (
-    !CONFIG.HERO_RECOMMEND_POST_TAG ||
-    CONFIG.HERO_RECOMMEND_POST_TAG === ''
+    !siteConfig('HEO_HERO_RECOMMEND_POST_TAG', null, CONFIG) ||
+    siteConfig('HEO_HERO_RECOMMEND_POST_TAG', null, CONFIG) === ''
   ) {
     return latestPosts
   }
@@ -274,7 +273,7 @@ function getTopPosts({ latestPosts, allNavPages }) {
   let sortPosts = []
 
   // 排序方式
-  if (JSON.parse(CONFIG.HERO_RECOMMEND_POST_SORT_BY_UPDATE_TIME)) {
+  if (JSON.parse(siteConfig('HEO_HERO_RECOMMEND_POST_SORT_BY_UPDATE_TIME', null, CONFIG))) {
     sortPosts = Object.create(allNavPages).sort((a, b) => {
       const dateA = new Date(a?.lastEditedDate)
       const dateB = new Date(b?.lastEditedDate)
@@ -290,7 +289,7 @@ function getTopPosts({ latestPosts, allNavPages }) {
       break
     }
     // 查找标签
-    if (post?.tags?.indexOf(CONFIG.HERO_RECOMMEND_POST_TAG) >= 0) {
+    if (post?.tags?.indexOf(siteConfig('HEO_HERO_RECOMMEND_POST_TAG', null, CONFIG)) >= 0) {
       topPosts.push(post)
     }
   }
@@ -331,7 +330,7 @@ function TodayCard({ cRef, siteInfo }) {
    * @param {*} e
    */
   function handleCardClick(e) {
-    router.push(CONFIG.HERO_TITLE_LINK)
+    router.push(siteConfig('HEO_HERO_TITLE_LINK', null, CONFIG))
   }
 
   return (
@@ -355,8 +354,8 @@ function TodayCard({ cRef, siteInfo }) {
           className="z-10 flex justify-between w-full relative text-white p-10 items-end"
         >
           <div className="flex flex-col">
-            <div className="text-xs font-light">{CONFIG.HERO_TITLE_4}</div>
-            <div className="text-3xl font-bold">{CONFIG.HERO_TITLE_5}</div>
+            <div className="text-xs font-light">{siteConfig('HEO_HERO_TITLE_4', null, CONFIG)}</div>
+            <div className="text-3xl font-bold">{siteConfig('HEO_HERO_TITLE_5', null, CONFIG)}</div>
           </div>
           <div
             onClick={handleClickMore}
diff --git a/themes/heo/components/HexoRecentComments.js b/themes/heo/components/HexoRecentComments.js
index 2ebf00c8..dbeee596 100644
--- a/themes/heo/components/HexoRecentComments.js
+++ b/themes/heo/components/HexoRecentComments.js
@@ -1,9 +1,9 @@
-import React from 'react'
-import BLOG from '@/blog.config'
 import Card from '@/themes/hexo/components/Card'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
 import { RecentComments } from '@waline/client'
+import { useEffect, useState } from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * @see https://waline.js.org/guide/get-started.html
@@ -11,12 +11,12 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const HexoRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
+  const [comments, updateComments] = useState([])
   const { locale } = useGlobal()
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/heo/components/InfoCard.js b/themes/heo/components/InfoCard.js
index ad4727c8..fd659aa3 100644
--- a/themes/heo/components/InfoCard.js
+++ b/themes/heo/components/InfoCard.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { ArrowRightCircle, GlobeAlt } from '@/components/HeroIcons'
 import LazyImage from '@/components/LazyImage'
 import Link from 'next/link'
@@ -17,21 +17,21 @@ export function InfoCard(props) {
   const { siteInfo, notice } = props
   const router = useRouter()
   // 在文章详情页特殊处理
-  const isSlugPage = router.pathname === '/[...slug]'
-
+  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'>
             {/* 信息卡牌第一行 */}
             <div className='flex justify-between'>
                 {/* 问候语 */}
                 <GreetingsWords />
-                <div className={`${isSlugPage ? 'absolute right-0 -mt-8 -mr-5 hover:opacity-0 hover:scale-150 blur' : 'cursor-pointer'} justify-center items-center flex dark:text-gray-100 transform transitaion-all duration-200`}>
-                    <LazyImage src={siteInfo?.icon} className='rounded-full' width={isSlugPage ? 100 : 28} alt={BLOG.AUTHOR} />
+                <div className={`${isSlugPage ? 'absolute right-0 -mt-8 -mr-6 hover:opacity-0 hover:scale-150 blur' : 'cursor-pointer'} justify-center items-center flex dark:text-gray-100 transform transitaion-all duration-200`}>
+                    <LazyImage src={siteInfo?.icon} className='rounded-full' width={isSlugPage ? 100 : 28} alt={siteConfig('AUTHOR')} />
                 </div>
             </div>
 
             <h2 className='text-3xl font-extrabold mt-3'>
-                {BLOG.AUTHOR}
+                {siteConfig('AUTHOR')}
             </h2>
 
             {/* 公告栏 */}
@@ -46,7 +46,7 @@ export function InfoCard(props) {
                         <Link href='/about'><GlobeAlt className={'w-6 h-6'} /></Link>
                     </div>
                     <div className='bg-indigo-400 p-2 rounded-full w-10 items-center flex justify-center transition-colors duration-200 dark:bg-yellow-500 dark:hover:bg-black hover:bg-white'>
-                        <Link href={CONFIG.INFO_CARD_URL}><i className='fab fa-github text-xl' />
+                        <Link href={siteConfig('HEO_INFO_CARD_URL', null, CONFIG)}><i className='fab fa-github text-xl' />
                         </Link>
                     </div>
                 </div>
@@ -60,7 +60,7 @@ export function InfoCard(props) {
  * 欢迎语
  */
 function GreetingsWords() {
-  const greetings = CONFIG.INFOCARD_GREETINGS
+  const greetings = siteConfig('HEO_INFOCARD_GREETINGS', null, CONFIG)
   const [greeting, setGreeting] = useState(greetings[0])
   // 每次点击，随机获取greetings中的一个
   const handleChangeGreeting = () => {
diff --git a/themes/heo/components/JumpToCommentButton.js b/themes/heo/components/JumpToCommentButton.js
index fb007712..3fa53a36 100644
--- a/themes/heo/components/JumpToCommentButton.js
+++ b/themes/heo/components/JumpToCommentButton.js
@@ -1,5 +1,5 @@
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到评论区
@@ -7,7 +7,7 @@ import CONFIG from '../config'
  * @constructor
  */
 const JumpToCommentButton = () => {
-  if (!CONFIG.WIDGET_TO_COMMENT) {
+  if (!siteConfig('HEO_WIDGET_TO_COMMENT', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/heo/components/JumpToTopButton.js b/themes/heo/components/JumpToTopButton.js
index 77313f46..0c775dac 100644
--- a/themes/heo/components/JumpToTopButton.js
+++ b/themes/heo/components/JumpToTopButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到网页顶部
@@ -13,7 +13,7 @@ import CONFIG from '../config'
 const JumpToTopButton = ({ showPercent = true, percent }) => {
   const { locale } = useGlobal()
 
-  if (!CONFIG.WIDGET_TO_TOP) {
+  if (!siteConfig('HEO_WIDGET_TO_TOP', null, CONFIG)) {
     return <></>
   }
   return (<div className='space-x-1 items-center justify-center transform hover:scale-105 duration-200 w-7 h-auto pb-1 text-center' onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })} >
diff --git a/themes/heo/components/LatestPostsGroup.js b/themes/heo/components/LatestPostsGroup.js
index 2a6077aa..7dc0ae01 100644
--- a/themes/heo/components/LatestPostsGroup.js
+++ b/themes/heo/components/LatestPostsGroup.js
@@ -1,5 +1,5 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 
 /**
@@ -22,7 +22,7 @@ const LatestPostsGroup = ({ latestPosts, siteInfo }) => {
           return (
             (<Link key={post.id} passHref
                     title={post.title}
-                    href={`${BLOG.SUB_PATH}/${post.slug}`}
+                    href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
 
                     className={'my-3 flex flex-col w-full'}>
 
diff --git a/themes/heo/components/LatestPostsGroupMini.js b/themes/heo/components/LatestPostsGroupMini.js
index 1f0575f6..ea45d3cb 100644
--- a/themes/heo/components/LatestPostsGroupMini.js
+++ b/themes/heo/components/LatestPostsGroupMini.js
@@ -1,5 +1,5 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 // import Image from 'next/image'
 import Link from 'next/link'
@@ -28,7 +28,7 @@ export default function LatestPostsGroupMini ({ latestPosts, siteInfo }) {
             </div>
         </div>
         {latestPosts.map(post => {
-          const selected = currentPath === `${BLOG.SUB_PATH}/${post.slug}`
+          const selected = currentPath === `${siteConfig('SUB_PATH', '')}/${post.slug}`
 
           const headerImage = post?.pageCoverThumbnail ? post.pageCoverThumbnail : siteInfo?.pageCover
 
@@ -36,7 +36,7 @@ export default function LatestPostsGroupMini ({ latestPosts, siteInfo }) {
             (<Link
                     key={post.id}
                     title={post.title}
-                    href={`${BLOG.SUB_PATH}/${post.slug}`}
+                    href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                     passHref
                     className={'my-3 flex'}>
 
diff --git a/themes/heo/components/Logo.js b/themes/heo/components/Logo.js
index b6321836..1de9ae3d 100644
--- a/themes/heo/components/Logo.js
+++ b/themes/heo/components/Logo.js
@@ -1,18 +1,17 @@
-import BLOG from '@/blog.config'
 import { Home } from '@/components/HeroIcons'
 import LazyImage from '@/components/LazyImage'
 import Link from 'next/link'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 const Logo = props => {
   const { siteInfo } = props
   return (
         <Link href='/' passHref legacyBehavior>
             <div className='flex flex-nowrap justify-center items-center cursor-pointer font-extrabold'>
-                <LazyImage src={siteInfo?.icon} width={24} height={24} alt={BLOG.AUTHOR} className='mr-4 hidden md:block' />
+                <LazyImage src={siteInfo?.icon} width={24} height={24} alt={siteConfig('AUTHOR')} className='mr-4 hidden md:block' />
                 <div id='logo-text' className='group rounded-2xl flex-none relative'>
                     <div className='group-hover:opacity-0 opacity-100 visible group-hover:invisible text-lg my-auto rounded dark:border-white duration-200'>
-                        {siteInfo?.title || BLOG.TITLE}
+                        {siteConfig('TITLE') }
                     </div>
                     <div className='flex justify-center rounded-2xl group-hover:bg-indigo-600 w-full group-hover:opacity-100 opacity-0 invisible group-hover:visible absolute top-0 py-1 duration-200'>
                         <Home className={'w-6 h-6 stroke-white stroke-2 '}/>
diff --git a/themes/heo/components/MenuGroupCard.js b/themes/heo/components/MenuGroupCard.js
index 39d509e4..53157875 100644
--- a/themes/heo/components/MenuGroupCard.js
+++ b/themes/heo/components/MenuGroupCard.js
@@ -1,4 +1,3 @@
-import React from 'react'
 import Link from 'next/link'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
@@ -11,9 +10,9 @@ const MenuGroupCard = (props) => {
   const tagSlot = <div className='text-center'>{tagOptions?.length}</div>
 
   const links = [
-    { name: locale.COMMON.ARTICLE, to: '/archive', slot: archiveSlot, show: CONFIG.MENU_ARCHIVE },
-    { name: locale.COMMON.CATEGORY, to: '/category', slot: categorySlot, show: CONFIG.MENU_CATEGORY },
-    { name: locale.COMMON.TAGS, to: '/tag', slot: tagSlot, show: CONFIG.MENU_TAG }
+    { name: locale.COMMON.ARTICLE, to: '/archive', slot: archiveSlot, show: siteConfig('HEO_MENU_ARCHIVE', null, CONFIG) },
+    { name: locale.COMMON.CATEGORY, to: '/category', slot: categorySlot, show: siteConfig('HEO_MENU_CATEGORY', null, CONFIG) },
+    { name: locale.COMMON.TAGS, to: '/tag', slot: tagSlot, show: siteConfig('HEO_MENU_TAG', null, CONFIG) }
   ]
 
   return (
diff --git a/themes/heo/components/MenuItemCollapse.js b/themes/heo/components/MenuItemCollapse.js
index 89b5f012..ab1472c1 100644
--- a/themes/heo/components/MenuItemCollapse.js
+++ b/themes/heo/components/MenuItemCollapse.js
@@ -42,8 +42,8 @@ export const MenuItemCollapse = ({ link }) => {
 
         {/* 折叠子菜单 */}
         {hasSubMenu && <Collapse isOpen={isOpen} className='rounded-xl'>
-            {link.subMenus.map(sLink => {
-              return <div key={sLink.id} className='dark:bg-black dark:text-gray-200 text-left px-3 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  py-3 pr-6'>
+            {link.subMenus.map((sLink, index) => {
+              return <div key={index} className='dark:bg-black dark:text-gray-200 text-left px-3 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  py-3 pr-6'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
                         <span className='text-sm ml-4 whitespace-nowrap'>{link?.icon && <i className={sLink.icon + ' mr-2'} />} {sLink.title}</span>
                     </Link>
diff --git a/themes/heo/components/MenuListSide.js b/themes/heo/components/MenuListSide.js
index 19f70863..dc364d43 100644
--- a/themes/heo/components/MenuListSide.js
+++ b/themes/heo/components/MenuListSide.js
@@ -1,6 +1,5 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemCollapse } from './MenuItemCollapse'
 import CONFIG from '../config'
 
@@ -9,10 +8,10 @@ export const MenuListSide = (props) => {
   const { locale } = useGlobal()
 
   let links = [
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('HEO_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('HEO_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('HEO_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('HEO_MENU_TAG', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -20,7 +19,7 @@ export const MenuListSide = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/heo/components/MenuListTop.js b/themes/heo/components/MenuListTop.js
index de6194cd..74d116a5 100644
--- a/themes/heo/components/MenuListTop.js
+++ b/themes/heo/components/MenuListTop.js
@@ -1,7 +1,6 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemDrop } from './MenuItemDrop'
 
 export const MenuListTop = (props) => {
@@ -9,9 +8,9 @@ export const MenuListTop = (props) => {
   const { locale } = useGlobal()
 
   let links = [
-    { id: 1, icon: 'fa-solid fa-house', name: locale.NAV.INDEX, to: '/', show: CONFIG.MENU_INDEX },
-    { id: 2, icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { id: 3, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE }
+    { id: 1, icon: 'fa-solid fa-house', name: locale.NAV.INDEX, to: '/', show: siteConfig('HEO_MENU_INDEX', null, CONFIG) },
+    { id: 2, icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('HEO_MENU_SEARCH', null, CONFIG) },
+    { id: 3, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('HEO_MENU_ARCHIVE', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -19,7 +18,7 @@ export const MenuListTop = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/heo/components/NavBar.js b/themes/heo/components/NavBar.js
index eff61f68..dba98b4b 100644
--- a/themes/heo/components/NavBar.js
+++ b/themes/heo/components/NavBar.js
@@ -8,7 +8,8 @@ import SlideOver from './SlideOver'
 import ReadingProgress from './ReadingProgress'
 import { MenuListTop } from './MenuListTop'
 import { isBrowser } from '@/lib/utils'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
+
 /**
  * 顶部导航
  * @param {*} param0
@@ -139,14 +140,14 @@ const NavBar = props => {
                 {/* 中间菜单 */}
                 <div id='nav-bar-swipe' className={`hidden lg:flex flex-grow flex-col items-center justify-center h-full relative w-full ${activeIndex === 0 ? 'fade-in-down' : 'fade-in-up'}`}>
                     {activeIndex === 0 && <MenuListTop {...props} />}
-                    {activeIndex === 1 && <h1 className='font-bold text-center text-light-400 dark:text-gray-400'>{BLOG.AUTHOR || BLOG.TITLE} {BLOG.BIO && <>|</>} {BLOG.BIO}</h1>}
+                    {activeIndex === 1 && <h1 className='font-bold text-center text-light-400 dark:text-gray-400'>{siteConfig('AUTHOR') || siteConfig('TITLE')} {siteConfig('BIO') && <>|</>} {siteConfig('BIO')}</h1>}
                 </div>
 
                 {/* 右侧固定 */}
                 <div className='flex flex-shrink-0 justify-center items-center'>
                     <RandomPostButton {...props} />
                     <SearchButton {...props}/>
-                    {!JSON.parse(BLOG.THEME_SWITCH) && <div className='hidden md:block'><DarkModeButton {...props} /></div>}
+                    {!JSON.parse(siteConfig('THEME_SWITCH')) && <div className='hidden md:block'><DarkModeButton {...props} /></div>}
                     <ReadingProgress />
 
                     {/* 移动端菜单按钮 */}
diff --git a/themes/heo/components/NavButtonGroup.js b/themes/heo/components/NavButtonGroup.js
index 2a3fc898..82331852 100644
--- a/themes/heo/components/NavButtonGroup.js
+++ b/themes/heo/components/NavButtonGroup.js
@@ -1,5 +1,3 @@
-
-import React from 'react'
 import Link from 'next/link'
 
 /**
@@ -15,7 +13,7 @@ const NavButtonGroup = (props) => {
 
   return (
     <nav id='home-nav-button' className={'w-full z-10 md:h-72 md:mt-6 xl:mt-32 px-5 py-2 mt-8 flex flex-wrap md:max-w-5xl space-y-2 md:space-y-1 md:flex justify-center max-h-80 overflow-auto'}>
-      {categoryOptions.map(category => {
+      {categoryOptions?.map(category => {
         return (
           <Link
             key={`${category.name}`}
diff --git a/themes/heo/components/NoticeBar.js b/themes/heo/components/NoticeBar.js
index b4af5086..064a3844 100644
--- a/themes/heo/components/NoticeBar.js
+++ b/themes/heo/components/NoticeBar.js
@@ -2,12 +2,13 @@
 import { ArrowRightCircle } from '@/components/HeroIcons'
 import CONFIG from '../config'
 import Swipe from './Swipe'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 通知横幅
  */
 export function NoticeBar() {
-  const notices = CONFIG.NOTICE_BAR
+  const notices = siteConfig('HEO_NOTICE_BAR', null, CONFIG)
 
   if (!notices || notices?.length === 0) {
     return <></>
diff --git a/themes/heo/components/PostHeader.js b/themes/heo/components/PostHeader.js
index c7f47b5c..d0a20578 100644
--- a/themes/heo/components/PostHeader.js
+++ b/themes/heo/components/PostHeader.js
@@ -1,5 +1,5 @@
 import Link from 'next/link'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import NotionIcon from '@/components/NotionIcon'
 import WavesArea from './WavesArea'
 import { HashTag } from '@/components/HeroIcons'
@@ -90,7 +90,7 @@ export default function PostHeader({ post, siteInfo }) {
 
                         </div>
 
-                        {JSON.parse(BLOG.ANALYTICS_BUSUANZI_ENABLE) && <div className="busuanzi_container_page_pv font-light mr-2">
+                        {JSON.parse(siteConfig('ANALYTICS_BUSUANZI_ENABLE')) && <div className="busuanzi_container_page_pv font-light mr-2">
                             <i className="fa-solid fa-fire-flame-curved"></i> <span className="mr-2 busuanzi_value_page_pv" />
                         </div>}
                     </section>
diff --git a/themes/heo/components/RandomPostButton.js b/themes/heo/components/RandomPostButton.js
index a8a0597f..a791f0f8 100644
--- a/themes/heo/components/RandomPostButton.js
+++ b/themes/heo/components/RandomPostButton.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 
@@ -15,7 +15,7 @@ export default function RandomPostButton(props) {
   function handleClick() {
     const randomIndex = Math.floor(Math.random() * latestPosts.length)
     const randomPost = latestPosts[randomIndex]
-    router.push(`${BLOG.SUB_PATH}/${randomPost?.slug}`)
+    router.push(`${siteConfig('SUB_PATH', '')}/${randomPost?.slug}`)
   }
 
   return (
diff --git a/themes/heo/components/SearchButton.js b/themes/heo/components/SearchButton.js
index e9e253db..d0dfe64d 100644
--- a/themes/heo/components/SearchButton.js
+++ b/themes/heo/components/SearchButton.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import AlgoliaSearchModal from '@/components/AlgoliaSearchModal'
@@ -14,7 +14,7 @@ export default function SearchButton(props) {
   const searchModal = useRef(null)
 
   function handleSearch() {
-    if (BLOG.ALGOLIA_APP_ID) {
+    if (siteConfig('ALGOLIA_APP_ID')) {
       searchModal.current.openSearch()
     } else {
       router.push('/search')
diff --git a/themes/heo/components/SideBar.js b/themes/heo/components/SideBar.js
index cb7427ac..b6f89413 100644
--- a/themes/heo/components/SideBar.js
+++ b/themes/heo/components/SideBar.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import LazyImage from '@/components/LazyImage'
 import { useRouter } from 'next/router'
 import MenuGroupCard from './MenuGroupCard'
@@ -21,7 +21,7 @@ const SideBar = (props) => {
                     <div onClick={() => { router.push('/') }}
                         className='justify-center items-center flex hover:rotate-45 py-6 hover:scale-105 dark:text-gray-100  transform duration-200 cursor-pointer'>
                         {/* eslint-disable-next-line @next/next/no-img-element */}
-                        <LazyImage src={siteInfo?.icon} className='rounded-full' width={80} alt={BLOG.AUTHOR} />
+                        <LazyImage src={siteInfo?.icon} className='rounded-full' width={80} alt={siteConfig('AUTHOR')} />
                     </div>
                     <MenuGroupCard {...props} />
                 </div>
diff --git a/themes/heo/components/SocialButton.js b/themes/heo/components/SocialButton.js
index e684d325..c13cab43 100644
--- a/themes/heo/components/SocialButton.js
+++ b/themes/heo/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -9,34 +8,34 @@ import React from 'react'
 const SocialButton = () => {
   return <div className='w-full justify-center flex-wrap flex'>
     <div className='space-x-12 text-3xl text-gray-600 dark:text-gray-300 '>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {siteConfig('CONTACT_GITHUB') && <a target='_blank' rel='noreferrer' title={'github'} href={siteConfig('CONTACT_GITHUB')} >
         <i className='transform hover:scale-125 duration-150 fab fa-github dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='transform hover:scale-125 duration-150 fab fa-twitter dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='transform hover:scale-125 duration-150 fab fa-telegram dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkIn'} >
         <i className='transform hover:scale-125 duration-150 fab fa-linkedin dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='transform hover:scale-125 duration-150 fab fa-weibo dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='transform hover:scale-125 duration-150 fab fa-instagram dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='transform hover:scale-125 duration-150 fas fa-envelope dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='transform hover:scale-125 duration-150 fas fa-rss dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+      {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
         <i className='transform hover:scale-125 duration-150 fab fa-bilibili dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+      {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
         <i className='transform hover:scale-125 duration-150 fab fa-youtube dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
     </div>
diff --git a/themes/heo/components/TocDrawerButton.js b/themes/heo/components/TocDrawerButton.js
index 8e5053b6..179c257b 100644
--- a/themes/heo/components/TocDrawerButton.js
+++ b/themes/heo/components/TocDrawerButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 点击召唤目录抽屉
@@ -11,7 +11,7 @@ import CONFIG from '../config'
  */
 const TocDrawerButton = (props) => {
   const { locale } = useGlobal()
-  if (!CONFIG.WIDGET_TOC) {
+  if (!siteConfig('HEO_WIDGET_TOC', null, CONFIG)) {
     return <></>
   }
   return (<div onClick={props.onClick} className='py-2 px-3 cursor-pointer transform duration-200 flex justify-center items-center w-7 h-7 text-center' title={locale.POST.TOP} >
diff --git a/themes/heo/components/TouchMeCard.js b/themes/heo/components/TouchMeCard.js
index f51bcb92..2388a9a5 100644
--- a/themes/heo/components/TouchMeCard.js
+++ b/themes/heo/components/TouchMeCard.js
@@ -2,13 +2,14 @@
 import FlipCard from '@/components/FlipCard'
 import Link from 'next/link'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 交流频道
  * @returns
  */
 export default function TouchMeCard() {
-  if (!JSON.parse(CONFIG.SOCIAL_CARD)) {
+  if (!JSON.parse(siteConfig('HEO_SOCIAL_CARD', null, CONFIG))) {
     return <></>
   }
   return (
@@ -18,13 +19,13 @@ export default function TouchMeCard() {
                 className='cursor-pointer lg:p-6 p-4 border rounded-xl bg-[#4f65f0] dark:bg-yellow-600 dark:border-gray-600'
                 frontContent={
                     <div className='h-full'>
-                        <h2 className='font-[1000] text-3xl'>{CONFIG.SOCIAL_CARD_TITLE_1}</h2>
-                        <h3 className='pt-2'>{CONFIG.SOCIAL_CARD_TITLE_2}</h3>
+                        <h2 className='font-[1000] text-3xl'>{siteConfig('HEO_SOCIAL_CARD_TITLE_1', null, CONFIG)}</h2>
+                        <h3 className='pt-2'>{siteConfig('HEO_SOCIAL_CARD_TITLE_2', null, CONFIG)}</h3>
                         <div className='absolute left-0 top-0 w-full h-full' style={{ background: 'url(https://bu.dusays.com/2023/05/16/64633c4cd36a9.png) center center no-repeat' }}></div>
                     </div>}
-                backContent={<Link href={CONFIG.SOCIAL_CARD_URL}>
+                backContent={<Link href={siteConfig('HEO_SOCIAL_CARD_URL', null, CONFIG)}>
                     <div className='font-[1000] text-xl h-full'>
-                        {CONFIG.SOCIAL_CARD_TITLE_3}
+                        {siteConfig('HEO_SOCIAL_CARD_TITLE_3', null, CONFIG)}
                     </div>
                 </Link>}
             />
diff --git a/themes/heo/config.js b/themes/heo/config.js
index a979621c..ee24656c 100644
--- a/themes/heo/config.js
+++ b/themes/heo/config.js
@@ -1,34 +1,34 @@
 const CONFIG = {
-  HOME_BANNER_ENABLE: true,
+  HEO_HOME_BANNER_ENABLE: true,
 
-  SITE_CREATE_TIME: '2021-09-21', // 建站日期，用于计算网站运行的第几天
+  HEO_SITE_CREATE_TIME: '2021-09-21', // 建站日期，用于计算网站运行的第几天
 
   // 首页顶部通知条滚动内容，如不需要可以留空 []
-  NOTICE_BAR: [
+  HEO_NOTICE_BAR: [
     { title: '欢迎来到我的博客', url: 'https://blog.tangly1024.com' },
     { title: '访问文档中心获取更多帮助', url: 'https://docs.tangly1024.com' }
   ],
 
   // 英雄区(首页顶部大卡)
-  HERO_TITLE_1: '分享编程',
-  HERO_TITLE_2: '与思维认知',
-  HERO_TITLE_3: 'TANGLY1024.COM',
-  HERO_TITLE_4: '新版上线',
-  HERO_TITLE_5: 'NotionNext4.0 轻松定制主题',
-  HERO_TITLE_LINK: 'https://tangly1024.com',
+  HEO_HERO_TITLE_1: '分享编程',
+  HEO_HERO_TITLE_2: '与思维认知',
+  HEO_HERO_TITLE_3: 'TANGLY1024.COM',
+  HEO_HERO_TITLE_4: '新版上线',
+  HEO_HERO_TITLE_5: 'NotionNext4.0 轻松定制主题',
+  HEO_HERO_TITLE_LINK: 'https://tangly1024.com',
 
   // 英雄区显示三个置顶分类
-  HERO_CATEGORY_1: { title: '必看精选', url: '/tag/必看精选' },
-  HERO_CATEGORY_2: { title: '热门文章', url: '/tag/热门文章' },
-  HERO_CATEGORY_3: { title: '实用教程', url: '/tag/实用教程' },
+  HEO_HERO_CATEGORY_1: { title: '必看精选', url: '/tag/必看精选' },
+  HEO_HERO_CATEGORY_2: { title: '热门文章', url: '/tag/热门文章' },
+  HEO_HERO_CATEGORY_3: { title: '实用教程', url: '/tag/实用教程' },
 
   // 英雄区右侧推荐文章标签, 例如 [推荐] , 最多六篇文章; 若留空白''，则推荐最近更新文章
-  HERO_RECOMMEND_POST_TAG: '推荐',
-  HERO_RECOMMEND_POST_SORT_BY_UPDATE_TIME: false, // 推荐文章排序，为`true`时将强制按最后修改时间倒序
+  HEO_HERO_RECOMMEND_POST_TAG: '推荐',
+  HEO_HERO_RECOMMEND_POST_SORT_BY_UPDATE_TIME: false, // 推荐文章排序，为`true`时将强制按最后修改时间倒序
   //   HERO_RECOMMEND_COVER: 'https://cdn.pixabay.com/photo/2015/10/30/20/13/sunrise-1014712_1280.jpg', // 英雄区右侧图片
 
   // 右侧个人资料卡牌欢迎语，点击可自动切换
-  INFOCARD_GREETINGS: [
+  HEO_INFOCARD_GREETINGS: [
     '你好！我是',
     '🔍 分享与热心帮助',
     '🤝 专修交互与设计',
@@ -37,10 +37,10 @@ const CONFIG = {
     '🤖️ 数码科技爱好者',
     '🧱 团队小组发动机'
   ],
-  INFO_CARD_URL: 'https://github.com/tangly1024/NotionNext', // 个人资料底部按钮链接
+  HEO_INFO_CARD_URL: 'https://github.com/tangly1024/NotionNext', // 个人资料底部按钮链接
 
   // 用户技能图标
-  GROUP_ICONS: [
+  HEO_GROUP_ICONS: [
     {
       title_1: 'AfterEffect',
       img_1: '/images/heo/20239df3f66615b532ce571eac6d14ff21cf072602.webp',
@@ -99,37 +99,37 @@ const CONFIG = {
     }
   ],
 
-  SOCIAL_CARD: true, // 是否显示右侧，点击加入社群按钮
-  SOCIAL_CARD_TITLE_1: '交流频道',
-  SOCIAL_CARD_TITLE_2: '加入我们的社群讨论分享',
-  SOCIAL_CARD_TITLE_3: '点击加入社群',
-  SOCIAL_CARD_URL: 'https://docs.tangly1024.com/article/how-to-question',
+  HEO_SOCIAL_CARD: true, // 是否显示右侧，点击加入社群按钮
+  HEO_SOCIAL_CARD_TITLE_1: '交流频道',
+  HEO_SOCIAL_CARD_TITLE_2: '加入我们的社群讨论分享',
+  HEO_SOCIAL_CARD_TITLE_3: '点击加入社群',
+  HEO_SOCIAL_CARD_URL: 'https://docs.tangly1024.com/article/how-to-question',
 
   // *****  以下配置无效，只是预留开发 ****
   // 菜单配置
-  MENU_INDEX: true, // 显示首页
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  HEO_MENU_INDEX: true, // 显示首页
+  HEO_MENU_CATEGORY: true, // 显示分类
+  HEO_MENU_TAG: true, // 显示标签
+  HEO_MENU_ARCHIVE: true, // 显示归档
+  HEO_MENU_SEARCH: true, // 显示搜索
 
-  POST_LIST_COVER: true, // 列表显示文章封面
-  POST_LIST_COVER_HOVER_ENLARGE: false, // 列表鼠标悬停放大
+  HEO_POST_LIST_COVER: true, // 列表显示文章封面
+  HEO_POST_LIST_COVER_HOVER_ENLARGE: false, // 列表鼠标悬停放大
 
-  POST_LIST_COVER_DEFAULT: true, // 封面为空时用站点背景做默认封面
-  POST_LIST_SUMMARY: true, // 文章摘要
-  POST_LIST_PREVIEW: false, // 读取文章预览
-  POST_LIST_IMG_CROSSOVER: true, // 博客列表图片左右交错
+  HEO_POST_LIST_COVER_DEFAULT: true, // 封面为空时用站点背景做默认封面
+  HEO_POST_LIST_SUMMARY: true, // 文章摘要
+  HEO_POST_LIST_PREVIEW: false, // 读取文章预览
+  HEO_POST_LIST_IMG_CROSSOVER: true, // 博客列表图片左右交错
 
-  ARTICLE_ADJACENT: true, // 显示上一篇下一篇文章推荐
-  ARTICLE_COPYRIGHT: true, // 显示文章版权声明
-  ARTICLE_RECOMMEND: true, // 文章关联推荐
+  HEO_ARTICLE_ADJACENT: true, // 显示上一篇下一篇文章推荐
+  HEO_ARTICLE_COPYRIGHT: true, // 显示文章版权声明
+  HEO_ARTICLE_RECOMMEND: true, // 文章关联推荐
 
-  WIDGET_LATEST_POSTS: true, // 显示最新文章卡
-  WIDGET_ANALYTICS: false, // 显示统计卡
-  WIDGET_TO_TOP: true,
-  WIDGET_TO_COMMENT: true, // 跳到评论区
-  WIDGET_DARK_MODE: true, // 夜间模式
-  WIDGET_TOC: true // 移动端悬浮目录
+  HEO_WIDGET_LATEST_POSTS: true, // 显示最新文章卡
+  HEO_WIDGET_ANALYTICS: false, // 显示统计卡
+  HEO_WIDGET_TO_TOP: true,
+  HEO_WIDGET_TO_COMMENT: true, // 跳到评论区
+  HEO_WIDGET_DARK_MODE: true, // 夜间模式
+  HEO_WIDGET_TOC: true // 移动端悬浮目录
 }
 export default CONFIG
diff --git a/themes/heo/index.js b/themes/heo/index.js
index 5ffce600..4d289924 100644
--- a/themes/heo/index.js
+++ b/themes/heo/index.js
@@ -13,7 +13,6 @@ import Footer from './components/Footer'
 import SideRight from './components/SideRight'
 import NavBar from './components/NavBar'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import BlogPostListPage from './components/BlogPostListPage'
 import BlogPostListScroll from './components/BlogPostListScroll'
 import Hero from './components/Hero'
@@ -22,7 +21,7 @@ import SearchNav from './components/SearchNav'
 import BlogPostArchive from './components/BlogPostArchive'
 import { ArticleLock } from './components/ArticleLock'
 import PostHeader from './components/PostHeader'
-import Comment, { commentEnable } from '@/components/Comment'
+import Comment from '@/components/Comment'
 import NotionPage from '@/components/NotionPage'
 import ArticleAdjacent from './components/ArticleAdjacent'
 import ArticleCopyright from './components/ArticleCopyright'
@@ -40,6 +39,7 @@ import replaceSearchResult from '@/components/Mark'
 import LazyImage from '@/components/LazyImage'
 import WWAds from '@/components/WWAds'
 import { AdSlot } from '@/components/GoogleAdsense'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 基础布局 采用上中下布局，移动端使用顶部侧边导航栏
@@ -53,7 +53,6 @@ const LayoutBase = props => {
     headerSlot,
     slotTop,
     slotRight,
-    siteInfo,
     className,
     meta
   } = props
@@ -95,7 +94,7 @@ const LayoutBase = props => {
       </main>
 
       {/* 页脚 */}
-      <Footer title={siteInfo?.title || BLOG.TITLE} />
+      <Footer title={siteConfig('TITLE')} />
     </div>
   )
 }
@@ -130,7 +129,7 @@ const LayoutIndex = props => {
       <div id="post-outer-wrapper" className="px-5 md:px-0">
         {/* 文章分类条 */}
         <CategoryBar {...props} />
-        {BLOG.POST_LIST_STYLE === 'page'
+        {siteConfig('POST_LIST_STYLE') === 'page'
           ? (
           <BlogPostListPage {...props} />
             )
@@ -164,7 +163,7 @@ const LayoutPostList = props => {
       <div id="post-outer-wrapper" className="px-5  md:px-0">
         {/* 文章分类条 */}
         <CategoryBar {...props} />
-        {BLOG.POST_LIST_STYLE === 'page'
+        {siteConfig('POST_LIST_STYLE') === 'page'
           ? (
           <BlogPostListPage {...props} />
             )
@@ -223,7 +222,7 @@ const LayoutSearch = props => {
             )
           : (
           <div id="posts-wrapper">
-            {BLOG.POST_LIST_STYLE === 'page'
+            {siteConfig('POST_LIST_STYLE') === 'page'
               ? (
               <BlogPostListPage {...props} />
                 )
@@ -311,6 +310,9 @@ const LayoutSlug = props => {
       <PostHeader {...props} />
     </header>
   )
+  const commentEnable = siteConfig('COMMENT_TWIKOO_ENV_ID') || siteConfig('COMMENT_WALINE_SERVER_URL') || siteConfig('COMMENT_VALINE_APP_ID') ||
+        siteConfig('COMMENT_GISCUS_REPO') || siteConfig('COMMENT_CUSDIS_APP_ID') || siteConfig('COMMENT_UTTERRANCES_REPO') ||
+        siteConfig('COMMENT_GITALK_CLIENT_ID') || siteConfig('COMMENT_WEBMENTION_ENABLE')
 
   return (
     <LayoutBase
@@ -483,7 +485,7 @@ const LayoutCategoryIndex = props => {
           id="category-list"
           className="duration-200 flex flex-wrap m-10 justify-center"
         >
-          {categoryOptions.map(category => {
+          {categoryOptions?.map(category => {
             return (
               <Link
                 key={category.name}
diff --git a/themes/hexo/components/ArticleAdjacent.js b/themes/hexo/components/ArticleAdjacent.js
index 21ca9e32..dc6a5b99 100644
--- a/themes/hexo/components/ArticleAdjacent.js
+++ b/themes/hexo/components/ArticleAdjacent.js
@@ -1,5 +1,6 @@
 import Link from 'next/link'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 上一篇，下一篇文章
@@ -7,7 +8,7 @@ import CONFIG from '../config'
  * @returns
  */
 export default function ArticleAdjacent ({ prev, next }) {
-  if (!prev || !next || !CONFIG.ARTICLE_ADJACENT) {
+  if (!prev || !next || !siteConfig('HEXO_ARTICLE_ADJACENT', null, CONFIG)) {
     return <></>
   }
   return (
diff --git a/themes/hexo/components/ArticleCopyright.js b/themes/hexo/components/ArticleCopyright.js
index 4664573c..af3808a2 100644
--- a/themes/hexo/components/ArticleCopyright.js
+++ b/themes/hexo/components/ArticleCopyright.js
@@ -1,28 +1,30 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function ArticleCopyright () {
-  if (!CONFIG.ARTICLE_COPYRIGHT) {
-    return <></>
-  }
   const router = useRouter()
-  const [path, setPath] = useState(BLOG.LINK + router.asPath)
+  const [path, setPath] = useState(siteConfig('LINK') + router.asPath)
   useEffect(() => {
     setPath(window.location.href)
   })
 
   const { locale } = useGlobal()
+
+  if (!siteConfig('HEXO_ARTICLE_COPYRIGHT', null, CONFIG)) {
+    return <></>
+  }
+
   return (
     <section className="dark:text-gray-300 mt-6 mx-1 ">
       <ul className="overflow-x-auto whitespace-nowrap text-sm dark:bg-gray-900 bg-gray-100 p-5 leading-8 border-l-2 border-indigo-500">
         <li>
           <strong className='mr-2'>{locale.COMMON.AUTHOR}:</strong>
           <Link href={'/about'} className="hover:underline">
-            {BLOG.AUTHOR}
+            {siteConfig('AUTHOR')}
           </Link>
         </li>
         <li>
diff --git a/themes/hexo/components/ArticleRecommend.js b/themes/hexo/components/ArticleRecommend.js
index dc5ef58e..e773db4e 100644
--- a/themes/hexo/components/ArticleRecommend.js
+++ b/themes/hexo/components/ArticleRecommend.js
@@ -1,6 +1,6 @@
 import Link from 'next/link'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import LazyImage from '@/components/LazyImage'
 
@@ -13,7 +13,7 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
   const { locale } = useGlobal()
 
   if (
-    !CONFIG.ARTICLE_RECOMMEND ||
+    !siteConfig('HEXO_ARTICLE_RECOMMEND', null, CONFIG) ||
         !recommendPosts ||
         recommendPosts.length === 0
   ) {
@@ -38,7 +38,7 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
                     (<Link
                             key={post.id}
                             title={post.title}
-                            href={`${BLOG.SUB_PATH}/${post.slug}`}
+                            href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                             passHref
                             className="flex h-40 cursor-pointer overflow-hidden">
 
diff --git a/themes/hexo/components/BlogPostArchive.js b/themes/hexo/components/BlogPostArchive.js
index ea3c6cd2..0eec29f5 100644
--- a/themes/hexo/components/BlogPostArchive.js
+++ b/themes/hexo/components/BlogPostArchive.js
@@ -1,6 +1,6 @@
-import React from 'react'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
+
 /**
  * 博客归档列表
  * @param posts 所有文章
@@ -30,7 +30,7 @@ const BlogPostArchive = ({ posts = [], archiveTitle }) => {
                 <span className="text-gray-400">{post.date?.start_date}</span>{' '}
                 &nbsp;
                 <Link
-                  href={`${BLOG.SUB_PATH}/${post.slug}`}
+                  href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                   passHref
                   className="dark:text-gray-400  dark:hover:text-indigo-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
 
diff --git a/themes/hexo/components/BlogPostCard.js b/themes/hexo/components/BlogPostCard.js
index f1febbdd..ee21c056 100644
--- a/themes/hexo/components/BlogPostCard.js
+++ b/themes/hexo/components/BlogPostCard.js
@@ -1,22 +1,21 @@
 import Link from 'next/link'
-import React from 'react'
 import CONFIG from '../config'
 import { BlogPostCardInfo } from './BlogPostCardInfo'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import LazyImage from '@/components/LazyImage'
 // import Image from 'next/image'
 
 const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
-  const showPreview = CONFIG.POST_LIST_PREVIEW && post.blockMap
-  if (post && !post.pageCoverThumbnail && CONFIG.POST_LIST_COVER_DEFAULT) {
+  const showPreview = siteConfig('HEXO_POST_LIST_PREVIEW', null, CONFIG) && post.blockMap
+  if (post && !post.pageCoverThumbnail && siteConfig('HEXO_POST_LIST_COVER_DEFAULT', null, CONFIG)) {
     post.pageCoverThumbnail = siteInfo?.pageCover
   }
-  const showPageCover = CONFIG.POST_LIST_COVER && post?.pageCoverThumbnail && !showPreview
+  const showPageCover = siteConfig('HEXO_POST_LIST_COVER', null, CONFIG) && post?.pageCoverThumbnail && !showPreview
   //   const delay = (index % 2) * 200
 
   return (
 
-        <div className={`${CONFIG.POST_LIST_COVER_HOVER_ENLARGE ? ' hover:scale-110 transition-all duration-150' : ''}`} >
+        <div className={`${siteConfig('HEXO_POST_LIST_COVER_HOVER_ENLARGE', null, CONFIG) ? ' hover:scale-110 transition-all duration-150' : ''}`} >
             <div key={post.id}
                 data-aos="fade-up"
                 data-aos-easing="ease-in-out"
@@ -24,7 +23,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
                 data-aos-once="false"
                 data-aos-anchor-placement="top-bottom"
                 id='blog-post-card'
-                className={`group md:h-56 w-full flex justify-between md:flex-row flex-col-reverse ${CONFIG.POST_LIST_IMG_CROSSOVER && index % 2 === 1 ? 'md:flex-row-reverse' : ''}
+                className={`group md:h-56 w-full flex justify-between md:flex-row flex-col-reverse ${siteConfig('HEXO_POST_LIST_IMG_CROSSOVER', null, CONFIG) && index % 2 === 1 ? 'md:flex-row-reverse' : ''}
                     overflow-hidden border dark:border-black rounded-xl bg-white dark:bg-hexo-black-gray`}>
 
                 {/* 文字内容 */}
@@ -33,7 +32,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
                 {/* 图片封面 */}
                 {showPageCover && (
                     <div className="md:w-5/12 overflow-hidden">
-                        <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
+                        <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
                         <LazyImage priority={index === 1} src={post?.pageCoverThumbnail} className='h-56 w-full object-cover object-center group-hover:scale-110 duration-500' />
                         </Link>
                     </div>
diff --git a/themes/hexo/components/BlogPostCardInfo.js b/themes/hexo/components/BlogPostCardInfo.js
index e09ee96e..e7636de9 100644
--- a/themes/hexo/components/BlogPostCardInfo.js
+++ b/themes/hexo/components/BlogPostCardInfo.js
@@ -2,7 +2,7 @@ import NotionPage from '@/components/NotionPage'
 import Link from 'next/link'
 import TagItemMini from './TagItemMini'
 import TwikooCommentCount from '@/components/TwikooCommentCount'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { formatDateFmt } from '@/lib/formatDate'
 
 /**
@@ -15,7 +15,7 @@ export const BlogPostCardInfo = ({ post, showPreview, showPageCover, showSummary
        <div>
          {/* 标题 */}
          <Link
-            href={`${BLOG.SUB_PATH}/${post.slug}`}
+            href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
             passHref
             className={`line-clamp-2 replace cursor-pointer text-2xl ${showPreview ? 'text-center' : ''
                 } leading-tight font-normal text-gray-600 dark:text-gray-100 hover:text-indigo-700 dark:hover:text-indigo-400`}>
diff --git a/themes/hexo/components/BlogPostListPage.js b/themes/hexo/components/BlogPostListPage.js
index 92008f83..d5c3d84c 100644
--- a/themes/hexo/components/BlogPostListPage.js
+++ b/themes/hexo/components/BlogPostListPage.js
@@ -1,6 +1,6 @@
 import BlogPostCard from './BlogPostCard'
 import PaginationNumber from './PaginationNumber'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import BlogPostListEmpty from './BlogPostListEmpty'
 
 /**
@@ -12,8 +12,8 @@ import BlogPostListEmpty from './BlogPostListEmpty'
  * @constructor
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
-  const showPagination = postCount >= BLOG.POSTS_PER_PAGE
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+  const showPagination = postCount >= parseInt(siteConfig('POSTS_PER_PAGE'))
   if (!posts || posts.length === 0 || page > totalPage) {
     return <BlogPostListEmpty />
   } else {
diff --git a/themes/hexo/components/BlogPostListScroll.js b/themes/hexo/components/BlogPostListScroll.js
index 7646b056..c92c0b55 100644
--- a/themes/hexo/components/BlogPostListScroll.js
+++ b/themes/hexo/components/BlogPostListScroll.js
@@ -1,8 +1,8 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import BlogPostCard from './BlogPostCard'
 import BlogPostListEmpty from './BlogPostListEmpty'
 import { useGlobal } from '@/lib/global'
-import React from 'react'
+import { useEffect, useRef, useState } from 'react'
 import CONFIG from '../config'
 import { getListByPage } from '@/lib/utils'
 
@@ -13,9 +13,9 @@ import { getListByPage } from '@/lib/utils'
  * @returns {JSX.Element}
  * @constructor
  */
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.POST_LIST_SUMMARY, siteInfo }) => {
-  const postsPerPage = BLOG.POSTS_PER_PAGE
-  const [page, updatePage] = React.useState(1)
+const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('HEXO_POST_LIST_SUMMARY', null, CONFIG), siteInfo }) => {
+  const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+  const [page, updatePage] = useState(1)
   const postsToShow = getListByPage(posts, page, postsPerPage)
 
   let hasMore = false
@@ -41,14 +41,14 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.PO
   }
 
   // 监听滚动
-  React.useEffect(() => {
+  useEffect(() => {
     window.addEventListener('scroll', scrollTrigger)
     return () => {
       window.removeEventListener('scroll', scrollTrigger)
     }
   })
 
-  const targetRef = React.useRef(null)
+  const targetRef = useRef(null)
   const { locale } = useGlobal()
 
   if (!postsToShow || postsToShow.length === 0) {
diff --git a/themes/hexo/components/CategoryGroup.js b/themes/hexo/components/CategoryGroup.js
index c88df60a..69aa4c1c 100644
--- a/themes/hexo/components/CategoryGroup.js
+++ b/themes/hexo/components/CategoryGroup.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 const CategoryGroup = ({ currentCategory, categories }) => {
   if (!categories) {
diff --git a/themes/hexo/components/FloatDarkModeButton.js b/themes/hexo/components/FloatDarkModeButton.js
index f693d1f0..d5848b06 100644
--- a/themes/hexo/components/FloatDarkModeButton.js
+++ b/themes/hexo/components/FloatDarkModeButton.js
@@ -1,11 +1,12 @@
 import { useGlobal } from '@/lib/global'
 import { saveDarkModeToCookies } from '@/themes/theme'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function FloatDarkModeButton () {
   const { isDarkMode, updateDarkMode } = useGlobal()
 
-  if (!CONFIG.WIDGET_DARK_MODE) {
+  if (!siteConfig('HEXO_WIDGET_DARK_MODE', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/hexo/components/Footer.js b/themes/hexo/components/Footer.js
index 8025e7b9..053faac3 100644
--- a/themes/hexo/components/Footer.js
+++ b/themes/hexo/components/Footer.js
@@ -1,16 +1,10 @@
-import React from 'react'
-import BLOG from '@/blog.config'
-// import DarkModeButton from '@/components/DarkModeButton'
+import { siteConfig } from '@/lib/config'
 
 const Footer = ({ title }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return (
     <footer
@@ -18,16 +12,16 @@ const Footer = ({ title }) => {
     >
       {/* <DarkModeButton/> */}
 
-      <i className='fas fa-copyright' /> {`${copyrightDate}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={BLOG.LINK} className='underline font-bold  dark:text-gray-300 '>{BLOG.AUTHOR}</a>.<br/>
+      <i className='fas fa-copyright' /> {`${copyrightDate}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={siteConfig('LINK')} className='underline font-bold  dark:text-gray-300 '>{siteConfig('AUTHOR')}</a>.<br/>
 
-      {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
+      {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a><br/></>}
 
       <span className='hidden busuanzi_container_site_pv'>
             <i className='fas fa-eye'/><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
       <span className='pl-2 hidden busuanzi_container_site_uv'>
         <i className='fas fa-users'/> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
-        <h1 className='text-xs pt-4 text-light-400 dark:text-gray-400'>{title} {BLOG.BIO && <>|</>} {BLOG.BIO}</h1>
-        <p className='text-xs pt-2 text-light-500 dark:text-gray-500'>Powered by <a href='https://github.com/tangly1024/NotionNext' className='dark:text-gray-300'>NotionNext {BLOG.VERSION}</a>.</p></span><br/>
+        <h1 className='text-xs pt-4 text-light-400 dark:text-gray-400'>{title} {siteConfig('BIO') && <>|</>} {siteConfig('BIO')}</h1>
+        <p className='text-xs pt-2 text-light-500 dark:text-gray-500'>Powered by <a href='https://github.com/tangly1024/NotionNext' className='dark:text-gray-300'>NotionNext {siteConfig('VERSION')}</a>.</p></span><br/>
 
     </footer>
   )
diff --git a/themes/hexo/components/Hero.js b/themes/hexo/components/Hero.js
index ad28362f..6c7bb17a 100644
--- a/themes/hexo/components/Hero.js
+++ b/themes/hexo/components/Hero.js
@@ -4,8 +4,8 @@ import Typed from 'typed.js'
 import CONFIG from '../config'
 import NavButtonGroup from './NavButtonGroup'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 
 let wrapperTop = 0
 
@@ -20,13 +20,14 @@ const Hero = props => {
   const scrollToWrapper = () => {
     window.scrollTo({ top: wrapperTop, behavior: 'smooth' })
   }
+  const GREETING_WORDS = siteConfig('GREETING_WORDS').split(',')
   useEffect(() => {
     updateHeaderHeight()
 
     if (!typed && window && document.getElementById('typed')) {
       changeType(
         new Typed('#typed', {
-          strings: BLOG.GREETING_WORDS.split(','),
+          strings: GREETING_WORDS,
           typeSpeed: 200,
           backSpeed: 100,
           backDelay: 400,
@@ -57,24 +58,24 @@ const Hero = props => {
 
             <div className="text-white absolute bottom-0 flex flex-col h-full items-center justify-center w-full ">
                 {/* 站点标题 */}
-                <div className='font-black text-4xl md:text-5xl shadow-text'>{siteInfo?.title}</div>
+                <div className='font-black text-4xl md:text-5xl shadow-text'>{siteConfig('TITLE')}</div>
                 {/* 站点欢迎语 */}
                 <div className='mt-2 h-12 items-center text-center font-medium shadow-text text-lg'>
                     <span id='typed' />
                 </div>
 
                 {/* 首页导航大按钮 */}
-                {CONFIG.HOME_NAV_BUTTONS && <NavButtonGroup {...props} />}
+                {siteConfig('HEXO_HOME_NAV_BUTTONS', null, CONFIG) && <NavButtonGroup {...props} />}
 
                 {/* 滚动按钮 */}
                 <div onClick={scrollToWrapper} className="z-10 cursor-pointer w-full text-center py-4 text-3xl absolute bottom-10 text-white">
-                    <div className="opacity-70 animate-bounce text-xs">{CONFIG.SHOW_START_READING && locale.COMMON.START_READING}</div>
+                    <div className="opacity-70 animate-bounce text-xs">{siteConfig('HEXO_SHOW_START_READING', null, CONFIG) && locale.COMMON.START_READING}</div>
                     <i className='opacity-70 animate-bounce fas fa-angle-down' />
                 </div>
             </div>
 
             <LazyImage id='header-cover' src={siteInfo?.pageCover}
-                className={`header-cover w-full h-screen object-cover object-center ${CONFIG.HOME_NAV_BACKGROUND_IMG_FIXED ? 'fixed' : ''}`} />
+                className={`header-cover w-full h-screen object-cover object-center ${siteConfig('HEXO_HOME_NAV_BACKGROUND_IMG_FIXED', null, CONFIG) ? 'fixed' : ''}`} />
 
         </header>
   )
diff --git a/themes/hexo/components/HexoRecentComments.js b/themes/hexo/components/HexoRecentComments.js
index 2ebf00c8..db712bea 100644
--- a/themes/hexo/components/HexoRecentComments.js
+++ b/themes/hexo/components/HexoRecentComments.js
@@ -1,5 +1,5 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { useEffect, useState } from 'react'
+import { siteConfig } from '@/lib/config'
 import Card from '@/themes/hexo/components/Card'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
@@ -11,12 +11,12 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const HexoRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
+  const [comments, updateComments] = useState([])
   const { locale } = useGlobal()
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/hexo/components/InfoCard.js b/themes/hexo/components/InfoCard.js
index 5f1116e8..6b33034e 100644
--- a/themes/hexo/components/InfoCard.js
+++ b/themes/hexo/components/InfoCard.js
@@ -1,9 +1,9 @@
-import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import Card from './Card'
 import SocialButton from './SocialButton'
 import MenuGroupCard from './MenuGroupCard'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交信息卡
@@ -22,10 +22,10 @@ export function InfoCard(props) {
                 }}
             >
                 {/* eslint-disable-next-line @next/next/no-img-element */}
-                <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={BLOG.AUTHOR} />
+                <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={siteConfig('AUTHOR')} />
             </div>
-            <div className='font-medium text-center text-xl pb-4'>{BLOG.AUTHOR}</div>
-            <div className='text-sm text-center'>{BLOG.BIO}</div>
+            <div className='font-medium text-center text-xl pb-4'>{siteConfig('AUTHOR')}</div>
+            <div className='text-sm text-center'>{siteConfig('BIO')}</div>
             <MenuGroupCard {...props} />
             <SocialButton />
         </Card>
diff --git a/themes/hexo/components/JumpToCommentButton.js b/themes/hexo/components/JumpToCommentButton.js
index fb007712..60f1d1e9 100644
--- a/themes/hexo/components/JumpToCommentButton.js
+++ b/themes/hexo/components/JumpToCommentButton.js
@@ -1,5 +1,5 @@
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到评论区
@@ -7,7 +7,7 @@ import CONFIG from '../config'
  * @constructor
  */
 const JumpToCommentButton = () => {
-  if (!CONFIG.WIDGET_TO_COMMENT) {
+  if (!siteConfig('HEXO_WIDGET_TO_COMMENT', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/hexo/components/JumpToTopButton.js b/themes/hexo/components/JumpToTopButton.js
index 77313f46..9a2b9712 100644
--- a/themes/hexo/components/JumpToTopButton.js
+++ b/themes/hexo/components/JumpToTopButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到网页顶部
@@ -13,7 +13,7 @@ import CONFIG from '../config'
 const JumpToTopButton = ({ showPercent = true, percent }) => {
   const { locale } = useGlobal()
 
-  if (!CONFIG.WIDGET_TO_TOP) {
+  if (!siteConfig('HEXO_WIDGET_TO_TOP', null, CONFIG)) {
     return <></>
   }
   return (<div className='space-x-1 items-center justify-center transform hover:scale-105 duration-200 w-7 h-auto pb-1 text-center' onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })} >
diff --git a/themes/hexo/components/LatestPostsGroup.js b/themes/hexo/components/LatestPostsGroup.js
index bc3002dd..f9ac9026 100644
--- a/themes/hexo/components/LatestPostsGroup.js
+++ b/themes/hexo/components/LatestPostsGroup.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import LazyImage from '@/components/LazyImage'
 import { useGlobal } from '@/lib/global'
 // import Image from 'next/image'
@@ -28,7 +28,7 @@ const LatestPostsGroup = ({ latestPosts, siteInfo }) => {
             </div>
         </div>
         {latestPosts.map(post => {
-          const selected = currentPath === `${BLOG.SUB_PATH}/${post.slug}`
+          const selected = currentPath === `${siteConfig('SUB_PATH', '')}/${post.slug}`
 
           const headerImage = post?.pageCoverThumbnail ? post.pageCoverThumbnail : siteInfo?.pageCover
 
@@ -36,7 +36,7 @@ const LatestPostsGroup = ({ latestPosts, siteInfo }) => {
             (<Link
                     key={post.id}
                     title={post.title}
-                    href={`${BLOG.SUB_PATH}/${post.slug}`}
+                    href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                     passHref
                     className={'my-3 flex'}>
 
diff --git a/themes/hexo/components/Logo.js b/themes/hexo/components/Logo.js
index 2dd392b7..f753cd83 100644
--- a/themes/hexo/components/Logo.js
+++ b/themes/hexo/components/Logo.js
@@ -1,13 +1,11 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
-import React from 'react'
 
 const Logo = props => {
-  const { siteInfo } = props
   return (
     <Link href='/' passHref legacyBehavior>
       <div className='flex flex-col justify-center items-center cursor-pointer space-y-3'>
-        <div className='font-medium text-lg p-1.5 rounded dark:border-white menu-link transform duration-200'> {siteInfo?.title || BLOG.TITLE}</div>
+        <div className='font-medium text-lg p-1.5 rounded dark:border-white menu-link transform duration-200'> {siteConfig('TITLE') }</div>
       </div>
     </Link>
   )
diff --git a/themes/hexo/components/MenuGroupCard.js b/themes/hexo/components/MenuGroupCard.js
index 5be22e2b..2e7a44d1 100644
--- a/themes/hexo/components/MenuGroupCard.js
+++ b/themes/hexo/components/MenuGroupCard.js
@@ -1,7 +1,7 @@
-import React from 'react'
 import Link from 'next/link'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 const MenuGroupCard = (props) => {
   const { postCount, categoryOptions, tagOptions } = props
@@ -11,9 +11,9 @@ const MenuGroupCard = (props) => {
   const tagSlot = <div className='text-center'>{tagOptions?.length}</div>
 
   const links = [
-    { name: locale.COMMON.ARTICLE, to: '/archive', slot: archiveSlot, show: CONFIG.MENU_ARCHIVE },
-    { name: locale.COMMON.CATEGORY, to: '/category', slot: categorySlot, show: CONFIG.MENU_CATEGORY },
-    { name: locale.COMMON.TAGS, to: '/tag', slot: tagSlot, show: CONFIG.MENU_TAG }
+    { name: locale.COMMON.ARTICLE, to: '/archive', slot: archiveSlot, show: siteConfig('HEXO_MENU_ARCHIVE', null, CONFIG) },
+    { name: locale.COMMON.CATEGORY, to: '/category', slot: categorySlot, show: siteConfig('HEXO_MENU_CATEGORY', null, CONFIG) },
+    { name: locale.COMMON.TAGS, to: '/tag', slot: tagSlot, show: siteConfig('HEXO_MENU_TAG', null, CONFIG) }
   ]
 
   for (let i = 0; i < links.length; i++) {
diff --git a/themes/hexo/components/MenuItemCollapse.js b/themes/hexo/components/MenuItemCollapse.js
index ccd9d6bc..e8a030c2 100644
--- a/themes/hexo/components/MenuItemCollapse.js
+++ b/themes/hexo/components/MenuItemCollapse.js
@@ -7,7 +7,8 @@ import { useState } from 'react'
  * @param {*} param0
  * @returns
  */
-export const MenuItemCollapse = ({ link }) => {
+export const MenuItemCollapse = (props) => {
+  const { link } = props
   const [show, changeShow] = useState(false)
   const hasSubMenu = link?.subMenus?.length > 0
 
@@ -41,7 +42,7 @@ export const MenuItemCollapse = ({ link }) => {
         </div>
 
         {/* 折叠子菜单 */}
-        {hasSubMenu && <Collapse isOpen={isOpen}>
+        {hasSubMenu && <Collapse isOpen={isOpen} onHeightChange={props.onHeightChange}>
             {link.subMenus.map((sLink, index) => {
               return <div key={index} className='dark:bg-black dark:text-gray-200 text-left px-10 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  py-3 pr-6'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
diff --git a/themes/hexo/components/MenuListSide.js b/themes/hexo/components/MenuListSide.js
index 789d07d2..e47c9a71 100644
--- a/themes/hexo/components/MenuListSide.js
+++ b/themes/hexo/components/MenuListSide.js
@@ -1,6 +1,5 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemCollapse } from './MenuItemCollapse'
 import CONFIG from '../config'
 
@@ -9,16 +8,16 @@ export const MenuListSide = (props) => {
   const { locale } = useGlobal()
 
   let links = [
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('HEXO_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('HEXO_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('HEXO_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('HEXO_MENU_TAG', null, CONFIG) }
   ]
 
   if (customNav) {
     links = customNav.concat(links)
   }
-  
+
   for (let i = 0; i < links.length; i++) {
     if (links[i].id !== i) {
       links[i].id = i
@@ -26,7 +25,7 @@ export const MenuListSide = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/hexo/components/MenuListTop.js b/themes/hexo/components/MenuListTop.js
index 4f2da0d1..8fc8b37b 100644
--- a/themes/hexo/components/MenuListTop.js
+++ b/themes/hexo/components/MenuListTop.js
@@ -1,7 +1,6 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemDrop } from './MenuItemDrop'
 
 export const MenuListTop = (props) => {
@@ -9,11 +8,11 @@ export const MenuListTop = (props) => {
   const { locale } = useGlobal()
 
   let links = [
-    { id: 1, icon: 'fa-solid fa-house', name: locale.NAV.INDEX, to: '/', show: CONFIG.MENU_INDEX },
-    { id: 2, icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { id: 3, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE }
-    // { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    // { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { id: 1, icon: 'fa-solid fa-house', name: locale.NAV.INDEX, to: '/', show: siteConfig('HEXO_MENU_INDEX', null, CONFIG) },
+    { id: 2, icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('HEXO_MENU_SEARCH', null, CONFIG) },
+    { id: 3, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('HEXO_MENU_ARCHIVE', null, CONFIG) }
+    // { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MENU_CATEGORY', null, CONFIG) },
+    // { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MENU_TAG', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -27,7 +26,7 @@ export const MenuListTop = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/hexo/components/NavButtonGroup.js b/themes/hexo/components/NavButtonGroup.js
index 38709213..8539eb49 100644
--- a/themes/hexo/components/NavButtonGroup.js
+++ b/themes/hexo/components/NavButtonGroup.js
@@ -1,5 +1,3 @@
-
-import React from 'react'
 import Link from 'next/link'
 
 /**
@@ -15,7 +13,7 @@ const NavButtonGroup = (props) => {
 
   return (
     <nav id='home-nav-button' className={'w-full z-10 md:h-72 md:mt-6 xl:mt-32 px-5 py-2 mt-8 flex flex-wrap md:max-w-6xl space-y-2 md:space-y-0 md:flex justify-center max-h-80 overflow-auto'}>
-      {categoryOptions.map(category => {
+      {categoryOptions?.map(category => {
         return (
           <Link
             key={`${category.name}`}
diff --git a/themes/hexo/components/PostHeader.js b/themes/hexo/components/PostHeader.js
index acafaf0f..8a69b9ef 100644
--- a/themes/hexo/components/PostHeader.js
+++ b/themes/hexo/components/PostHeader.js
@@ -1,10 +1,10 @@
 import Link from 'next/link'
 import TagItemMini from './TagItemMini'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import NotionIcon from '@/components/NotionIcon'
 import LazyImage from '@/components/LazyImage'
 import { formatDateFmt } from '@/lib/formatDate'
+import { siteConfig } from '@/lib/config'
 
 export default function PostHeader({ post, siteInfo }) {
   const { locale } = useGlobal()
@@ -57,7 +57,7 @@ export default function PostHeader({ post, siteInfo }) {
               </div>
             </div>
 
-            {JSON.parse(BLOG.ANALYTICS_BUSUANZI_ENABLE) && <div className="busuanzi_container_page_pv font-light mr-2">
+            {JSON.parse(siteConfig('ANALYTICS_BUSUANZI_ENABLE')) && <div className="busuanzi_container_page_pv font-light mr-2">
               <span className="mr-2 busuanzi_value_page_pv" />
               {locale.COMMON.VIEWS}
             </div>}
diff --git a/themes/hexo/components/Progress.js b/themes/hexo/components/Progress.js
index 59ee1697..8c233c54 100644
--- a/themes/hexo/components/Progress.js
+++ b/themes/hexo/components/Progress.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { isBrowser } from '@/lib/utils'
 
 /**
diff --git a/themes/hexo/components/SideBar.js b/themes/hexo/components/SideBar.js
index c6a1340f..913ce0a9 100644
--- a/themes/hexo/components/SideBar.js
+++ b/themes/hexo/components/SideBar.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import LazyImage from '@/components/LazyImage'
 import { useRouter } from 'next/router'
 import MenuGroupCard from './MenuGroupCard'
@@ -20,7 +20,7 @@ const SideBar = (props) => {
                 <div>
                     <div onClick={() => { router.push('/') }}
                         className='justify-center items-center flex hover:rotate-45 py-6 hover:scale-105 dark:text-gray-100  transform duration-200 cursor-pointer'>
-                        <LazyImage src={siteInfo?.icon} className='rounded-full' width={80} alt={BLOG.AUTHOR} />
+                        <LazyImage src={siteInfo?.icon} className='rounded-full' width={80} alt={siteConfig('AUTHOR')} />
                     </div>
                     <MenuGroupCard {...props} />
                 </div>
diff --git a/themes/hexo/components/SideRight.js b/themes/hexo/components/SideRight.js
index 570bf32f..c5600eb4 100644
--- a/themes/hexo/components/SideRight.js
+++ b/themes/hexo/components/SideRight.js
@@ -6,11 +6,11 @@ import Catalog from './Catalog'
 import { InfoCard } from './InfoCard'
 import { AnalyticsCard } from './AnalyticsCard'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
 import dynamic from 'next/dynamic'
 import Announcement from './Announcement'
 import { useGlobal } from '@/lib/global'
 import Live2D from '@/components/Live2D'
+import { siteConfig } from '@/lib/config'
 
 const HexoRecentComments = dynamic(() => import('./HexoRecentComments'))
 const FaceBookPage = dynamic(
@@ -41,7 +41,7 @@ export default function SideRight(props) {
   return (
     <div id='sideRight' className={'space-y-4 lg:w-80 lg:pt-0 px-2 pt-4'}>
       <InfoCard {...props} />
-      {CONFIG.WIDGET_ANALYTICS && <AnalyticsCard {...props} />}
+      {siteConfig('HEXO_WIDGET_ANALYTICS', null, CONFIG) && <AnalyticsCard {...props} />}
 
       {showCategory && (
         <Card>
@@ -59,13 +59,13 @@ export default function SideRight(props) {
           <TagGroups tags={tags} currentTag={currentTag} />
         </Card>
       )}
-      {CONFIG.WIDGET_LATEST_POSTS && latestPosts && latestPosts.length > 0 && <Card>
+      {siteConfig('HEXO_WIDGET_LATEST_POSTS', null, CONFIG) && latestPosts && latestPosts.length > 0 && <Card>
         <LatestPostsGroup {...props} />
       </Card>}
 
       <Announcement post={notice}/>
 
-      {BLOG.COMMENT_WALINE_SERVER_URL && BLOG.COMMENT_WALINE_RECENT && <HexoRecentComments/>}
+      {siteConfig('COMMENT_WALINE_SERVER_URL') && siteConfig('COMMENT_WALINE_RECENT') && <HexoRecentComments/>}
 
       <div className='sticky top-20'>
         {post && post.toc && post.toc.length > 1 && <Card>
diff --git a/themes/hexo/components/SocialButton.js b/themes/hexo/components/SocialButton.js
index 1a0b9466..38f3cc7f 100644
--- a/themes/hexo/components/SocialButton.js
+++ b/themes/hexo/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -9,34 +8,34 @@ import React from 'react'
 const SocialButton = () => {
   return <div className='w-full justify-center flex-wrap flex'>
     <div className='space-x-3 text-xl text-gray-600 dark:text-gray-300 '>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {siteConfig('CONTACT_GITHUB') && <a target='_blank' rel='noreferrer' title={'github'} href={siteConfig('CONTACT_GITHUB')} >
         <i className='transform hover:scale-125 duration-150 fab fa-github dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='transform hover:scale-125 duration-150 fab fa-twitter dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='transform hover:scale-125 duration-150 fab fa-telegram dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkIn'} >
         <i className='transform hover:scale-125 duration-150 fab fa-linkedin dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='transform hover:scale-125 duration-150 fab fa-weibo dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='transform hover:scale-125 duration-150 fab fa-instagram dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='transform hover:scale-125 duration-150 fas fa-envelope dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='transform hover:scale-125 duration-150 fas fa-rss dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+      {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
         <i className='transform hover:scale-125 duration-150 fab fa-bilibili dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+      {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
         <i className='transform hover:scale-125 duration-150 fab fa-youtube dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
     </div>
diff --git a/themes/hexo/components/TocDrawer.js b/themes/hexo/components/TocDrawer.js
index 13fad1a9..20c1941b 100644
--- a/themes/hexo/components/TocDrawer.js
+++ b/themes/hexo/components/TocDrawer.js
@@ -1,5 +1,5 @@
 import Catalog from './Catalog'
-import React, { useImperativeHandle, useState } from 'react'
+import { useImperativeHandle, useState } from 'react'
 
 /**
  * 目录抽屉栏
diff --git a/themes/hexo/components/TocDrawerButton.js b/themes/hexo/components/TocDrawerButton.js
index 8e5053b6..318a521d 100644
--- a/themes/hexo/components/TocDrawerButton.js
+++ b/themes/hexo/components/TocDrawerButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 点击召唤目录抽屉
@@ -11,7 +11,7 @@ import CONFIG from '../config'
  */
 const TocDrawerButton = (props) => {
   const { locale } = useGlobal()
-  if (!CONFIG.WIDGET_TOC) {
+  if (!siteConfig('HEXO_WIDGET_TOC', null, CONFIG)) {
     return <></>
   }
   return (<div onClick={props.onClick} className='py-2 px-3 cursor-pointer transform duration-200 flex justify-center items-center w-7 h-7 text-center' title={locale.POST.TOP} >
diff --git a/themes/hexo/config.js b/themes/hexo/config.js
index 262e7bfe..dddfbe83 100644
--- a/themes/hexo/config.js
+++ b/themes/hexo/config.js
@@ -1,38 +1,38 @@
 const CONFIG = {
-  HOME_BANNER_ENABLE: true,
+  HEXO_HOME_BANNER_ENABLE: true,
   // 3.14.1以后的版本中，欢迎语在blog.config.js中配置，用英文逗号','隔开多个。
-  HOME_BANNER_GREETINGS: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
+  HEXO_HOME_BANNER_GREETINGS: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
 
-  HOME_NAV_BUTTONS: true, // 首页是否显示分类大图标按钮
+  HEXO_HOME_NAV_BUTTONS: true, // 首页是否显示分类大图标按钮
   // 已知未修复bug, 在移动端开启true后会加载不出图片； 暂时建议设置为false。
-  HOME_NAV_BACKGROUND_IMG_FIXED: false, // 首页背景图滚动时是否固定，true 则滚动时图片不懂动； false则随鼠标滚动 ;
+  HEXO_HOME_NAV_BACKGROUND_IMG_FIXED: false, // 首页背景图滚动时是否固定，true 则滚动时图片不懂动； false则随鼠标滚动 ;
   // 是否显示开始阅读按钮
-  SHOW_START_READING: true,
+  HEXO_SHOW_START_READING: true,
 
   // 菜单配置
-  MENU_INDEX: true, // 显示首页
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  HEXO_MENU_INDEX: true, // 显示首页
+  HEXO_MENU_CATEGORY: true, // 显示分类
+  HEXO_MENU_TAG: true, // 显示标签
+  HEXO_MENU_ARCHIVE: true, // 显示归档
+  HEXO_MENU_SEARCH: true, // 显示搜索
 
-  POST_LIST_COVER: true, // 列表显示文章封面
-  POST_LIST_COVER_HOVER_ENLARGE: false, // 列表鼠标悬停放大
+  HEXO_POST_LIST_COVER: true, // 列表显示文章封面
+  HEXO_POST_LIST_COVER_HOVER_ENLARGE: false, // 列表鼠标悬停放大
 
-  POST_LIST_COVER_DEFAULT: true, // 封面为空时用站点背景做默认封面
-  POST_LIST_SUMMARY: true, // 文章摘要
-  POST_LIST_PREVIEW: false, // 读取文章预览
-  POST_LIST_IMG_CROSSOVER: true, // 博客列表图片左右交错
+  HEXO_POST_LIST_COVER_DEFAULT: true, // 封面为空时用站点背景做默认封面
+  HEXO_POST_LIST_SUMMARY: true, // 文章摘要
+  HEXO_POST_LIST_PREVIEW: false, // 读取文章预览
+  HEXO_POST_LIST_IMG_CROSSOVER: true, // 博客列表图片左右交错
 
-  ARTICLE_ADJACENT: true, // 显示上一篇下一篇文章推荐
-  ARTICLE_COPYRIGHT: true, // 显示文章版权声明
-  ARTICLE_RECOMMEND: true, // 文章关联推荐
+  HEXO_ARTICLE_ADJACENT: true, // 显示上一篇下一篇文章推荐
+  HEXO_ARTICLE_COPYRIGHT: true, // 显示文章版权声明
+  HEXO_ARTICLE_RECOMMEND: true, // 文章关联推荐
 
-  WIDGET_LATEST_POSTS: true, // 显示最新文章卡
-  WIDGET_ANALYTICS: false, // 显示统计卡
-  WIDGET_TO_TOP: true,
-  WIDGET_TO_COMMENT: true, // 跳到评论区
-  WIDGET_DARK_MODE: true, // 夜间模式
-  WIDGET_TOC: true // 移动端悬浮目录
+  HEXO_WIDGET_LATEST_POSTS: true, // 显示最新文章卡
+  HEXO_WIDGET_ANALYTICS: false, // 显示统计卡
+  HEXO_WIDGET_TO_TOP: true,
+  HEXO_WIDGET_TO_COMMENT: true, // 跳到评论区
+  HEXO_WIDGET_DARK_MODE: true, // 夜间模式
+  HEXO_WIDGET_TOC: true // 移动端悬浮目录
 }
 export default CONFIG
diff --git a/themes/hexo/index.js b/themes/hexo/index.js
index 960556e0..7e770dc5 100644
--- a/themes/hexo/index.js
+++ b/themes/hexo/index.js
@@ -1,12 +1,10 @@
 import CONFIG from './config'
-
 import CommonHead from '@/components/CommonHead'
 import { useEffect, useRef } from 'react'
 import Footer from './components/Footer'
 import SideRight from './components/SideRight'
 import TopNav from './components/TopNav'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import { isBrowser } from '@/lib/utils'
 import BlogPostListPage from './components/BlogPostListPage'
 import BlogPostListScroll from './components/BlogPostListScroll'
@@ -33,6 +31,7 @@ import SlotBar from './components/SlotBar'
 import { Transition } from '@headlessui/react'
 import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 基础布局 采用左右两侧布局，移动端使用顶部导航栏
@@ -41,7 +40,7 @@ import replaceSearchResult from '@/components/Mark'
  * @constructor
  */
 const LayoutBase = props => {
-  const { children, headerSlot, floatSlot, slotTop, meta, siteInfo, className } = props
+  const { children, headerSlot, floatSlot, slotTop, meta, className } = props
   const { onLoading } = useGlobal()
 
   return (
@@ -69,8 +68,8 @@ const LayoutBase = props => {
             </Transition>
 
             {/* 主区块 */}
-            <main id="wrapper" className={`${CONFIG.HOME_BANNER_ENABLE ? '' : 'pt-16'} bg-hexo-background-gray dark:bg-black w-full py-8 md:px-8 lg:px-24 min-h-screen relative`}>
-                <div id="container-inner" className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + ' w-full mx-auto lg:flex lg:space-x-4 justify-center relative z-10'} >
+            <main id="wrapper" className={`${siteConfig('HEXO_HOME_BANNER_ENABLE', null, CONFIG) ? '' : 'pt-16'} bg-hexo-background-gray dark:bg-black w-full py-8 md:px-8 lg:px-24 min-h-screen relative`}>
+                <div id="container-inner" className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + ' w-full mx-auto lg:flex lg:space-x-4 justify-center relative z-10'} >
                     <div className={`${className || ''} w-full max-w-4xl h-full overflow-hidden`}>
 
                         <Transition
@@ -100,7 +99,7 @@ const LayoutBase = props => {
             <RightFloatArea floatSlot={floatSlot} />
 
             {/* 页脚 */}
-            <Footer title={siteInfo?.title || BLOG.TITLE} />
+            <Footer title={siteConfig('TITLE') } />
         </div>
   )
 }
@@ -112,7 +111,7 @@ const LayoutBase = props => {
  * @returns
  */
 const LayoutIndex = (props) => {
-  const headerSlot = CONFIG.HOME_BANNER_ENABLE && <Hero {...props} />
+  const headerSlot = siteConfig('HEXO_HOME_BANNER_ENABLE', null, CONFIG) && <Hero {...props} />
   return <LayoutPostList {...props} headerSlot={headerSlot} className='pt-8' />
 }
 
@@ -124,7 +123,7 @@ const LayoutIndex = (props) => {
 const LayoutPostList = (props) => {
   return <LayoutBase {...props} className='pt-8'>
         <SlotBar {...props} />
-        {BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
+        {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
     </LayoutBase>
 }
 
@@ -155,7 +154,7 @@ const LayoutSearch = props => {
         <LayoutBase {...props} currentSearch={currentSearch} className='pt-8'>
             {!currentSearch
               ? <SearchNav {...props} />
-              : <div id="posts-wrapper"> {BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}  </div>}
+              : <div id="posts-wrapper"> {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}  </div>}
         </LayoutBase>
   )
 }
@@ -295,7 +294,7 @@ const LayoutCategoryIndex = props => {
                     <i className="mr-4 fas fa-th" />  {locale.COMMON.CATEGORY}:
                 </div>
                 <div id="category-list" className="duration-200 flex flex-wrap mx-8">
-                    {categoryOptions.map(category => {
+                    {categoryOptions?.map(category => {
                       return (
                             <Link key={category.name} href={`/category/${category.name}`} passHref legacyBehavior>
                                 <div className={' duration-300 dark:hover:text-white px-5 cursor-pointer py-2 hover:text-indigo-400'}>
diff --git a/themes/landing/components/Features.js b/themes/landing/components/Features.js
index ac7f095c..c0e403b5 100644
--- a/themes/landing/components/Features.js
+++ b/themes/landing/components/Features.js
@@ -5,6 +5,7 @@ import { useState, useRef, useEffect } from 'react'
 import { Transition } from '@headlessui/react'
 import CONFIG from '../config'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 // import FeaturesElement from '@/public/images/features-element.png'
 
 export default function Features() {
@@ -32,8 +33,8 @@ export default function Features() {
 
           {/* Section header */}
           <div className="max-w-3xl mx-auto text-center pb-12 md:pb-16">
-            <h1 className="h2 mb-4">{CONFIG.FEATURES_HEADER_1}</h1>
-            <p className="text-xl text-gray-600 leading-relaxed" dangerouslySetInnerHTML={{ __html: CONFIG.FEATURES_HEADER_1_P }}></p>
+            <h1 className="h2 mb-4">{siteConfig('LANDING_FEATURES_HEADER_1', null, CONFIG)}</h1>
+            <p className="text-xl text-gray-600 leading-relaxed" dangerouslySetInnerHTML={{ __html: siteConfig('LANDING_FEATURES_HEADER_1_P', null, CONFIG) }}></p>
           </div>
 
           {/* Section content */}
@@ -42,8 +43,8 @@ export default function Features() {
             {/* Content */}
             <div className="max-w-xl md:max-w-none md:w-full mx-auto md:col-span-7 lg:col-span-6 md:mt-6" data-aos="fade-right">
               <div className="md:pr-4 lg:pr-12 xl:pr-16 mb-8">
-                <h3 className="h3 mb-3">{CONFIG.FEATURES_HEADER_2}</h3>
-                <p className="text-xl text-gray-600">{CONFIG.FEATURES_HEADER_2_P}</p>
+                <h3 className="h3 mb-3">{siteConfig('LANDING_FEATURES_HEADER_2', null, CONFIG)}</h3>
+                <p className="text-xl text-gray-600">{siteConfig('LANDING_FEATURES_HEADER_2_P', null, CONFIG)}</p>
               </div>
               {/* Tabs buttons */}
               <div className="mb-8 md:mb-0">
@@ -53,8 +54,8 @@ export default function Features() {
                   onClick={(e) => { e.preventDefault(); setTab(1) }}
                 >
                   <div>
-                    <div className="font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_CARD_1_TITLE}</div>
-                    <div className="text-gray-600">{CONFIG.FEATURES_CARD_1_P}</div>
+                    <div className="font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_CARD_1_TITLE', null, CONFIG)}</div>
+                    <div className="text-gray-600">{siteConfig('LANDING_FEATURES_CARD_1_P', null, CONFIG)}</div>
                   </div>
                   <div className="flex justify-center items-center w-8 h-8 bg-white rounded-full shadow flex-shrink-0 ml-3">
                     <svg className="w-3 h-3 fill-current" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
@@ -68,8 +69,8 @@ export default function Features() {
                   onClick={(e) => { e.preventDefault(); setTab(2) }}
                 >
                   <div>
-                    <div className="font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_CARD_2_TITLE}</div>
-                    <div className="text-gray-600">{CONFIG.FEATURES_CARD_2_P}</div>
+                    <div className="font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_CARD_2_TITLE', null, CONFIG)}</div>
+                    <div className="text-gray-600">{siteConfig('LANDING_FEATURES_CARD_2_P', null, CONFIG)}</div>
                   </div>
                   <div className="flex justify-center items-center w-8 h-8 bg-white rounded-full shadow flex-shrink-0 ml-3">
                     <svg className="w-3 h-3 fill-current" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
@@ -83,8 +84,8 @@ export default function Features() {
                   onClick={(e) => { e.preventDefault(); setTab(3) }}
                 >
                   <div>
-                    <div className="font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_CARD_3_TITLE}</div>
-                    <div className="text-gray-600">{CONFIG.FEATURES_CARD_3_P}</div>
+                    <div className="font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_CARD_3_TITLE', null, CONFIG)}</div>
+                    <div className="text-gray-600">{siteConfig('LANDING_FEATURES_CARD_3_P', null, CONFIG)}</div>
                   </div>
                   <div className="flex justify-center items-center w-8 h-8 bg-white rounded-full shadow flex-shrink-0 ml-3">
                     <svg className="w-3 h-3 fill-current" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
diff --git a/themes/landing/components/FeaturesBlocks.js b/themes/landing/components/FeaturesBlocks.js
index 1c0a3e2f..07e63e50 100644
--- a/themes/landing/components/FeaturesBlocks.js
+++ b/themes/landing/components/FeaturesBlocks.js
@@ -1,4 +1,5 @@
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function FeaturesBlocks() {
   return (
@@ -13,8 +14,8 @@ export default function FeaturesBlocks() {
 
             {/* Section header */}
             <div className="max-w-3xl mx-auto text-center pb-12 md:pb-20">
-              <h2 className="h2 mb-4">{CONFIG.FEATURES_BLOCK_HEADER}</h2>
-              <p className="text-xl text-gray-600" dangerouslySetInnerHTML={{ __html: CONFIG.FEATURES_BLOCK_P }}></p>
+              <h2 className="h2 mb-4">{siteConfig('LANDING_FEATURES_BLOCK_HEADER', null, CONFIG)}</h2>
+              <p className="text-xl text-gray-600" dangerouslySetInnerHTML={{ __html: siteConfig('LANDING_FEATURES_BLOCK_P', null, CONFIG) }}></p>
             </div>
 
             {/* Items */}
@@ -33,8 +34,8 @@ export default function FeaturesBlocks() {
                     </g>
                   </g>
                 </svg>
-                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_BLOCK_1_TITLE}</h4>
-                <p className="text-gray-600 text-center">{CONFIG.FEATURES_BLOCK_1_P}</p>
+                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_BLOCK_1_TITLE', null, CONFIG)}</h4>
+                <p className="text-gray-600 text-center">{siteConfig('LANDING_FEATURES_BLOCK_1_P', null, CONFIG)}</p>
               </div>
 
               {/* 2nd item */}
@@ -49,8 +50,8 @@ export default function FeaturesBlocks() {
                     </g>
                   </g>
                 </svg>
-                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_BLOCK_2_TITLE}</h4>
-                <p className="text-gray-600 text-center">{CONFIG.FEATURES_BLOCK_2_P}</p>
+                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_BLOCK_2_TITLE', null, CONFIG)}</h4>
+                <p className="text-gray-600 text-center">{siteConfig('LANDING_FEATURES_BLOCK_2_P', null, CONFIG)}</p>
               </div>
 
               {/* 3rd item */}
@@ -66,8 +67,8 @@ export default function FeaturesBlocks() {
                     </g>
                   </g>
                 </svg>
-                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_BLOCK_3_TITLE}</h4>
-                <p className="text-gray-600 text-center">{CONFIG.FEATURES_BLOCK_3_P}</p>
+                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_BLOCK_3_TITLE', null, CONFIG)}</h4>
+                <p className="text-gray-600 text-center">{siteConfig('LANDING_FEATURES_BLOCK_3_P', null, CONFIG)}</p>
               </div>
 
               {/* 4th item */}
@@ -83,8 +84,8 @@ export default function FeaturesBlocks() {
                     </g>
                   </g>
                 </svg>
-                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_BLOCK_4_TITLE}</h4>
-                <p className="text-gray-600 text-center">{CONFIG.FEATURES_BLOCK_4_P}</p>
+                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_BLOCK_4_TITLE', null, CONFIG)}</h4>
+                <p className="text-gray-600 text-center">{siteConfig('LANDING_FEATURES_BLOCK_4_P', null, CONFIG)}</p>
               </div>
 
               {/* 5th item */}
@@ -99,8 +100,8 @@ export default function FeaturesBlocks() {
                     </g>
                   </g>
                 </svg>
-                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_BLOCK_5_TITLE}</h4>
-                <p className="text-gray-600 text-center">{CONFIG.FEATURES_BLOCK_5_P}</p>
+                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_BLOCK_5_TITLE', null, CONFIG)}</h4>
+                <p className="text-gray-600 text-center">{siteConfig('LANDING_FEATURES_BLOCK_5_P', null, CONFIG)}</p>
               </div>
 
               {/* 6th item */}
@@ -114,8 +115,8 @@ export default function FeaturesBlocks() {
                     </g>
                   </g>
                 </svg>
-                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{CONFIG.FEATURES_BLOCK_6_TITLE}</h4>
-                <p className="text-gray-600 text-center">{CONFIG.FEATURES_BLOCK_6_P}</p>
+                <h4 className="text-xl font-bold leading-snug tracking-tight mb-1">{siteConfig('LANDING_FEATURES_BLOCK_6_TITLE', null, CONFIG)}</h4>
+                <p className="text-gray-600 text-center">{siteConfig('LANDING_FEATURES_BLOCK_6_P', null, CONFIG)}</p>
               </div>
 
             </div>
diff --git a/themes/landing/components/Footer.js b/themes/landing/components/Footer.js
index 9a4f8527..63c3a8a7 100644
--- a/themes/landing/components/Footer.js
+++ b/themes/landing/components/Footer.js
@@ -3,6 +3,7 @@ import Link from 'next/link'
 import { useEffect, useRef, useState } from 'react'
 import CONFIG from '../config'
 import Logo from './Logo'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 页脚
@@ -115,7 +116,7 @@ export default function Footer() {
                     </div>
 
                     {/* 开启邮件收集 */}
-                    {JSON.parse(CONFIG.NEWSLETTER) && <>
+                    {JSON.parse(siteConfig('LANDING_NEWSLETTER', null, CONFIG)) && <>
                         {/* 5th block */}
                         <div className="sm:col-span-6 md:col-span-3 lg:col-span-3">
                             <h6 className="text-gray-800 font-medium mb-2">Subscribe</h6>
diff --git a/themes/landing/components/Header.js b/themes/landing/components/Header.js
index ee6fe3ff..897ae3a4 100644
--- a/themes/landing/components/Header.js
+++ b/themes/landing/components/Header.js
@@ -1,7 +1,7 @@
 'use client'
 
 import { useState, useEffect } from 'react'
-
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import Logo from './Logo'
 import MobileMenu from './MobileMenu'
@@ -36,13 +36,13 @@ export default function Header() {
             {/* Desktop sign in links */}
             <ul className="flex grow justify-end flex-wrap items-center">
               <li>
-                <Link href={CONFIG.HEDEAR_BUTTON_1_URL} target='_blank' className="font-medium hover:font-bold text-gray-600 hover:text-gray-900 px-5 py-3 flex items-center transition duration-150 ease-in-out">
-                   <div>{CONFIG.HEADER_BUTTON_1_TITLE}</div>
+                <Link href={siteConfig('LANDING_HEDEAR_BUTTON_1_URL', null, CONFIG)} target='_blank' className="font-medium hover:font-bold text-gray-600 hover:text-gray-900 px-5 py-3 flex items-center transition duration-150 ease-in-out">
+                   <div>{siteConfig('LANDING_HEADER_BUTTON_1_TITLE', null, CONFIG)}</div>
                 </Link>
               </li>
               <li>
-                <Link href={CONFIG.HEDEAR_BUTTON_2_URL} target='_blank' className="btn-sm text-gray-200 bg-gray-900 hover:bg-gray-800 ml-3">
-                  <span>{CONFIG.HEADER_BUTTON_2_TITLE}</span>
+                <Link href={siteConfig('LANDING_HEDEAR_BUTTON_2_URL', null, CONFIG)} target='_blank' className="btn-sm text-gray-200 bg-gray-900 hover:bg-gray-800 ml-3">
+                  <span>{siteConfig('LANDING_HEADER_BUTTON_2_TITLE', null, CONFIG)}</span>
                   <svg className="w-3 h-3 fill-current text-gray-400 shrink-0 ml-2 -mr-1" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
                     <path d="M11.707 5.293L7 .586 5.586 2l3 3H0v2h8.586l-3 3L7 11.414l4.707-4.707a1 1 0 000-1.414z" fillRule="nonzero" />
                   </svg>
diff --git a/themes/landing/components/Hero.js b/themes/landing/components/Hero.js
index ff7527f6..2982761f 100644
--- a/themes/landing/components/Hero.js
+++ b/themes/landing/components/Hero.js
@@ -1,5 +1,6 @@
 import CONFIG from '../config'
 import ModalVideo from './ModalVideo'
+import { siteConfig } from '@/lib/config'
 
 export default function Hero() {
   return (
@@ -30,21 +31,21 @@ export default function Hero() {
                     {/* Section header */}
                     <div className="text-center pb-12 md:pb-16">
                         <h1 className="text-5xl md:text-6xl font-extrabold leading-tighter tracking-tighter mb-4" data-aos="zoom-y-out">
-                            <span className="bg-clip-text text-transparent bg-gradient-to-r from-blue-500 to-teal-400">{CONFIG.HERO_TITLE_1}</span>
+                            <span className="bg-clip-text text-transparent bg-gradient-to-r from-blue-500 to-teal-400">{siteConfig('LANDING_HERO_TITLE_1', null, CONFIG)}</span>
                         </h1>
                         <div className="max-w-3xl mx-auto">
-                            <p className="text-xl text-gray-600 mb-8" data-aos="zoom-y-out" data-aos-delay="150">{CONFIG.HERO_P_1}</p>
+                            <p className="text-xl text-gray-600 mb-8" data-aos="zoom-y-out" data-aos-delay="150">{siteConfig('LANDING_HERO_P_1', null, CONFIG)}</p>
                             <div className="max-w-xs mx-auto sm:max-w-none sm:flex sm:justify-center" data-aos="zoom-y-out" data-aos-delay="300">
                                 <div>
                                     <a target='_blank' className="btn text-white bg-blue-600 hover:bg-blue-700 w-full mb-4 sm:w-auto sm:mb-0"
-                                        href={CONFIG.HERO_BUTTON_1_LINK} rel="noreferrer">
-                                        {CONFIG.HERO_BUTTON_1_TEXT}
+                                        href={siteConfig('LANDING_HERO_BUTTON_1_LINK', null, CONFIG)} rel="noreferrer">
+                                        {siteConfig('LANDING_HERO_BUTTON_1_TEXT', null, CONFIG)}
                                     </a>
                                 </div>
                                 <div>
                                     <a target='_blank' className="btn text-white bg-gray-900 hover:bg-gray-800 w-full sm:w-auto sm:ml-4"
-                                        href={CONFIG.HERO_BUTTON_2_LINK} rel="noreferrer">
-                                        {CONFIG.HERO_BUTTON_2_TEXT}
+                                        href={siteConfig('LANDING_HERO_BUTTON_2_LINK', null, CONFIG)} rel="noreferrer">
+                                        {siteConfig('LANDING_HERO_BUTTON_2_TEXT', null, CONFIG)}
                                     </a>
                                 </div>
                             </div>
@@ -53,11 +54,11 @@ export default function Hero() {
 
                     {/* Hero image */}
                     <ModalVideo
-                        thumb={CONFIG.HERO_VIDEO_IMAGE}
+                        thumb={siteConfig('LANDING_HERO_VIDEO_IMAGE', null, CONFIG)}
                         thumbWidth={768}
                         thumbHeight={432}
-                        thumbAlt={CONFIG.HERO_HEADER_1}
-                        video={CONFIG.HERO_VIDEO_URL}
+                        thumbAlt={siteConfig('HERO_HEADER_1', null, CONFIG)}
+                        video={siteConfig('HERO_VIDEO_URL', null, CONFIG)}
                         videoWidth={1920}
                         videoHeight={1080} />
 
diff --git a/themes/landing/components/MobileMenu.js b/themes/landing/components/MobileMenu.js
index 7bf556e9..3384f6b0 100644
--- a/themes/landing/components/MobileMenu.js
+++ b/themes/landing/components/MobileMenu.js
@@ -4,6 +4,7 @@ import { useState, useRef, useEffect } from 'react'
 import { Transition } from '@headlessui/react'
 import Link from 'next/link'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function MobileMenu() {
   const [mobileNavOpen, setMobileNavOpen] = useState(false)
@@ -66,13 +67,13 @@ export default function MobileMenu() {
         >
           <ul className="px-5 py-2">
             <li>
-              <Link href={CONFIG.HEDEAR_BUTTON_1_URL} className="flex font-medium w-full text-gray-600 hover:text-gray-900 py-2 justify-center" onClick={() => setMobileNavOpen(false)}>
-                <div>{CONFIG.HEADER_BUTTON_1_TITLE}</div>
+              <Link href={siteConfig('LANDING_HEDEAR_BUTTON_1_URL', null, CONFIG)} className="flex font-medium w-full text-gray-600 hover:text-gray-900 py-2 justify-center" onClick={() => setMobileNavOpen(false)}>
+                <div>{siteConfig('LANDING_HEADER_BUTTON_1_TITLE', null, CONFIG)}</div>
               </Link>
             </li>
             <li>
-              <Link href={CONFIG.HEDEAR_BUTTON_2_URL} className="btn-sm text-gray-200 bg-gray-900 hover:bg-gray-800 w-full my-2" onClick={() => setMobileNavOpen(false)}>
-                <span>{CONFIG.HEADER_BUTTON_2_TITLE}</span>
+              <Link href={siteConfig('LANDING_HEDEAR_BUTTON_2_URL', null, CONFIG)} className="btn-sm text-gray-200 bg-gray-900 hover:bg-gray-800 w-full my-2" onClick={() => setMobileNavOpen(false)}>
+                <span>{siteConfig('LANDING_HEADER_BUTTON_2_TITLE', null, CONFIG)}</span>
                 <svg className="w-3 h-3 fill-current text-gray-400 shrink-0 ml-2 -mr-1" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
                   <path d="M11.707 5.293L7 .586 5.586 2l3 3H0v2h8.586l-3 3L7 11.414l4.707-4.707a1 1 0 000-1.414z" fill="#999" fillRule="nonzero" />
                 </svg>
diff --git a/themes/landing/components/ModalVideo.js b/themes/landing/components/ModalVideo.js
index 82cb7352..edebdb8d 100644
--- a/themes/landing/components/ModalVideo.js
+++ b/themes/landing/components/ModalVideo.js
@@ -4,6 +4,7 @@ import { useState, useRef, Fragment } from 'react'
 import { Dialog, Transition } from '@headlessui/react'
 import CONFIG from '../config'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 
 export default function ModalVideo({
   thumb,
@@ -59,7 +60,7 @@ export default function ModalVideo({
                             <path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10zm0 2C5.373 24 0 18.627 0 12S5.373 0 12 0s12 5.373 12 12-5.373 12-12 12z" />
                             <path d="M10 17l6-5-6-5z" />
                         </svg>
-                        <span className="ml-3">{CONFIG.HERO_VIDEO_TIPS}</span>
+                        <span className="ml-3">{siteConfig('LANDING_HERO_VIDEO_TIPS', null, CONFIG)}</span>
                     </button>
                 </div>
             </div>
@@ -100,7 +101,7 @@ export default function ModalVideo({
                                 <div>
                                     <iframe
                                         className="video-iframe aspect-video w-screen md:w-[800px] mx-auto"
-                                        src={CONFIG.HERO_VIDEO_IFRAME}
+                                        src={siteConfig('LANDING_HERO_VIDEO_IFRAME', null, CONFIG)}
                                         scrolling="no"
                                         border="0"
                                         frameBorder="no"
diff --git a/themes/landing/components/Newsletter.js b/themes/landing/components/Newsletter.js
index 18ad893a..3288905f 100644
--- a/themes/landing/components/Newsletter.js
+++ b/themes/landing/components/Newsletter.js
@@ -1,6 +1,7 @@
 import { subscribeToNewsletter } from '@/lib/mailchimp'
 import { useEffect, useRef, useState } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function Newsletter() {
   const formRef = useRef()
@@ -26,7 +27,7 @@ export default function Newsletter() {
     }
   }, [subscribeToNewsletter])
 
-  if (!JSON.parse(CONFIG.NEWSLETTER)) {
+  if (!JSON.parse(siteConfig('LANDING_NEWSLETTER', null, CONFIG))) {
     return <></>
   }
 
diff --git a/themes/landing/components/Testimonials.js b/themes/landing/components/Testimonials.js
index 377040e3..5be5f58d 100644
--- a/themes/landing/components/Testimonials.js
+++ b/themes/landing/components/Testimonials.js
@@ -3,6 +3,7 @@
 
 import LazyImage from '@/components/LazyImage'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function Testimonials() {
   return (
@@ -30,8 +31,8 @@ export default function Testimonials() {
 
                     {/* Section header */}
                     <div className="max-w-3xl mx-auto text-center pb-12 md:pb-16">
-                        <h2 className="h2 mb-4">{CONFIG.TESTIMONIALS_HEADER}</h2>
-                        <p className="text-xl text-gray-600" data-aos="zoom-y-out">{CONFIG.TESTIMONIALS_P}</p>
+                        <h2 className="h2 mb-4">{siteConfig('LANDING_TESTIMONIALS_HEADER', null, CONFIG)}</h2>
+                        <p className="text-xl text-gray-600" data-aos="zoom-y-out">{siteConfig('LANDING_TESTIMONIALS_P', null, CONFIG)}</p>
                     </div>
 
                     {/* Testimonials */}
@@ -44,14 +45,14 @@ export default function Testimonials() {
                                     <svg className="absolute top-0 right-0 -mt-3 -mr-8 w-16 h-16 fill-current text-blue-500" viewBox="0 0 64 64" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
                                         <path d="M37.89 58.338c-2.648-5.63-3.572-10.045-2.774-13.249.8-3.203 8.711-13.383 23.737-30.538l2.135.532c-6.552 10.033-10.532 17.87-11.939 23.515-.583 2.34.22 6.158 2.41 11.457l-13.57 8.283zm-26.963-6.56c-2.648-5.63-3.572-10.046-2.773-13.25.799-3.203 8.71-13.382 23.736-30.538l2.136.533c-6.552 10.032-10.532 17.87-11.94 23.515-.583 2.339.22 6.158 2.41 11.456l-13.57 8.283z" />
                                     </svg>
-                                    <LazyImage className="relative rounded-full w-20 h-20 object-cover" src={CONFIG.TESTIMONIALS_AVATAR} alt="Testimonial 01" />
+                                    <LazyImage className="relative rounded-full w-20 h-20 object-cover" src={siteConfig('LANDING_TESTIMONIALS_AVATAR', null, CONFIG)} alt="Testimonial 01" />
                                 </div>
                                 <blockquote className="text-xl font-medium mb-4">
-                                    {CONFIG.TESTIMONIALS_WORD}
+                                    {siteConfig('LANDING_TESTIMONIALS_WORD', null, CONFIG)}
                                 </blockquote>
-                                <cite className="block font-bold text-lg not-italic mb-1">{CONFIG.TESTIMONIALS_NICKNAME}</cite>
+                                <cite className="block font-bold text-lg not-italic mb-1">{siteConfig('LANDING_TESTIMONIALS_NICKNAME', null, CONFIG)}</cite>
                                 <div className="text-gray-600">
-                                    <span>{CONFIG.TESTIMONIALS_ID}</span> <a className="text-blue-600 hover:underline" href={CONFIG.TESTIMONIALS_SOCIAL_URL}>{CONFIG.TESTIMONIALS_SOCIAL_NAME}</a>
+                                    <span>{siteConfig('LANDING_TESTIMONIALS_ID', null, CONFIG)}</span> <a className="text-blue-600 hover:underline" href={siteConfig('LANDING_TESTIMONIALS_SOCIAL_URL', null, CONFIG)}>{siteConfig('LANDING_TESTIMONIALS_SOCIAL_NAME', null, CONFIG)}</a>
                                 </div>
                             </div>
 
diff --git a/themes/landing/config.js b/themes/landing/config.js
index 1d16a857..19569d66 100644
--- a/themes/landing/config.js
+++ b/themes/landing/config.js
@@ -1,65 +1,65 @@
 const CONFIG = {
 
-  HEADER_BUTTON_1_TITLE: 'Github开源',
-  HEDEAR_BUTTON_1_URL: 'https://github.com/tangly1024/NotionNext',
+  LANDING_HEADER_BUTTON_1_TITLE: 'Github开源',
+  LANDING_HEDEAR_BUTTON_1_URL: 'https://github.com/tangly1024/NotionNext',
 
-  HEADER_BUTTON_2_TITLE: '作者博客',
-  HEDEAR_BUTTON_2_URL: 'https://blog.tangly1024.com/',
+  LANDING_HEADER_BUTTON_2_TITLE: '作者博客',
+  LANDING_HEDEAR_BUTTON_2_URL: 'https://blog.tangly1024.com/',
 
   // 首页大图英雄板块
-  HERO_TITLE_1: 'NotionNext',
-  HERO_P_1: '快速搭建独立站、轻松放大品牌价值！',
-  HERO_BUTTON_1_TEXT: '开始体验',
-  HERO_BUTTON_1_LINK: 'https://docs.tangly1024.com/article/vercel-deploy-notion-next',
-  HERO_BUTTON_2_TEXT: '了解更多',
-  HERO_BUTTON_2_LINK: 'https://docs.tangly1024.com/about',
-  HERO_VIDEO_IMAGE: '/images/home.png',
+  LANDING_HERO_TITLE_1: 'NotionNext',
+  LANDING_HERO_P_1: '快速搭建独立站、轻松放大品牌价值！',
+  LANDING_HERO_BUTTON_1_TEXT: '开始体验',
+  LANDING_HERO_BUTTON_1_LINK: 'https://docs.tangly1024.com/article/vercel-deploy-notion-next',
+  LANDING_HERO_BUTTON_2_TEXT: '了解更多',
+  LANDING_HERO_BUTTON_2_LINK: 'https://docs.tangly1024.com/about',
+  LANDING_HERO_VIDEO_IMAGE: '/images/home.png',
   //   HERO_VIDEO_URL: '/videos/video.mp4',
-  HERO_VIDEO_IFRAME: '//player.bilibili.com/player.html?aid=913088616&bvid=BV1fM4y1L7Qi&cid=1187218697&page=1&&high_quality=1',
-  HERO_VIDEO_TIPS: 'Watch the full video (2 min)',
+  LANDING_HERO_VIDEO_IFRAME: '//player.bilibili.com/player.html?aid=913088616&bvid=BV1fM4y1L7Qi&cid=1187218697&page=1&&high_quality=1',
+  LANDING_HERO_VIDEO_TIPS: 'Watch the full video (2 min)',
 
   // 特性介绍
-  FEATURES_HEADER_1: '探索的过程',
-  FEATURES_HEADER_1_P: "如何搭建自己的门户网站，塑造一个品牌展示中心？<br/>曾经，它是系统<strong class='font-bold text-red-500'>繁重</strong>的Wordpress、是操作<strong class='font-bold  text-red-500'>复杂</strong>的Hexo、是<strong class='font-bold text-red-500'>昂贵</strong>且<strong class='font-bold text-red-500'>不稳定</strong>的技术团队;<br/>现在，只要一个Notion笔记就够了",
-  FEATURES_HEADER_2: 'Notion+NextJs组合方案',
-  FEATURES_HEADER_2_P: '在Notion笔记中管理文章数据，NextJs将其渲染成网页排版，通过Vercel等第三方平台将您的网站发布到全球。',
-  FEATURES_CARD_1_TITLE: '简单快速的系统',
-  FEATURES_CARD_1_P: '在Notion中写下一篇文章，内容立刻在您的网站首页中呈现给互联网',
-  FEATURES_CARD_2_TITLE: '高效传播的媒介',
-  FEATURES_CARD_2_P: '优秀的SEO、快速的响应速度，让您的产品和宣传触达到更多的受众',
-  FEATURES_CARD_3_TITLE: '人性化的定制工具',
-  FEATURES_CARD_3_P: '多款主题供您挑选，可以搭建各种不同风格和作用的网站，更多的主题正在陆续加入中。',
+  LANDING_FEATURES_HEADER_1: '探索的过程',
+  LANDING_FEATURES_HEADER_1_P: "如何搭建自己的门户网站，塑造一个品牌展示中心？<br/>曾经，它是系统<strong class='font-bold text-red-500'>繁重</strong>的Wordpress、是操作<strong class='font-bold  text-red-500'>复杂</strong>的Hexo、是<strong class='font-bold text-red-500'>昂贵</strong>且<strong class='font-bold text-red-500'>不稳定</strong>的技术团队;<br/>现在，只要一个Notion笔记就够了",
+  LANDING_FEATURES_HEADER_2: 'Notion+NextJs组合方案',
+  LANDING_FEATURES_HEADER_2_P: '在Notion笔记中管理文章数据，NextJs将其渲染成网页排版，通过Vercel等第三方平台将您的网站发布到全球。',
+  LANDING_FEATURES_CARD_1_TITLE: '简单快速的系统',
+  LANDING_FEATURES_CARD_1_P: '在Notion中写下一篇文章，内容立刻在您的网站首页中呈现给互联网',
+  LANDING_FEATURES_CARD_2_TITLE: '高效传播的媒介',
+  LANDING_FEATURES_CARD_2_P: '优秀的SEO、快速的响应速度，让您的产品和宣传触达到更多的受众',
+  LANDING_FEATURES_CARD_3_TITLE: '人性化的定制工具',
+  LANDING_FEATURES_CARD_3_P: '多款主题供您挑选，可以搭建各种不同风格和作用的网站，更多的主题正在陆续加入中。',
 
   // 特性介绍2
-  FEATURES_BLOCK_HEADER: '解决方案',
-  FEATURES_BLOCK_P: '人人自媒体的时代，一个网站将帮您链接更多的人，带给你无限的机会和客户。<br/>您还在等什么呢？',
-  FEATURES_BLOCK_1_TITLE: '用网站来展示品牌',
-  FEATURES_BLOCK_1_P: '比起线下渠道、一个公开域名和网站更有说服力',
-  FEATURES_BLOCK_2_TITLE: 'SEO带来更多流量',
-  FEATURES_BLOCK_2_P: '借助搜索引擎，精准定位您的受众',
-  FEATURES_BLOCK_3_TITLE: '网站的性能很重要',
-  FEATURES_BLOCK_3_P: '更快的响应，更好的用户体验',
-  FEATURES_BLOCK_4_TITLE: '打造您的个人品牌',
-  FEATURES_BLOCK_4_P: '继马斯克、乔布斯之后，您将是下一个传奇',
-  FEATURES_BLOCK_5_TITLE: '写作表达是核心技能',
-  FEATURES_BLOCK_5_P: '比起只阅读输入，更重要的是反思和输出',
-  FEATURES_BLOCK_6_TITLE: '开始写博客吧',
-  FEATURES_BLOCK_6_P: 'NotionNext，助您轻松开始写作',
+  LANDING_FEATURES_BLOCK_HEADER: '解决方案',
+  LANDING_FEATURES_BLOCK_P: '人人自媒体的时代，一个网站将帮您链接更多的人，带给你无限的机会和客户。<br/>您还在等什么呢？',
+  LANDING_FEATURES_BLOCK_1_TITLE: '用网站来展示品牌',
+  LANDING_FEATURES_BLOCK_1_P: '比起线下渠道、一个公开域名和网站更有说服力',
+  LANDING_FEATURES_BLOCK_2_TITLE: 'SEO带来更多流量',
+  LANDING_FEATURES_BLOCK_2_P: '借助搜索引擎，精准定位您的受众',
+  LANDING_FEATURES_BLOCK_3_TITLE: '网站的性能很重要',
+  LANDING_FEATURES_BLOCK_3_P: '更快的响应，更好的用户体验',
+  LANDING_FEATURES_BLOCK_4_TITLE: '打造您的个人品牌',
+  LANDING_FEATURES_BLOCK_4_P: '继马斯克、乔布斯之后，您将是下一个传奇',
+  LANDING_FEATURES_BLOCK_5_TITLE: '写作表达是核心技能',
+  LANDING_FEATURES_BLOCK_5_P: '比起只阅读输入，更重要的是反思和输出',
+  LANDING_FEATURES_BLOCK_6_TITLE: '开始写博客吧',
+  LANDING_FEATURES_BLOCK_6_P: 'NotionNext，助您轻松开始写作',
 
   // 感言
-  TESTIMONIALS_HEADER: '已搭建超5300个网站、总浏览量突破100,000,000+',
-  TESTIMONIALS_P: '网站内容涵盖地产、教育、建筑、医学、机械、IT、电子、软件、自媒体、数位游民、短视频、电商、学生、摄影爱好者、旅行爱好者等等各行各业',
+  LANDING_TESTIMONIALS_HEADER: '已搭建超5300个网站、总浏览量突破100,000,000+',
+  LANDING_TESTIMONIALS_P: '网站内容涵盖地产、教育、建筑、医学、机械、IT、电子、软件、自媒体、数位游民、短视频、电商、学生、摄影爱好者、旅行爱好者等等各行各业',
 
-  TESTIMONIALS_AVATAR: 'https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F22de3fcb-d90d-4271-bc01-f815f476122b%2F4FE0A0C0-E487-4C74-BF8E-6F01A27461B8-14186-000008094BC289A6.jpg?table=collection&id=a320a2cc-6ebe-4a8d-95cc-ea94e63bced9&width=200',
-  TESTIMONIALS_NICKNAME: 'Ryan_G',
-  TESTIMONIALS_ID: 'Ryan`Log 站长',
-  TESTIMONIALS_SOCIAL_NAME: '@Gaoran',
-  TESTIMONIALS_SOCIAL_URL: 'https://blog.gaoran.xyz/',
-  TESTIMONIALS_WORD: '“ 感谢大佬的方法。之前尝试过Super、Potion等国外的第三方平台，实现效果一般，个性化程度远不如这个方法，已经用起来了！ “',
+  LANDING_TESTIMONIALS_AVATAR: 'https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F22de3fcb-d90d-4271-bc01-f815f476122b%2F4FE0A0C0-E487-4C74-BF8E-6F01A27461B8-14186-000008094BC289A6.jpg?table=collection&id=a320a2cc-6ebe-4a8d-95cc-ea94e63bced9&width=200',
+  LANDING_TESTIMONIALS_NICKNAME: 'Ryan_G',
+  LANDING_TESTIMONIALS_ID: 'Ryan`Log 站长',
+  LANDING_TESTIMONIALS_SOCIAL_NAME: '@Gaoran',
+  LANDING_TESTIMONIALS_SOCIAL_URL: 'https://blog.gaoran.xyz/',
+  LANDING_TESTIMONIALS_WORD: '“ 感谢大佬的方法。之前尝试过Super、Potion等国外的第三方平台，实现效果一般，个性化程度远不如这个方法，已经用起来了！ “',
 
-  POST_REDIRECT_ENABLE: process.env.NEXT_PUBLIC_POST_REDIRECT_ENABLE || false, // 是否开启文章地址重定向 ； 用于迁移旧网站域名
-  POST_REDIRECT_URL: process.env.NEXT_PUBLIC_POST_REDIRECT_URL || 'https://blog.tangly1024.com', // 重定向网站地址
+  LANDING_POST_REDIRECT_ENABLE: process.env.NEXT_PUBLIC_POST_REDIRECT_ENABLE || false, // 是否开启文章地址重定向 ； 用于迁移旧网站域名
+  LANDING_POST_REDIRECT_URL: process.env.NEXT_PUBLIC_POST_REDIRECT_URL || 'https://blog.tangly1024.com', // 重定向网站地址
 
-  NEWSLETTER: process.env.NEXT_PUBLIC_THEME_LANDING_NEWSLETTER || false // 是否开启邮件订阅 请先配置mailchimp功能 https://docs.tangly1024.com/article/notion-next-mailchimp
+  LANDING_NEWSLETTER: process.env.NEXT_PUBLIC_THEME_LANDING_NEWSLETTER || false // 是否开启邮件订阅 请先配置mailchimp功能 https://docs.tangly1024.com/article/notion-next-mailchimp
 }
 export default CONFIG
diff --git a/themes/landing/index.js b/themes/landing/index.js
index d5a4f194..b7f81495 100644
--- a/themes/landing/index.js
+++ b/themes/landing/index.js
@@ -7,7 +7,6 @@
  * 2. 内容大部分是在此文件中写死，notion数据从props参数中传进来
  * 3. 您可在此网站找到更多喜欢的组件 https://www.tailwind-kit.com/
  */
-/* eslint-disable*/
 import NotionPage from '@/components/NotionPage'
 import Header from './components/Header'
 import Footer from './components/Footer'
@@ -21,11 +20,7 @@ import { useRouter } from 'next/router'
 import CONFIG from './config'
 import Loading from '@/components/Loading'
 import { isBrowser } from '@/lib/utils'
-
-/**
- * 这是个配置文件，可以方便在此统一配置信息
- */
-const THEME_CONFIG = { THEME: 'landing' }
+import { siteConfig } from '@/lib/config'
 
 /**
  * 布局框架
@@ -35,9 +30,9 @@ const THEME_CONFIG = { THEME: 'landing' }
  * @returns
  */
 const LayoutBase = (props) => {
-    const { meta, siteInfo, children } = props
+  const { meta, siteInfo, children } = props
 
-    return <div id='theme-landing' className="overflow-hidden flex flex-col justify-between bg-white">
+  return <div id='theme-landing' className="overflow-hidden flex flex-col justify-between bg-white">
 
         {/* 网页SEO */}
         <CommonHead meta={meta} siteInfo={siteInfo} />
@@ -55,14 +50,13 @@ const LayoutBase = (props) => {
     </div>
 }
 
-
 /**
  * 首页布局
  * @param {*} props
  * @returns
  */
 const LayoutIndex = (props) => {
-    return (
+  return (
         <LayoutBase {...props}>
             <Hero />
             <Features />
@@ -70,7 +64,7 @@ const LayoutIndex = (props) => {
             <Testimonials />
             <Newsletter />
         </LayoutBase>
-    )
+  )
 }
 
 /**
@@ -79,22 +73,20 @@ const LayoutIndex = (props) => {
  * @returns
  */
 const LayoutSlug = (props) => {
-    // 如果 是 /article/[slug] 的文章路径则进行重定向到另一个域名
-    const router = useRouter()
-    if (JSON.parse(CONFIG.POST_REDIRECT_ENABLE) && isBrowser && router.route == '/[prefix]/[slug]') {
-        const redirectUrl = CONFIG.POST_REDIRECT_URL + router.asPath.replace('?theme=landing', '')
-        router.push(redirectUrl)
-        return  <div id='theme-landing'><Loading /></div>
-    }
+  // 如果 是 /article/[slug] 的文章路径则进行重定向到另一个域名
+  const router = useRouter()
+  if (JSON.parse(siteConfig('LANDING_POST_REDIRECT_ENABLE', null, CONFIG)) && isBrowser && router.route === '/[prefix]/[slug]') {
+    const redirectUrl = siteConfig('LANDING_POST_REDIRECT_URL', null, CONFIG) + router.asPath.replace('?theme=landing', '')
+    router.push(redirectUrl)
+    return <div id='theme-landing'><Loading /></div>
+  }
 
-    return <LayoutBase {...props}>
+  return <LayoutBase {...props}>
 
         <div id='container-inner' className='mx-auto max-w-screen-lg p-12'>
             <NotionPage {...props} />
         </div>
     </LayoutBase>
-
-
 }
 
 // 其他布局暂时留空
@@ -106,13 +98,13 @@ const LayoutPostList = (props) => <LayoutBase {...props}><Hero /></LayoutBase>
 const LayoutTagIndex = (props) => <LayoutBase {...props}><Hero /></LayoutBase>
 
 export {
-    THEME_CONFIG,
-    LayoutIndex,
-    LayoutSearch,
-    LayoutArchive,
-    LayoutSlug,
-    Layout404,
-    LayoutPostList,
-    LayoutCategoryIndex,
-    LayoutTagIndex
+  CONFIG as THEME_CONFIG,
+  LayoutIndex,
+  LayoutSearch,
+  LayoutArchive,
+  LayoutSlug,
+  Layout404,
+  LayoutPostList,
+  LayoutCategoryIndex,
+  LayoutTagIndex
 }
diff --git a/themes/matery/components/ArticleAdjacent.js b/themes/matery/components/ArticleAdjacent.js
index c9991c8c..f87f2136 100644
--- a/themes/matery/components/ArticleAdjacent.js
+++ b/themes/matery/components/ArticleAdjacent.js
@@ -1,5 +1,6 @@
 import CONFIG from '../config'
 import BlogPostCard from './BlogPostCard'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 上一篇，下一篇文章
@@ -7,7 +8,7 @@ import BlogPostCard from './BlogPostCard'
  * @returns
  */
 export default function ArticleAdjacent ({ prev, next, siteInfo }) {
-  if (!prev || !next || !CONFIG.ARTICLE_ADJACENT) {
+  if (!prev || !next || !siteConfig('MATERY_ARTICLE_ADJACENT', null, CONFIG)) {
     return <></>
   }
   return <section className='flex flex-col justify-between  p-3 text-gray-800 items-center text-xs md:text-sm md:flex-row md:gap-2 '>
diff --git a/themes/matery/components/ArticleCopyright.js b/themes/matery/components/ArticleCopyright.js
index d8d9beb9..61a9aa16 100644
--- a/themes/matery/components/ArticleCopyright.js
+++ b/themes/matery/components/ArticleCopyright.js
@@ -1,20 +1,20 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function ArticleCopyright () {
   const router = useRouter()
-  const [path, setPath] = useState(BLOG.LINK + router.asPath)
+  const [path, setPath] = useState(siteConfig('LINK') + router.asPath)
   useEffect(() => {
     setPath(window.location.href)
   })
 
   const { locale } = useGlobal()
 
-  if (!CONFIG.ARTICLE_COPYRIGHT) {
+  if (!siteConfig('MATERY_ARTICLE_COPYRIGHT', null, CONFIG)) {
     return <></>
   }
 
@@ -24,7 +24,7 @@ export default function ArticleCopyright () {
         <li>
           <strong className='mr-2'>{locale.COMMON.AUTHOR}:</strong>
           <Link href={'/about'} className="hover:underline">
-            {BLOG.AUTHOR}
+            {siteConfig('AUTHOR')}
           </Link>
         </li>
         <li>
diff --git a/themes/matery/components/ArticleRecommend.js b/themes/matery/components/ArticleRecommend.js
index 8fc53a84..0751fbaf 100644
--- a/themes/matery/components/ArticleRecommend.js
+++ b/themes/matery/components/ArticleRecommend.js
@@ -1,6 +1,6 @@
 import Link from 'next/link'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import LazyImage from '@/components/LazyImage'
 
@@ -13,7 +13,7 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
   const { locale } = useGlobal()
 
   if (
-    !CONFIG.ARTICLE_RECOMMEND ||
+    !siteConfig('MATERY_ARTICLE_RECOMMEND', null, CONFIG) ||
         !recommendPosts ||
         recommendPosts.length === 0
   ) {
@@ -38,7 +38,7 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
                     (<Link
                             key={post.id}
                             title={post.title}
-                            href={`${BLOG.SUB_PATH}/${post.slug}`}
+                            href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                             passHref
                             className="flex h-40 cursor-pointer overflow-hidden">
 
diff --git a/themes/matery/components/BlogPostArchive.js b/themes/matery/components/BlogPostArchive.js
index ea3c6cd2..0eec29f5 100644
--- a/themes/matery/components/BlogPostArchive.js
+++ b/themes/matery/components/BlogPostArchive.js
@@ -1,6 +1,6 @@
-import React from 'react'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
+
 /**
  * 博客归档列表
  * @param posts 所有文章
@@ -30,7 +30,7 @@ const BlogPostArchive = ({ posts = [], archiveTitle }) => {
                 <span className="text-gray-400">{post.date?.start_date}</span>{' '}
                 &nbsp;
                 <Link
-                  href={`${BLOG.SUB_PATH}/${post.slug}`}
+                  href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                   passHref
                   className="dark:text-gray-400  dark:hover:text-indigo-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
 
diff --git a/themes/matery/components/BlogPostCard.js b/themes/matery/components/BlogPostCard.js
index 5fa034cc..13aef2e0 100644
--- a/themes/matery/components/BlogPostCard.js
+++ b/themes/matery/components/BlogPostCard.js
@@ -1,6 +1,5 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
-import React from 'react'
 import TagItemMini from './TagItemMini'
 import CONFIG from '../config'
 import TwikooCommentCount from '@/components/TwikooCommentCount'
@@ -9,12 +8,12 @@ import { formatDateFmt } from '@/lib/formatDate'
 // import Image from 'next/image'
 
 const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
-  const showPreview = CONFIG.POST_LIST_PREVIEW && post.blockMap
+  const showPreview = siteConfig('MATERY_POST_LIST_PREVIEW', null, CONFIG) && post.blockMap
   // matery 主题默认强制显示图片
   if (post && !post.pageCoverThumbnail) {
     post.pageCoverThumbnail = siteInfo?.pageCover
   }
-  const showPageCover = CONFIG.POST_LIST_COVER && post?.pageCoverThumbnail
+  const showPageCover = siteConfig('MATERY_POST_LIST_COVER', null, CONFIG) && post?.pageCoverThumbnail
   const delay = (index % 3) * 300
   return (
         <div
@@ -30,7 +29,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
 
                 {/* 头部图片 填充卡片 */}
                 {showPageCover && (
-                    <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
+                    <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
                         <div className="flex flex-grow w-full relative duration-200 = rounded-t-md cursor-pointer transform overflow-hidden">
                             <LazyImage
                                 src={post?.pageCoverThumbnail}
diff --git a/themes/matery/components/BlogPostListPage.js b/themes/matery/components/BlogPostListPage.js
index 7d5226dc..7f7c4b6f 100644
--- a/themes/matery/components/BlogPostListPage.js
+++ b/themes/matery/components/BlogPostListPage.js
@@ -1,5 +1,5 @@
 import BlogPostCard from './BlogPostCard'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import BlogPostListEmpty from './BlogPostListEmpty'
 import PaginationSimple from './PaginationSimple'
 
@@ -12,8 +12,8 @@ import PaginationSimple from './PaginationSimple'
  * @constructor
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
-  const showPagination = postCount >= BLOG.POSTS_PER_PAGE
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+  const showPagination = postCount >= parseInt(siteConfig('POSTS_PER_PAGE'))
   if (!posts || posts.length === 0 || page > totalPage) {
     return <BlogPostListEmpty />
   } else {
diff --git a/themes/matery/components/BlogPostListScroll.js b/themes/matery/components/BlogPostListScroll.js
index 6d0f4743..d7ce5ae4 100644
--- a/themes/matery/components/BlogPostListScroll.js
+++ b/themes/matery/components/BlogPostListScroll.js
@@ -1,8 +1,8 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import BlogPostCard from './BlogPostCard'
 import BlogPostListEmpty from './BlogPostListEmpty'
 import { useGlobal } from '@/lib/global'
-import React, { useCallback } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import CONFIG from '../config'
 import { getListByPage } from '@/lib/utils'
 import throttle from 'lodash.throttle'
@@ -14,11 +14,20 @@ import throttle from 'lodash.throttle'
  * @returns {JSX.Element}
  * @constructor
  */
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.POST_LIST_SUMMARY, siteInfo }) => {
-  const postsPerPage = BLOG.POSTS_PER_PAGE
-  const [page, updatePage] = React.useState(1)
+const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('MATERY_POST_LIST_SUMMARY', null, CONFIG), siteInfo }) => {
+  const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+  const [page, updatePage] = useState(1)
   const postsToShow = getListByPage(posts, page, postsPerPage)
+  // 监听滚动
+  useEffect(() => {
+    window.addEventListener('scroll', scrollTrigger)
+    return () => {
+      window.removeEventListener('scroll', scrollTrigger)
+    }
+  })
 
+  const targetRef = useRef(null)
+  const { locale } = useGlobal()
   let hasMore = false
   if (posts) {
     const totalCount = posts.length
@@ -40,16 +49,6 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.PO
       }
     })
   }, throttleMs))
-  // 监听滚动
-  React.useEffect(() => {
-    window.addEventListener('scroll', scrollTrigger)
-    return () => {
-      window.removeEventListener('scroll', scrollTrigger)
-    }
-  })
-
-  const targetRef = React.useRef(null)
-  const { locale } = useGlobal()
 
   if (!postsToShow || postsToShow.length === 0) {
     return <BlogPostListEmpty currentSearch={currentSearch} />
diff --git a/themes/matery/components/CategoryGroup.js b/themes/matery/components/CategoryGroup.js
index ad4e7b2a..62046784 100644
--- a/themes/matery/components/CategoryGroup.js
+++ b/themes/matery/components/CategoryGroup.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 const CategoryGroup = ({ currentCategory, categories }) => {
   if (!categories) {
diff --git a/themes/matery/components/FloatDarkModeButton.js b/themes/matery/components/FloatDarkModeButton.js
index f912c57b..e42dac8d 100644
--- a/themes/matery/components/FloatDarkModeButton.js
+++ b/themes/matery/components/FloatDarkModeButton.js
@@ -1,11 +1,12 @@
 import { useGlobal } from '@/lib/global'
 import { saveDarkModeToCookies } from '@/themes/theme'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function FloatDarkModeButton() {
   const { isDarkMode, updateDarkMode } = useGlobal()
 
-  if (!CONFIG.WIDGET_DARK_MODE) {
+  if (!siteConfig('WIDGET_DARK_MODE', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/matery/components/Footer.js b/themes/matery/components/Footer.js
index 5f1f65b7..b75368b4 100644
--- a/themes/matery/components/Footer.js
+++ b/themes/matery/components/Footer.js
@@ -1,13 +1,11 @@
-import React from 'react'
-import BLOG from '@/blog.config'
-// import DarkModeButton from '@/components/DarkModeButton'
+import { siteConfig } from '@/lib/config'
 
 const Footer = ({ title }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
   const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
+    if (Number.isInteger(siteConfig('SINCE')) && siteConfig('SINCE') < currentYear) {
+      return siteConfig('SINCE') + '-' + currentYear
     }
     return currentYear
   })()
@@ -18,9 +16,9 @@ const Footer = ({ title }) => {
     >
       {/* <DarkModeButton/> */}
 
-      <i className='fas fa-copyright' /> {`${copyrightDate}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={BLOG.LINK} className='underline font-bold  dark:text-gray-300 '>{BLOG.AUTHOR}</a>.<br/>
+      <i className='fas fa-copyright' /> {`${copyrightDate}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={siteConfig('LINK')} className='underline font-bold  dark:text-gray-300 '>{siteConfig('AUTHOR')}</a>.<br/>
 
-      {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
+      {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a><br/></>}
 
       <span className='hidden busuanzi_container_site_pv'>
             <i className='fas fa-eye'/><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
@@ -28,7 +26,7 @@ const Footer = ({ title }) => {
         <i className='fas fa-users'/> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
         <br/>
         <h1>{title}</h1>
-        <span className='text-xs '>Powered by <a href='https://github.com/tangly1024/NotionNext' className='underline dark:text-gray-300'>NotionNext {BLOG.VERSION}</a>.</span></span><br/>
+        <span className='text-xs '>Powered by <a href='https://github.com/tangly1024/NotionNext' className='underline dark:text-gray-300'>NotionNext {siteConfig('VERSION')}</a>.</span></span><br/>
 
     </footer>
   )
diff --git a/themes/matery/components/Hero.js b/themes/matery/components/Hero.js
index a7157b68..cd2f19ab 100644
--- a/themes/matery/components/Hero.js
+++ b/themes/matery/components/Hero.js
@@ -3,8 +3,8 @@ import { useEffect, useState } from 'react'
 import Typed from 'typed.js'
 import CONFIG from '../config'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 
 let wrapperTop = 0
 
@@ -16,13 +16,14 @@ const Hero = props => {
   const [typed, changeType] = useState()
   const { siteInfo } = props
   const { locale } = useGlobal()
+  const GREETING_WORDS = siteConfig('GREETING_WORDS').split(',')
 
   useEffect(() => {
     updateHeaderHeight()
     if (!typed && window && document.getElementById('typed')) {
       changeType(
         new Typed('#typed', {
-          strings: BLOG.GREETING_WORDS.split(','),
+          strings: GREETING_WORDS,
           typeSpeed: 200,
           backSpeed: 100,
           backDelay: 400,
@@ -53,7 +54,7 @@ const Hero = props => {
 
             <div className="text-white absolute flex flex-col h-full items-center justify-center w-full ">
                 {/* 站点标题 */}
-                <div className='text-4xl md:text-5xl shadow-text'>{siteInfo?.title}</div>
+                <div className='text-4xl md:text-5xl shadow-text'>{siteConfig('TITLE')}</div>
                 {/* 站点欢迎语 */}
                 <div className='mt-2 h-12 items-center text-center shadow-text text-white text-lg'>
                     <span id='typed' />
@@ -61,12 +62,12 @@ const Hero = props => {
                 {/* 滚动按钮 */}
                 <div onClick={() => { window.scrollTo({ top: wrapperTop, behavior: 'smooth' }) }}
                     className="mt-12 border cursor-pointer w-40 text-center pt-4 pb-3 text-md text-white hover:bg-orange-600 duration-300 rounded-3xl z-40">
-                    <i className='animate-bounce fas fa-angle-double-down' /> <span>{CONFIG.SHOW_START_READING && locale.COMMON.START_READING}</span>
+                    <i className='animate-bounce fas fa-angle-double-down' /> <span>{siteConfig('MATERY_SHOW_START_READING', null, CONFIG) && locale.COMMON.START_READING}</span>
                 </div>
             </div>
 
             <LazyImage priority={true} id='header-cover'src={siteInfo?.pageCover}
-                className={`header-cover object-center w-full h-screen object-cover ${CONFIG.HOME_NAV_BACKGROUND_IMG_FIXED ? 'fixed' : ''}`} />
+                className={`header-cover object-center w-full h-screen object-cover ${siteConfig('MATERY_HOME_NAV_BACKGROUND_IMG_FIXED', null, CONFIG) ? 'fixed' : ''}`} />
 
         </header>
   )
diff --git a/themes/matery/components/HexoRecentComments.js b/themes/matery/components/HexoRecentComments.js
index 4bdbb82f..29dedb38 100644
--- a/themes/matery/components/HexoRecentComments.js
+++ b/themes/matery/components/HexoRecentComments.js
@@ -1,5 +1,5 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { useEffect, useState } from 'react'
+import { siteConfig } from '@/lib/config'
 import Card from '@/themes/hexo/components/Card'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
@@ -11,12 +11,12 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const HexoRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
+  const [comments, updateComments] = useState([])
   const { locale } = useGlobal()
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/matery/components/InfoCard.js b/themes/matery/components/InfoCard.js
index 0591d3a2..93133d64 100644
--- a/themes/matery/components/InfoCard.js
+++ b/themes/matery/components/InfoCard.js
@@ -1,9 +1,10 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useRouter } from 'next/router'
 import Card from './Card'
 import SocialButton from './SocialButton'
 import MenuGroupCard from './MenuGroupCard'
 import LazyImage from '@/components/LazyImage'
+
 export function InfoCard (props) {
   const { className, siteInfo } = props
   const router = useRouter()
@@ -14,10 +15,10 @@ export function InfoCard (props) {
         router.push('/')
       }}
     >
-    <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={BLOG.AUTHOR}/>
+    <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={siteConfig('AUTHOR')}/>
     </div>
-    <div className='text-center text-xl pb-4'>{BLOG.AUTHOR}</div>
-    <div className='text-sm text-center'>{BLOG.BIO}</div>
+    <div className='text-center text-xl pb-4'>{siteConfig('AUTHOR')}</div>
+    <div className='text-sm text-center'>{siteConfig('BIO')}</div>
     <MenuGroupCard {...props}/>
     <SocialButton />
   </Card>
diff --git a/themes/matery/components/JumpToCommentButton.js b/themes/matery/components/JumpToCommentButton.js
index 98abb03f..0ebc73a6 100644
--- a/themes/matery/components/JumpToCommentButton.js
+++ b/themes/matery/components/JumpToCommentButton.js
@@ -1,5 +1,5 @@
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到评论区
@@ -7,7 +7,7 @@ import CONFIG from '../config'
  * @constructor
  */
 const JumpToCommentButton = () => {
-  if (!CONFIG.WIDGET_TO_COMMENT) {
+  if (!siteConfig('MATERY_WIDGET_TO_COMMENT', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/matery/components/JumpToTopButton.js b/themes/matery/components/JumpToTopButton.js
index 2b1e3018..b052bd00 100644
--- a/themes/matery/components/JumpToTopButton.js
+++ b/themes/matery/components/JumpToTopButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到网页顶部
@@ -13,7 +13,7 @@ import CONFIG from '../config'
 const JumpToTopButton = ({ showPercent = true, percent }) => {
   const { locale } = useGlobal()
 
-  if (!CONFIG.WIDGET_TO_TOP) {
+  if (!siteConfig('MATERY_WIDGET_TO_TOP', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/matery/components/Logo.js b/themes/matery/components/Logo.js
index 3b615c5e..3e6542f4 100644
--- a/themes/matery/components/Logo.js
+++ b/themes/matery/components/Logo.js
@@ -1,13 +1,11 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
-import React from 'react'
 
 const Logo = props => {
-  const { siteInfo } = props
   return (
     <Link href='/' passHref legacyBehavior>
       <div className='flex flex-col justify-center items-center cursor-pointer space-y-3'>
-        <div className=' text-lg p-1.5 rounded dark:border-white hover:scale-110 transform duration-200'> {siteInfo?.title || BLOG.TITLE}</div>
+        <div className=' text-lg p-1.5 rounded dark:border-white hover:scale-110 transform duration-200'> {siteConfig('TITLE') }</div>
       </div>
     </Link>
   )
diff --git a/themes/matery/components/MenuGroupCard.js b/themes/matery/components/MenuGroupCard.js
index 1c04f4e7..acd0c3b2 100644
--- a/themes/matery/components/MenuGroupCard.js
+++ b/themes/matery/components/MenuGroupCard.js
@@ -1,7 +1,7 @@
-import React from 'react'
 import Link from 'next/link'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 const MenuGroupCard = (props) => {
   const { postCount, categories, tags } = props
@@ -11,9 +11,9 @@ const MenuGroupCard = (props) => {
   const tagSlot = <div className='text-center'>{tags?.length}</div>
 
   const links = [
-    { name: locale.COMMON.ARTICLE, to: '/archive', slot: archiveSlot, show: CONFIG.MENU_ARCHIVE },
-    { name: locale.COMMON.CATEGORY, to: '/category', slot: categorySlot, show: CONFIG.MENU_CATEGORY },
-    { name: locale.COMMON.TAGS, to: '/tag', slot: tagSlot, show: CONFIG.MENU_TAG }
+    { name: locale.COMMON.ARTICLE, to: '/archive', slot: archiveSlot, show: siteConfig('MATERY_MENU_ARCHIVE', null, CONFIG) },
+    { name: locale.COMMON.CATEGORY, to: '/category', slot: categorySlot, show: siteConfig('MATERY_MENU_CATEGORY', null, CONFIG) },
+    { name: locale.COMMON.TAGS, to: '/tag', slot: tagSlot, show: siteConfig('MATERY_MENU_TAG', null, CONFIG) }
   ]
 
   return (
diff --git a/themes/matery/components/MenuItemCollapse.js b/themes/matery/components/MenuItemCollapse.js
index 1bf88c81..dbd9aca1 100644
--- a/themes/matery/components/MenuItemCollapse.js
+++ b/themes/matery/components/MenuItemCollapse.js
@@ -49,8 +49,8 @@ export const MenuItemCollapse = ({ link }) => {
 
         {/* 折叠子菜单 */}
         {hasSubMenu && <Collapse isOpen={isOpen}>
-            {link.subMenus.map(sLink => {
-              return <div key={sLink.id} className='cursor-pointer whitespace-nowrap dark:text-gray-200  w-full font-extralight dark:bg-black text-left px-5 justify-start bg-gray-100  hover:bg-indigo-700 hover:text-white dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
+            {link.subMenus.map((sLink, index) => {
+              return <div key={index} className='cursor-pointer whitespace-nowrap dark:text-gray-200  w-full font-extralight dark:bg-black text-left px-5 justify-start bg-gray-100  hover:bg-indigo-700 hover:text-white dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
                         <span className='text-sm'><i className={`${sLink.icon} w-4 mr-3 text-center`} />{sLink.title}</span>
                     </Link>
diff --git a/themes/matery/components/MenuItemDrop.js b/themes/matery/components/MenuItemDrop.js
index 1fb3263a..5e666fa4 100644
--- a/themes/matery/components/MenuItemDrop.js
+++ b/themes/matery/components/MenuItemDrop.js
@@ -28,8 +28,8 @@ export const MenuItemDrop = ({ link }) => {
 
         {/* 子菜单 */}
         {hasSubMenu && <ul style={{ backdropFilter: 'blur(3px)' }} className={`${show ? 'visible opacity-100 top-12' : 'invisible opacity-0 top-20'} drop-shadow-md overflow-hidden rounded-md bg-white transition-all duration-300 z-20 absolute block  `}>
-            {link.subMenus.map(sLink => {
-              return <li key={sLink.id} className='cursor-pointer hover:bg-indigo-300 text-gray-900 hover:text-black tracking-widest transition-all duration-200 dark:border-gray-800  py-1 pr-6 pl-3'>
+            {link.subMenus.map((sLink, index) => {
+              return <li key={index} className='cursor-pointer hover:bg-indigo-300 text-gray-900 hover:text-black tracking-widest transition-all duration-200 dark:border-gray-800  py-1 pr-6 pl-3'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
                         <span className='text-sm text-nowrap font-extralight'>{link?.icon && <i className={sLink?.icon} > &nbsp; </i>}{sLink.title}</span>
                     </Link>
diff --git a/themes/matery/components/MenuList.js b/themes/matery/components/MenuList.js
index 6ea230f2..fb16873f 100644
--- a/themes/matery/components/MenuList.js
+++ b/themes/matery/components/MenuList.js
@@ -1,8 +1,8 @@
-import React from 'react'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 const MenuList = (props) => {
   const { postCount, customNav } = props
@@ -12,10 +12,10 @@ const MenuList = (props) => {
 
   let links = [
     { icon: 'fas fa-home', name: locale.NAV.INDEX, to: '/' || '/', show: true },
-    { icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG },
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', slot: archiveSlot, show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH }
+    { icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MATERY_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MATERY_MENU_TAG', null, CONFIG) },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', slot: archiveSlot, show: siteConfig('MATERY_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MATERY_MENU_SEARCH', null, CONFIG) }
   ]
   if (customNav) {
     links = links.concat(customNav)
diff --git a/themes/matery/components/MenuListSide.js b/themes/matery/components/MenuListSide.js
index 1dc44c93..ba8a6f22 100644
--- a/themes/matery/components/MenuListSide.js
+++ b/themes/matery/components/MenuListSide.js
@@ -1,7 +1,6 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemCollapse } from './MenuItemCollapse'
 
 export const MenuListSide = (props) => {
@@ -9,10 +8,10 @@ export const MenuListSide = (props) => {
   const { locale } = useGlobal()
 
   let links = [
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('MATERY_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MATERY_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MATERY_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MATERY_MENU_TAG', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -20,7 +19,7 @@ export const MenuListSide = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/matery/components/MenuListTop.js b/themes/matery/components/MenuListTop.js
index 58f06cba..580fe6b9 100644
--- a/themes/matery/components/MenuListTop.js
+++ b/themes/matery/components/MenuListTop.js
@@ -1,18 +1,17 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
 import { MenuItemDrop } from './MenuItemDrop'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 export const MenuListTop = (props) => {
   const { customNav, customMenu } = props
   const { locale } = useGlobal()
 
   let links = [
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('MATERY_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MATERY_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MATERY_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MATERY_MENU_TAG', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -20,7 +19,7 @@ export const MenuListTop = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/matery/components/NavButtonGroup.js b/themes/matery/components/NavButtonGroup.js
index 37d448a7..1b0d471e 100644
--- a/themes/matery/components/NavButtonGroup.js
+++ b/themes/matery/components/NavButtonGroup.js
@@ -1,5 +1,3 @@
-
-import React from 'react'
 import Link from 'next/link'
 
 /**
diff --git a/themes/matery/components/Progress.js b/themes/matery/components/Progress.js
index dcdea5ba..2ac2ca81 100644
--- a/themes/matery/components/Progress.js
+++ b/themes/matery/components/Progress.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { isBrowser } from '@/lib/utils'
 
 /**
diff --git a/themes/matery/components/SideBar.js b/themes/matery/components/SideBar.js
index 71757bc5..06437d13 100644
--- a/themes/matery/components/SideBar.js
+++ b/themes/matery/components/SideBar.js
@@ -1,6 +1,6 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import { MenuListSide } from './MenuListSide'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 侧边抽屉
@@ -16,9 +16,9 @@ const SideBar = (props) => {
       <div id='side-bar'>
           <div className="mh-48 w-full bg-indigo-700">
               <div className='mx-5 pt-6 pb-2'>
-                  <LazyImage src={siteInfo?.icon} className='cursor-pointer rounded-full' width={80} alt={BLOG.AUTHOR} />
-                  <div className='text-white text-xl my-1'>{siteInfo?.title}</div>
-                  <div className='text-xs my-1 text-gray-300'>{siteInfo?.description}</div>
+                  <LazyImage src={siteInfo?.icon} className='cursor-pointer rounded-full' width={80} alt={siteConfig('AUTHOR')} />
+                  <div className='text-white text-xl my-1'>{siteConfig('TITLE')}</div>
+                  <div className='text-xs my-1 text-gray-300'>{siteConfig('DESCRIPTION')}</div>
               </div>
           </div>
           <MenuListSide {...props} />
diff --git a/themes/matery/components/SocialButton.js b/themes/matery/components/SocialButton.js
index 9fc88a5c..ae15d1f0 100644
--- a/themes/matery/components/SocialButton.js
+++ b/themes/matery/components/SocialButton.js
@@ -1,5 +1,5 @@
-import BLOG from '@/blog.config'
-import React, { useState } from 'react'
+import { siteConfig } from '@/lib/config'
+import { useState } from 'react'
 
 /**
  * 社交联系方式按钮组 可折叠的组件
@@ -15,34 +15,34 @@ const SocialButton = () => {
   return <div className='flex flex-col transform hover:scale-105 duration-200 text-white text-center bg-indigo-700 rounded-full dark:bg-black cursor-pointer py-2.5'>
         {!show && <i onClick={toggleShow} className='transform hover:scale-125 duration-150 fas fa-user py-0.5' />}
         {show && <>
-            {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+            {siteConfig('CONTACT_GITHUB') && <a target='_blank' rel='noreferrer' title={'github'} href={siteConfig('CONTACT_GITHUB')} >
                 <i className='transform hover:scale-125 duration-150 fab fa-github ' />
             </a>}
-            {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+            {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
                 <i className='transform hover:scale-125 duration-150 fab fa-twitter ' />
             </a>}
-            {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+            {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
                 <i className='transform hover:scale-125 duration-150 fab fa-telegram ' />
             </a>}
-            {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkIn'} >
+            {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkIn'} >
                 <i className='transform hover:scale-125 duration-150 fab fa-linkedin ' />
             </a>}
-            {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+            {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
                 <i className='transform hover:scale-125 duration-150 fab fa-weibo ' />
             </a>}
-            {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+            {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
                 <i className='transform hover:scale-125 duration-150 fab fa-instagram ' />
             </a>}
-            {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+            {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
                 <i className='transform hover:scale-125 duration-150 fas fa-envelope ' />
             </a>}
-            {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+            {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
                 <i className='transform hover:scale-125 duration-150 fas fa-rss ' />
             </a>}
-            {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+            {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
                 <i className='fab fa-bilibili transform hover:scale-125 duration-150'/>
             </a>}
-            {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+            {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
                 <i className='fab fa-youtube transform hover:scale-125 duration-150'/>
             </a>}
             <i onClick={toggleShow} className='transform hover:scale-125 duration-150 fas fa-close ' />
diff --git a/themes/matery/components/TocDrawer.js b/themes/matery/components/TocDrawer.js
index 7df6d309..051e69a9 100644
--- a/themes/matery/components/TocDrawer.js
+++ b/themes/matery/components/TocDrawer.js
@@ -1,5 +1,5 @@
 import Catalog from './Catalog'
-import React, { useImperativeHandle, useState } from 'react'
+import { useImperativeHandle, useState } from 'react'
 
 /**
  * 目录抽屉栏
diff --git a/themes/matery/components/TocDrawerButton.js b/themes/matery/components/TocDrawerButton.js
index 8e5053b6..ad35ba42 100644
--- a/themes/matery/components/TocDrawerButton.js
+++ b/themes/matery/components/TocDrawerButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 点击召唤目录抽屉
@@ -11,7 +11,7 @@ import CONFIG from '../config'
  */
 const TocDrawerButton = (props) => {
   const { locale } = useGlobal()
-  if (!CONFIG.WIDGET_TOC) {
+  if (!siteConfig('MATERY_WIDGET_TOC', null, CONFIG)) {
     return <></>
   }
   return (<div onClick={props.onClick} className='py-2 px-3 cursor-pointer transform duration-200 flex justify-center items-center w-7 h-7 text-center' title={locale.POST.TOP} >
diff --git a/themes/matery/config.js b/themes/matery/config.js
index 2878e51b..705d3765 100644
--- a/themes/matery/config.js
+++ b/themes/matery/config.js
@@ -1,33 +1,33 @@
 const CONFIG = {
-  HOME_BANNER_ENABLE: true,
+  MATERY_HOME_BANNER_ENABLE: true,
   // 3.14.1以后的版本中，欢迎语在blog.config.js中配置，用英文逗号','隔开多个。
-  HOME_BANNER_GREETINGS: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
+  MATERY_HOME_BANNER_GREETINGS: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
 
-  HOME_NAV_BUTTONS: true, // 首页是否显示分类大图标按钮
-  HOME_NAV_BACKGROUND_IMG_FIXED: false, // 首页背景图滚动时是否固定，true 则滚动时图片不懂； false则随鼠标滚动
+  MATERY_HOME_NAV_BUTTONS: true, // 首页是否显示分类大图标按钮
+  MATERY_HOME_NAV_BACKGROUND_IMG_FIXED: false, // 首页背景图滚动时是否固定，true 则滚动时图片不懂； false则随鼠标滚动
 
   // 是否显示开始阅读按钮
-  SHOW_START_READING: true,
+  MATERY_SHOW_START_READING: true,
 
   // 菜单配置
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  MATERY_MENU_CATEGORY: true, // 显示分类
+  MATERY_MENU_TAG: true, // 显示标签
+  MATERY_MENU_ARCHIVE: true, // 显示归档
+  MATERY_MENU_SEARCH: true, // 显示搜索
 
-  POST_LIST_COVER: true, // 文章封面
-  POST_LIST_SUMMARY: true, // 文章摘要
-  POST_LIST_PREVIEW: true, // 读取文章预览
+  MATERY_POST_LIST_COVER: true, // 文章封面
+  MATERY_POST_LIST_SUMMARY: true, // 文章摘要
+  MATERY_POST_LIST_PREVIEW: true, // 读取文章预览
 
-  ARTICLE_ADJACENT: true, // 显示上一篇下一篇文章推荐
-  ARTICLE_COPYRIGHT: true, // 显示文章版权声明
-  ARTICLE_RECOMMEND: true, // 文章关联推荐
+  MATERY_ARTICLE_ADJACENT: true, // 显示上一篇下一篇文章推荐
+  MATERY_ARTICLE_COPYRIGHT: true, // 显示文章版权声明
+  MATERY_ARTICLE_RECOMMEND: true, // 文章关联推荐
 
-  WIDGET_LATEST_POSTS: true, // 显示最新文章卡
-  WIDGET_ANALYTICS: false, // 显示统计卡
-  WIDGET_TO_TOP: true,
-  WIDGET_TO_COMMENT: true, // 跳到评论区
+  MATERY_WIDGET_LATEST_POSTS: true, // 显示最新文章卡
+  MATERY_WIDGET_ANALYTICS: false, // 显示统计卡
+  MATERY_WIDGET_TO_TOP: true,
+  MATERY_WIDGET_TO_COMMENT: true, // 跳到评论区
   WIDGET_DARK_MODE: true, // 夜间模式
-  WIDGET_TOC: true // 移动端悬浮目录
+  MATERY_WIDGET_TOC: true // 移动端悬浮目录
 }
 export default CONFIG
diff --git a/themes/matery/index.js b/themes/matery/index.js
index d837b92e..eee59b53 100644
--- a/themes/matery/index.js
+++ b/themes/matery/index.js
@@ -3,7 +3,6 @@ import CommonHead from '@/components/CommonHead'
 import TopNav from './components/TopNav'
 import Live2D from '@/components/Live2D'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import Footer from './components/Footer'
 import { useEffect } from 'react'
 import RightFloatButtons from './components/RightFloatButtons'
@@ -31,6 +30,7 @@ import BlogListBar from './components/BlogListBar'
 import { Transition } from '@headlessui/react'
 import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 基础布局
@@ -67,7 +67,7 @@ const LayoutBase = props => {
                 {headerSlot}
             </Transition>
 
-            <main id="wrapper" className={`${CONFIG.HOME_BANNER_ENABLE ? '' : 'pt-16'} flex-1 w-full py-8 md:px-8 lg:px-24 relative`}>
+            <main id="wrapper" className={`${siteConfig('MATERY_HOME_BANNER_ENABLE', null, CONFIG) ? '' : 'pt-16'} flex-1 w-full py-8 md:px-8 lg:px-24 relative`}>
                 {/* 嵌入区域 */}
                 <div id="container-slot" className={`w-full max-w-6xl ${post && ' lg:max-w-3xl 2xl:max-w-4xl '} mt-6 px-3 mx-auto lg:flex lg:space-x-4 justify-center relative z-10`}>
                     {containerSlot}
@@ -101,7 +101,7 @@ const LayoutBase = props => {
             <RightFloatButtons {...props} />
 
             {/* 页脚 */}
-            <Footer title={siteInfo?.title || BLOG.TITLE} />
+            <Footer title={siteConfig('TITLE')} />
         </div>
   )
 }
@@ -113,7 +113,7 @@ const LayoutBase = props => {
  * @returns
  */
 const LayoutIndex = (props) => {
-  return <LayoutPostList {...props} containerSlot={<Announcement {...props} />} headerSlot={CONFIG.HOME_BANNER_ENABLE && <Hero {...props} />} />
+  return <LayoutPostList {...props} containerSlot={<Announcement {...props} />} headerSlot={siteConfig('MATERY_HOME_BANNER_ENABLE', null, CONFIG) && <Hero {...props} />} />
 }
 
 /**
@@ -124,7 +124,7 @@ const LayoutIndex = (props) => {
 const LayoutPostList = (props) => {
   return (
         <LayoutBase {...props} containerSlot={<BlogListBar {...props} />}>
-            {BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
+            {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
         </LayoutBase>
   )
 }
@@ -156,7 +156,7 @@ const LayoutSearch = props => {
             {!currentSearch
               ? <SearchNave {...props} />
               : <div id="posts-wrapper">
-                    {BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
+                    {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
                 </div>}
         </LayoutBase>
   )
@@ -307,7 +307,7 @@ const LayoutCategoryIndex = props => {
             <div id='inner-wrapper' className='w-full'>
                 <div className="drop-shadow-xl -mt-32 rounded-md mx-3 px-5 lg:border lg:rounded-xl lg:px-2 lg:py-4 bg-white dark:bg-hexo-black-gray  dark:border-black dark:text-gray-300">
                     <div className='flex justify-center flex-wrap'>
-                        {categoryOptions.map(e => {
+                        {categoryOptions?.map(e => {
                           return (
                                 <Link key={e.name} href={`/category/${e.name}`} passHref legacyBehavior>
                                     <div className='duration-300 text-md whitespace-nowrap dark:hover:text-white px-5 cursor-pointer py-2 hover:text-indigo-400' >
diff --git a/themes/medium/components/ArticleInfo.js b/themes/medium/components/ArticleInfo.js
index 0ecff45e..12c189db 100644
--- a/themes/medium/components/ArticleInfo.js
+++ b/themes/medium/components/ArticleInfo.js
@@ -1,6 +1,6 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import Link from 'next/link'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 文章详情页介绍
@@ -26,10 +26,10 @@ export default function ArticleInfo(props) {
             </div>
             <Link href="/about" passHref legacyBehavior>
                 <div className='flex pt-2'>
-                    <LazyImage src={siteInfo?.icon} className='rounded-full cursor-pointer' width={22} alt={BLOG.AUTHOR} />
+                    <LazyImage src={siteInfo?.icon} className='rounded-full cursor-pointer' width={22} alt={siteConfig('AUTHOR')} />
 
                     <div className="mr-3 ml-2 my-auto text-green-500 cursor-pointer">
-                        {BLOG.AUTHOR}
+                        {siteConfig('AUTHOR')}
                     </div>
                 </div>
             </Link>
diff --git a/themes/medium/components/BlogArchiveItem.js b/themes/medium/components/BlogArchiveItem.js
index 8e9693dc..efd67565 100644
--- a/themes/medium/components/BlogArchiveItem.js
+++ b/themes/medium/components/BlogArchiveItem.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 
 /**
@@ -23,7 +23,7 @@ export default function BlogArchiveItem({ archiveTitle, archivePosts }) {
                             </span>{' '}
                             &nbsp;
 
-                            <Link passHref href={`${BLOG.SUB_PATH}/${post.slug}`}
+                            <Link passHref href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                 className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
                                 {post.title}
                             </Link>
diff --git a/themes/medium/components/BlogPostCard.js b/themes/medium/components/BlogPostCard.js
index 16a963e6..5473a04c 100644
--- a/themes/medium/components/BlogPostCard.js
+++ b/themes/medium/components/BlogPostCard.js
@@ -1,8 +1,7 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import NotionPage from '@/components/NotionPage'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
-import React from 'react'
 import CONFIG from '../config'
 import CategoryItem from './CategoryItem'
 import TagItemMini from './TagItemMini'
@@ -10,7 +9,7 @@ import TwikooCommentCount from '@/components/TwikooCommentCount'
 import LazyImage from '@/components/LazyImage'
 
 const BlogPostCard = ({ post, showSummary }) => {
-  const showPreview = CONFIG.POST_LIST_PREVIEW && post.blockMap
+  const showPreview = siteConfig('MEDIUM_POST_LIST_PREVIEW', null, CONFIG) && post.blockMap
   const { locale } = useGlobal()
   return (
         <div
@@ -24,13 +23,13 @@ const BlogPostCard = ({ post, showSummary }) => {
 
             <div className="lg:py-8 py-4 flex flex-col w-full">
                 <Link
-                    href={`${BLOG.SUB_PATH}/${post.slug}`}
+                    href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                     passHref
                     className={
                         'cursor-pointer font-bold  hover:underline text-3xl leading-tight text-gray-700 dark:text-gray-300 hover:text-green-500 dark:hover:text-green-400'
                     }>
                     <div>
-                        {CONFIG.POST_LIST_COVER && <div className='w-full max-h-96 object-cover overflow-hidden mb-2'>
+                        {siteConfig('MEDIUM_POST_LIST_COVER', null, CONFIG) && <div className='w-full max-h-96 object-cover overflow-hidden mb-2'>
                             <LazyImage src={post.pageCoverThumbnail} style={post.pageCoverThumbnail ? {} : { height: '0px' }} className='w-full max-h-96 object-cover hover:scale-125 duration-150' />
                         </div>}
                         {post.title}
@@ -44,8 +43,8 @@ const BlogPostCard = ({ post, showSummary }) => {
                     }
                 >
                     <div className="text-sm py-1">{post.date?.start_date}</div>
-                    {CONFIG.POST_LIST_CATEGORY && <CategoryItem category={post.category} />}
-                    {CONFIG.POST_LIST_TAG && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
+                    {siteConfig('MEDIUM_POST_LIST_CATEGORY', null, CONFIG) && <CategoryItem category={post.category} />}
+                    {siteConfig('MEDIUM_POST_LIST_TAG', null, CONFIG) && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
                     <TwikooCommentCount post={post} className='hover:underline'/>
                 </div>
 
@@ -63,7 +62,7 @@ const BlogPostCard = ({ post, showSummary }) => {
                         <div className="pointer-events-none border-t pt-8 border-dashed">
                             <div className="w-full justify-start flex">
                                 <Link
-                                    href={`${BLOG.SUB_PATH}/${post.slug}`}
+                                    href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                     passHref
                                     className="hover:bg-opacity-100 hover:scale-105 duration-200 pointer-events-auto transform font-bold text-green-500 cursor-pointer">
 
diff --git a/themes/medium/components/BlogPostListPage.js b/themes/medium/components/BlogPostListPage.js
index 0d20123c..9b47bfb7 100644
--- a/themes/medium/components/BlogPostListPage.js
+++ b/themes/medium/components/BlogPostListPage.js
@@ -1,5 +1,5 @@
 import BlogPostCard from './BlogPostCard'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import BlogPostListEmpty from './BlogPostListEmpty'
 import PaginationSimple from './PaginationSimple'
 
@@ -12,7 +12,7 @@ import PaginationSimple from './PaginationSimple'
  * @constructor
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
 
   if (!posts || posts.length === 0) {
     return <BlogPostListEmpty />
diff --git a/themes/medium/components/BlogPostListScroll.js b/themes/medium/components/BlogPostListScroll.js
index 0ed06ae3..5f554a0c 100644
--- a/themes/medium/components/BlogPostListScroll.js
+++ b/themes/medium/components/BlogPostListScroll.js
@@ -1,9 +1,9 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import BlogPostCard from './BlogPostCard'
 import BlogPostListEmpty from './BlogPostListEmpty'
 import { useGlobal } from '@/lib/global'
 import throttle from 'lodash.throttle'
-import React, { useCallback, useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import { useRouter } from 'next/router'
 
 /**
@@ -14,10 +14,11 @@ import { useRouter } from 'next/router'
  * @constructor
  */
 const BlogPostListScroll = ({ posts = [], currentSearch }) => {
-  const postsPerPage = BLOG.POSTS_PER_PAGE
+  const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
   const [page, updatePage] = useState(1)
+  const router = useRouter()
   let filteredPosts = Object.assign(posts)
-  const searchKey = getSearchKey()
+  const searchKey = router?.query?.s || null
   if (searchKey) {
     filteredPosts = posts.filter(post => {
       const tagContent = post?.tags ? post?.tags.join(' ') : ''
@@ -95,12 +96,4 @@ const getPostByPage = function (page, totalPosts, postsPerPage) {
   )
 }
 
-function getSearchKey() {
-  const router = useRouter()
-  if (router.query && router.query.s) {
-    return router.query.s
-  }
-  return null
-}
-
 export default BlogPostListScroll
diff --git a/themes/medium/components/BottomMenuBar.js b/themes/medium/components/BottomMenuBar.js
index 808b74eb..fee36eb2 100644
--- a/themes/medium/components/BottomMenuBar.js
+++ b/themes/medium/components/BottomMenuBar.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 import { useMediumGlobal } from '@/themes/medium'
 import JumpToTopButton from './JumpToTopButton'
 
diff --git a/themes/medium/components/CategoryGroup.js b/themes/medium/components/CategoryGroup.js
index 1516c038..d562cd1f 100644
--- a/themes/medium/components/CategoryGroup.js
+++ b/themes/medium/components/CategoryGroup.js
@@ -1,4 +1,3 @@
-import React from 'react'
 import CategoryItem from './CategoryItem'
 
 const CategoryGroup = ({ currentCategory, categoryOptions }) => {
diff --git a/themes/medium/components/Footer.js b/themes/medium/components/Footer.js
index b9d4f49c..0c5a9211 100644
--- a/themes/medium/components/Footer.js
+++ b/themes/medium/components/Footer.js
@@ -1,25 +1,20 @@
-import React from 'react'
-import BLOG from '@/blog.config'
 import DarkModeButton from '@/components/DarkModeButton'
+import { siteConfig } from '@/lib/config'
 
 const Footer = ({ title }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return (
     <footer
       className='z-10 dark:bg-hexo-black-gray flex-shrink-0 justify-center text-center m-auto w-full leading-6 text-sm p-6 relative'
     >
        <DarkModeButton/>
-      <i className='fas fa-copyright' /> {`${copyrightDate}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={BLOG.LINK} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.<br/>
+      <i className='fas fa-copyright' /> {`${copyrightDate}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={siteConfig('LINK')} className='underline font-bold text-gray-500 dark:text-gray-300 '>{siteConfig('AUTHOR')}</a>.<br/>
 
-      {BLOG.BEI_AN && <><i className='fas fa-shield-alt'/> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
+      {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt'/> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a><br/></>}
 
       <span className='hidden busuanzi_container_site_pv'>
             <i className='fas fa-eye'/><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
@@ -27,7 +22,7 @@ const Footer = ({ title }) => {
         <i className='fas fa-users'/> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
         <br/>
         <h1>{title}</h1>
-        <span className='text-xs font-serif'>Powered by <a href='https://github.com/tangly1024/NotionNext' className='underline text-gray-500 dark:text-gray-300'>NotionNext {BLOG.VERSION}</a>.</span></span>
+        <span className='text-xs font-serif'>Powered by <a href='https://github.com/tangly1024/NotionNext' className='underline text-gray-500 dark:text-gray-300'>NotionNext {siteConfig('VERSION')}</a>.</span></span>
     </footer>
   )
 }
diff --git a/themes/medium/components/InfoCard.js b/themes/medium/components/InfoCard.js
index 13fe31c8..4b6e5cfe 100644
--- a/themes/medium/components/InfoCard.js
+++ b/themes/medium/components/InfoCard.js
@@ -1,18 +1,17 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import Router from 'next/router'
-import React from 'react'
 import SocialButton from './SocialButton'
+import { siteConfig } from '@/lib/config'
 
 const InfoCard = (props) => {
   const { siteInfo } = props
   return <div id='info-card' className='py-4'>
     <div className='items-center justify-center'>
         <div className='hover:scale-105 transform duration-200 cursor-pointer flex justify-center' onClick={ () => { Router.push('/about') }}>
-            <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={BLOG.AUTHOR}/>
+            <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={siteConfig('AUTHOR')}/>
          </div>
-        <div className='text-xl py-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-300'>{BLOG.AUTHOR}</div>
-        <div className='font-light text-gray-600 mb-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-400'>{BLOG.BIO}</div>
+        <div className='text-xl py-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-300'>{siteConfig('AUTHOR')}</div>
+        <div className='font-light text-gray-600 mb-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-400'>{siteConfig('BIO')}</div>
         <SocialButton/>
     </div>
   </div>
diff --git a/themes/medium/components/JumpToTopButton.js b/themes/medium/components/JumpToTopButton.js
index 8b2e1314..6342bf78 100644
--- a/themes/medium/components/JumpToTopButton.js
+++ b/themes/medium/components/JumpToTopButton.js
@@ -1,4 +1,5 @@
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到网页顶部
@@ -9,7 +10,7 @@ import CONFIG from '../config'
  * @constructor
  */
 const JumpToTopButton = ({ showPercent = false, percent, className }) => {
-  if (!CONFIG.WIDGET_TO_TOP) {
+  if (!siteConfig('MEDIUM_WIDGET_TO_TOP', null, CONFIG)) {
     return <></>
   }
   return (
diff --git a/themes/medium/components/LeftMenuBar.js b/themes/medium/components/LeftMenuBar.js
index e6636e19..6bde6c51 100644
--- a/themes/medium/components/LeftMenuBar.js
+++ b/themes/medium/components/LeftMenuBar.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 export default function LeftMenuBar () {
   return (
diff --git a/themes/medium/components/LogoBar.js b/themes/medium/components/LogoBar.js
index cbe59474..ff1d533d 100644
--- a/themes/medium/components/LogoBar.js
+++ b/themes/medium/components/LogoBar.js
@@ -1,11 +1,11 @@
 import Link from 'next/link'
+import { siteConfig } from '@/lib/config'
 
 export default function LogoBar (props) {
-  const { siteInfo } = props
   return (
     <div id='top-wrapper' className='w-full flex items-center '>
           <Link href='/' className='text-md md:text-xl dark:text-gray-200'>
-            {siteInfo?.title}
+            {siteConfig('TITLE')}
           </Link>
     </div>
   );
diff --git a/themes/medium/components/MenuBarMobile.js b/themes/medium/components/MenuBarMobile.js
index d21fbfe5..1e7081cb 100644
--- a/themes/medium/components/MenuBarMobile.js
+++ b/themes/medium/components/MenuBarMobile.js
@@ -1,7 +1,6 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemCollapse } from './MenuItemCollapse'
 
 export const MenuBarMobile = (props) => {
@@ -10,10 +9,10 @@ export const MenuBarMobile = (props) => {
 
   let links = [
     // { name: locale.NAV.INDEX, to: '/' || '/', show: true },
-    { name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG },
-    { name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE }
-    // { name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH }
+    { name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MEDIUM_MENU_CATEGORY', null, CONFIG) },
+    { name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MEDIUM_MENU_TAG', null, CONFIG) },
+    { name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('MEDIUM_MENU_ARCHIVE', null, CONFIG) }
+    // { name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MENU_SEARCH', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -21,7 +20,7 @@ export const MenuBarMobile = (props) => {
   }
 
   // 如果 开启自定义菜单，则不再使用 Page生成菜单。
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/medium/components/Progress.js b/themes/medium/components/Progress.js
index 62e1cc87..f6fa94a6 100644
--- a/themes/medium/components/Progress.js
+++ b/themes/medium/components/Progress.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { isBrowser } from '@/lib/utils'
 
 /**
diff --git a/themes/medium/components/SocialButton.js b/themes/medium/components/SocialButton.js
index 3a31552e..e522f114 100644
--- a/themes/medium/components/SocialButton.js
+++ b/themes/medium/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -8,34 +7,34 @@ import React from 'react'
  */
 const SocialButton = () => {
   return <div className='space-x-3 text-xl text-gray-600 dark:text-gray-400 flex-wrap flex justify-center '>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {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 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='fab fa-twitter transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='fab fa-telegram transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkedIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkedIn'} >
         <i className='transform hover:scale-125 duration-150 fab fa-linkedin dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='fab fa-weibo transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='fab fa-instagram transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='fas fa-envelope transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='fas fa-rss transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+      {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
         <i className='fab fa-bilibili transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+      {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
         <i className='fab fa-youtube transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
     </div>
diff --git a/themes/medium/components/TopNavBar.js b/themes/medium/components/TopNavBar.js
index 67c8a975..8bd3b799 100644
--- a/themes/medium/components/TopNavBar.js
+++ b/themes/medium/components/TopNavBar.js
@@ -4,7 +4,7 @@ import Collapse from '@/components/Collapse'
 import { MenuBarMobile } from './MenuBarMobile'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemDrop } from './MenuItemDrop'
 
 /**
@@ -20,10 +20,10 @@ export default function TopNavBar(props) {
   const { locale } = useGlobal()
 
   const defaultLinks = [
-    { icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG },
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH }
+    { icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MEDIUM_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MEDIUM_MENU_TAG', null, CONFIG) },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('MEDIUM_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MEDIUM_MENU_SEARCH', null, CONFIG) }
   ]
 
   let links = defaultLinks.concat(customNav)
@@ -33,7 +33,7 @@ export default function TopNavBar(props) {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/medium/config.js b/themes/medium/config.js
index 923863a2..c29a2ef2 100644
--- a/themes/medium/config.js
+++ b/themes/medium/config.js
@@ -1,24 +1,24 @@
 const CONFIG = {
 
   // Style
-  RIGHT_PANEL_DARK: process.env.NEXT_PUBLIC_MEDIUM_RIGHT_DARK || false, // 右侧面板深色模式
+  MEDIUM_RIGHT_PANEL_DARK: process.env.NEXT_PUBLIC_MEDIUM_RIGHT_DARK || false, // 右侧面板深色模式
 
-  POST_LIST_COVER: true, // 文章列表显示图片封面
-  POST_LIST_PREVIEW: true, // 列表显示文章预览
-  POST_LIST_CATEGORY: true, // 列表显示文章分类
-  POST_LIST_TAG: true, // 列表显示文章标签
+  MEDIUM_POST_LIST_COVER: true, // 文章列表显示图片封面
+  MEDIUM_POST_LIST_PREVIEW: true, // 列表显示文章预览
+  MEDIUM_POST_LIST_CATEGORY: true, // 列表显示文章分类
+  MEDIUM_POST_LIST_TAG: true, // 列表显示文章标签
 
-  POST_DETAIL_CATEGORY: true, // 文章显示分类
-  POST_DETAIL_TAG: true, // 文章显示标签
+  MEDIUM_POST_DETAIL_CATEGORY: true, // 文章显示分类
+  MEDIUM_POST_DETAIL_TAG: true, // 文章显示标签
 
   // 菜单
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  MEDIUM_MENU_CATEGORY: true, // 显示分类
+  MEDIUM_MENU_TAG: true, // 显示标签
+  MEDIUM_MENU_ARCHIVE: true, // 显示归档
+  MEDIUM_MENU_SEARCH: true, // 显示搜索
 
   // Widget
-  WIDGET_REVOLVER_MAPS: process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
-  WIDGET_TO_TOP: true // 跳回顶部
+  MEDIUM_WIDGET_REVOLVER_MAPS: process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
+  MEDIUM_WIDGET_TO_TOP: true // 跳回顶部
 }
 export default CONFIG
diff --git a/themes/medium/index.js b/themes/medium/index.js
index 82811e46..fbbbfde5 100644
--- a/themes/medium/index.js
+++ b/themes/medium/index.js
@@ -1,5 +1,4 @@
 import CONFIG from './config'
-
 import { useState, createContext, useContext, useEffect } from 'react'
 import Footer from './components/Footer'
 import InfoCard from './components/InfoCard'
@@ -11,7 +10,6 @@ import BottomMenuBar from './components/BottomMenuBar'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import Live2D from '@/components/Live2D'
-import BLOG from '@/blog.config'
 import Announcement from './components/Announcement'
 import JumpToTopButton from './components/JumpToTopButton'
 import BlogPostListPage from './components/BlogPostListPage'
@@ -36,6 +34,7 @@ import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
 import ArticleInfo from './components/ArticleInfo'
 import CommonHead from '@/components/CommonHead'
+import { siteConfig } from '@/lib/config'
 
 // 主题全局状态
 const ThemeGlobalMedium = createContext()
@@ -48,7 +47,7 @@ export const useMediumGlobal = () => useContext(ThemeGlobalMedium)
  * @constructor
  */
 const LayoutBase = props => {
-  const { children, showInfoCard = true, slotRight, slotTop, siteInfo, notice, meta } = props
+  const { children, showInfoCard = true, slotRight, slotTop, notice, meta } = props
   const { locale } = useGlobal()
   const router = useRouter()
   const [tocVisible, changeTocVisible] = useState(false)
@@ -63,7 +62,7 @@ const LayoutBase = props => {
 
             <div id='theme-medium' className='bg-white dark:bg-hexo-black-gray w-full h-full min-h-screen justify-center dark:text-gray-300'>
 
-                <main id='wrapper' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + 'relative flex justify-between w-full h-full mx-auto'}>
+                <main id='wrapper' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + 'relative flex justify-between w-full h-full mx-auto'}>
                     {/* 桌面端左侧菜单 */}
                     {/* <LeftMenuBar/> */}
 
@@ -93,18 +92,18 @@ const LayoutBase = props => {
                         </div>
 
                         {/* 底部 */}
-                        <Footer title={siteInfo?.title} />
+                        <Footer title={siteConfig('TITLE')} />
                     </div>
 
                     {/* 桌面端右侧 */}
-                    <div className={`hidden xl:block border-l dark:border-transparent w-96 relative z-10 ${CONFIG.RIGHT_PANEL_DARK ? 'bg-hexo-black-gray dark' : ''}`}>
+                    <div className={`hidden xl:block border-l dark:border-transparent w-96 relative z-10 ${siteConfig('MEDIUM_RIGHT_PANEL_DARK', null, CONFIG) ? 'bg-hexo-black-gray dark' : ''}`}>
                         <div className='py-14 px-6 sticky top-0'>
                             <Tabs>
                                 {slotRight}
                                 <div key={locale.NAV.ABOUT}>
                                     {router.pathname !== '/search' && <SearchInput className='mt-6  mb-12' />}
                                     {showInfoCard && <InfoCard {...props} />}
-                                    {CONFIG.WIDGET_REVOLVER_MAPS === 'true' && <RevolverMaps />}
+                                    {siteConfig('MEDIUM_WIDGET_REVOLVER_MAPS', null, CONFIG) === 'true' && <RevolverMaps />}
                                 </div>
                             </Tabs>
                             <Announcement post={notice} />
@@ -137,7 +136,7 @@ const LayoutIndex = (props) => {
 const LayoutPostList = (props) => {
   const slotTop = <BlogPostBar {...props} />
   return <LayoutBase {...props} slotTop={slotTop}>
-        {BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
+        {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
     </LayoutBase>
 }
 
@@ -176,9 +175,9 @@ const LayoutSlug = props => {
                     <ShareBar post={post} />
                     {/* 文章分类和标签信息 */}
                     <div className='flex justify-between'>
-                        {CONFIG.POST_DETAIL_CATEGORY && post?.category && <CategoryItem category={post?.category} />}
+                        {siteConfig('MEDIUM_POST_DETAIL_CATEGORY', null, CONFIG) && post?.category && <CategoryItem category={post?.category} />}
                         <div>
-                            {CONFIG.POST_DETAIL_TAG && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
+                            {siteConfig('MEDIUM_POST_DETAIL_TAG', null, CONFIG) && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
                         </div>
                     </div>
                     {/* 上一篇下一篇文章 */}
@@ -232,7 +231,7 @@ const LayoutSearch = (props) => {
 
         {/* 文章列表 */}
         {currentSearch && <div>
-            {BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
+            {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
         </div>}
     </LayoutBase>
 }
diff --git a/themes/nav/components/BlogArchiveItem.js b/themes/nav/components/BlogArchiveItem.js
index 8e9693dc..efd67565 100755
--- a/themes/nav/components/BlogArchiveItem.js
+++ b/themes/nav/components/BlogArchiveItem.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 
 /**
@@ -23,7 +23,7 @@ export default function BlogArchiveItem({ archiveTitle, archivePosts }) {
                             </span>{' '}
                             &nbsp;
 
-                            <Link passHref href={`${BLOG.SUB_PATH}/${post.slug}`}
+                            <Link passHref href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                 className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
                                 {post.title}
                             </Link>
diff --git a/themes/nav/components/BlogPostCard.js b/themes/nav/components/BlogPostCard.js
index 127e2480..e9567d76 100755
--- a/themes/nav/components/BlogPostCard.js
+++ b/themes/nav/components/BlogPostCard.js
@@ -1,16 +1,14 @@
-import BLOG from '@/blog.config'
 import Link from 'next/link'
 import NotionIcon from './NotionIcon'
 import { useRouter } from 'next/router'
-import React from 'react'
 
 const BlogPostCard = ({ post, className }) => {
   const router = useRouter()
   const currentSelected = router.asPath.split('?')[0] === '/' + post.slug
-  const pageIcon = post.pageIcon.indexOf("amazonaws.com")!=-1 ? post.pageIcon+"&width=88" : post.pageIcon
+  const pageIcon = post.pageIcon.indexOf('amazonaws.com') !== -1 ? post.pageIcon + '&width=88' : post.pageIcon
   return (
     <Link href={`${removeHttp(post.slug)}`} target={(checkRemoveHttp(post.slug) ? '_blank' : '_self')} passHref>
-        <div key={post.id} className={`${className} h-full rounded-lg p-4 dark:bg-neutral-800 cursor-pointer bg-white hover:bg-white rounded-2xl dark:hover:bg-gray-800 ${currentSelected ? 'bg-green-50 text-green-500' : ''}`}>
+        <div key={post.id} className={`${className} h-full rounded-2xl p-4 dark:bg-neutral-800 cursor-pointer bg-white hover:bg-white dark:hover:bg-gray-800 ${currentSelected ? 'bg-green-50 text-green-500' : ''}`}>
                 <div className="stack-entry w-full flex space-x-3 select-none dark:text-neutral-200">
                     <NotionIcon icon={pageIcon} size='10' className='text-6xl w-11 h-11 mx-1 my-0 flex-none' />
                     <div className="stack-comment flex-auto">
@@ -23,9 +21,9 @@ const BlogPostCard = ({ post, className }) => {
   )
   function removeHttp(str) {
     // 检查字符串是否包含http
-    if (str.includes("http")) {
+    if (str.includes('http')) {
       // 如果包含，找到http的位置
-      let index = str.indexOf("http");
+      const index = str.indexOf('http');
       // 返回http之后的部分
       return str.slice(index, str.length);
     } else {
@@ -35,11 +33,9 @@ const BlogPostCard = ({ post, className }) => {
   }
   function checkRemoveHttp(str) {
     // 检查字符串是否包含http
-    if (str.includes("http")) {
+    if (str.includes('http')) {
       // 如果包含，找到http的位置
-      let index = str.indexOf("http");
-      // 包含
-      return true;
+      return str.indexOf('http') > -1
     } else {
       // 不包含
       return false;
diff --git a/themes/nav/components/BlogPostItem.js b/themes/nav/components/BlogPostItem.js
index 7500e8ff..5d8c6406 100755
--- a/themes/nav/components/BlogPostItem.js
+++ b/themes/nav/components/BlogPostItem.js
@@ -1,6 +1,4 @@
 import BlogPostCard from './BlogPostCard'
-import React, { useState } from 'react'
-import NotionIcon from './NotionIcon'
 // import Collapse from '@/components/Collapse'
 
 /**
@@ -11,16 +9,11 @@ import NotionIcon from './NotionIcon'
  * @constructor
  */
 const BlogPostItem = (props) => {
-  const { group, filterLinks } = props
-//   const [isOpen, changeIsOpen] = useState(group?.selected)
-
-//   const toggleOpenSubMenu = () => {
-//     changeIsOpen(!isOpen)
-//   }
+  const { group } = props
 
   console.log('####### group')
   console.log(group)
-  
+
   if (group?.category) {
     return <>
             <div id={group?.category} className='category  text-lg font-normal pt-9 pb-4 first:pt-4 select-none flex justify-between font-sans text-neutral-800 dark:text-neutral-400 p-2' key={group?.category}>
@@ -34,7 +27,7 @@ const BlogPostItem = (props) => {
         </>
   } else {
     return <>
-            <div id='uncategory' className='category text-lg font-normal pt-9 pb-4 first:pt-4 font-bold select-none flex justify-between font-sans text-neutral-800 dark:text-neutral-400 p-2' key='uncategory'>
+            <div id='uncategory' className='category text-lg pt-9 pb-4 first:pt-4 font-bold select-none flex justify-between font-sans text-neutral-800 dark:text-neutral-400 p-2' key='uncategory'>
                 <span><i className={`text-base mr-2 ${group?.icon ? group?.icon : 'fas fa-hashtag'}`} />未分类</span>
             </div>
             <div class='card-list grid gap-4 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5'>
diff --git a/themes/nav/components/BlogPostListAll.js b/themes/nav/components/BlogPostListAll.js
index 458c790b..d1249c56 100755
--- a/themes/nav/components/BlogPostListAll.js
+++ b/themes/nav/components/BlogPostListAll.js
@@ -1,10 +1,9 @@
+/* eslint-disable */
 import BlogPostListEmpty from './BlogPostListEmpty'
-import { useRouter } from 'next/router'
 import BlogPostItem from './BlogPostItem'
 import { useNavGlobal } from '@/themes/nav'
 import CONFIG from '../config'
-import { deepClone } from '@/lib/utils'
-import { useEffect, useState, createContext, useContext } from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 博客列表滚动分页
@@ -21,22 +20,22 @@ const BlogPostListAll = (props) => {
   // const [filteredNavPages, setFilteredNavPages] = useState(allNavPages)
   const { filteredNavPages, setFilteredNavPages, allNavPages } = useNavGlobal()
   // const [filteredNavPages] = useState(allNavPages)
-  
+
   // const router = useRouter()
   // 对自定义分类格式化，方便后续使用分类名称做索引，检索同步图标信息
   // 目前只支持二级分类
-  let links = customMenu
-  let filterLinks = {}
+  const links = customMenu
+  const filterLinks = {}
   // for循环遍历数组
   links?.map((link, i) => {
-    let linkTitle = link.title + ''
+    const linkTitle = link.title + ''
     // console.log('####### link')
     // console.log(link)
     // filterLinks[linkTitle] = link
-    filterLinks[linkTitle] = { title: link.title, icon: link.icon, pageIcon: link.pageIcon  }
-    if(link?.subMenus){
+    filterLinks[linkTitle] = { title: link.title, icon: link.icon, pageIcon: link.pageIcon }
+    if (link?.subMenus) {
       link.subMenus?.map((group, index) => {
-        let subMenuTitle = group?.title + ''
+        const subMenuTitle = group?.title + ''
         // 自定义分类图标与post的category共用
         // 判断自定义分类与Post中category同名的项，将icon的值传递给post
         // filterLinks[subMenuTitle] = group
@@ -44,18 +43,17 @@ const BlogPostListAll = (props) => {
       })
     }
   })
-  
+
   console.log('####### filterLinks')
   console.log(filterLinks)
 
-
   // console.log('####### filterLinks')
   // console.log(filterLinks)
 
-  let selectedSth = false
+  const selectedSth = false
   const groupedArray = filteredNavPages?.reduce((groups, item) => {
-    let categoryName = item?.category ? item?.category : '' // 将category转换为字符串
-    let categoryIcon = filterLinks[categoryName]?.icon ? filterLinks[categoryName]?.icon : '' // 将pageIcon转换为字符串
+    const categoryName = item?.category ? item?.category : '' // 将category转换为字符串
+    const categoryIcon = filterLinks[categoryName]?.icon ? filterLinks[categoryName]?.icon : '' // 将pageIcon转换为字符串
 
     // console.log('####### categoryName')
     // console.log(categoryName)
@@ -64,7 +62,7 @@ const BlogPostListAll = (props) => {
 
     let existingGroup = null
     // 开启自动分组排序
-    if (JSON.parse(CONFIG.AUTO_SORT)) {
+    if (JSON.parse(siteConfig('NAV_AUTO_SORT', null, CONFIG))) {
       existingGroup = groups.find(group => group.category === categoryName) // 搜索同名的最后一个分组
     } else {
       existingGroup = groups[groups.length - 1] // 获取最后一个分组
@@ -87,7 +85,7 @@ const BlogPostListAll = (props) => {
     // item.icon = filterLinks[categoryName]?.icon ? filterLinks[categoryName]?.icon : ''
     // console.log('####### item')
     // console.log(item)
-    let groupSelected = false
+    const groupSelected = false
     // for (const post of group?.items) {
     //   if (router.asPath.split('?')[0] === '/' + post.slug) {
     //     groupSelected = true
@@ -133,7 +131,6 @@ const BlogPostListAll = (props) => {
   //     filterPosts.push(filterGroup)
   //   }
   // }
-  
 }
 
 export default BlogPostListAll
diff --git a/themes/nav/components/BlogPostListPage.js b/themes/nav/components/BlogPostListPage.js
index d9228b51..50936015 100755
--- a/themes/nav/components/BlogPostListPage.js
+++ b/themes/nav/components/BlogPostListPage.js
@@ -1,5 +1,4 @@
 import BlogPostCard from './BlogPostCard'
-import BLOG from '@/blog.config'
 import NavPostListEmpty from './NavPostListEmpty'
 import PaginationSimple from './PaginationSimple'
 
@@ -12,7 +11,7 @@ import PaginationSimple from './PaginationSimple'
  * @constructor
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
 
   if (!posts || posts.length === 0) {
     return <NavPostListEmpty />
diff --git a/themes/nav/components/BottomMenuBar.js b/themes/nav/components/BottomMenuBar.js
index 84a13f04..b91c9bc7 100755
--- a/themes/nav/components/BottomMenuBar.js
+++ b/themes/nav/components/BottomMenuBar.js
@@ -1,5 +1,4 @@
 import { useNavGlobal } from '@/themes/nav'
-import React from 'react'
 import JumpToTopButton from './JumpToTopButton'
 
 export default function BottomMenuBar({ post, className }) {
diff --git a/themes/nav/components/CategoryGroup.js b/themes/nav/components/CategoryGroup.js
index 1516c038..d562cd1f 100755
--- a/themes/nav/components/CategoryGroup.js
+++ b/themes/nav/components/CategoryGroup.js
@@ -1,4 +1,3 @@
-import React from 'react'
 import CategoryItem from './CategoryItem'
 
 const CategoryGroup = ({ currentCategory, categoryOptions }) => {
diff --git a/themes/nav/components/Collapse.js b/themes/nav/components/Collapse.js
index caf86152..6a169aa2 100755
--- a/themes/nav/components/Collapse.js
+++ b/themes/nav/components/Collapse.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useImperativeHandle } from 'react'
+import { useEffect, useImperativeHandle, useRef } from 'react'
 
 /**
  * 折叠面板组件，支持水平折叠、垂直折叠
@@ -7,7 +7,7 @@ import React, { useEffect, useImperativeHandle } from 'react'
  */
 const Collapse = props => {
   const { collapseRef } = props
-  const ref = React.useRef(null)
+  const ref = useRef(null)
   const type = props.type || 'vertical'
 
   useImperativeHandle(collapseRef, () => {
diff --git a/themes/nav/components/Footer.js b/themes/nav/components/Footer.js
index 4df06b6d..68750316 100755
--- a/themes/nav/components/Footer.js
+++ b/themes/nav/components/Footer.js
@@ -1,15 +1,10 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 const Footer = ({ siteInfo }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function () {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return (
         <footer
@@ -18,19 +13,19 @@ const Footer = ({ siteInfo }) => {
             {/* <hr className='pb-2' /> */}
 
             <div className='flex justify-center'>
-                <div><i className='text-xs mx-1 animate-pulse fas fa-heart' /><a href={BLOG.LINK} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.<br /></div>
+                <div><i className='text-xs mx-1 animate-pulse fas fa-heart' /><a href={siteConfig('LINK')} className='underline font-bold text-gray-500 dark:text-gray-300 '>{siteConfig('AUTHOR')}</a>.<br /></div>
                 © {`${copyrightDate}`}
             </div>
 
             <div className='text-xs font-serif py-1'>Powered By <a href='https://github.com/tangly1024/NotionNext' className='underline text-gray-500 dark:text-gray-300'>NotionNext</a></div>
 
-            {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br /></>}
+            {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a><br /></>}
 
             <span className='hidden busuanzi_container_site_pv'>
                 <i className='text-xs fas fa-eye' /><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
             <span className='pl-2 hidden busuanzi_container_site_uv'>
                 <i className='text-xs fas fa-users' /> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
-            {/*<h1 className='pt-1'>{siteInfo?.title}</h1>*/}
+            {/* <h1 className='pt-1'>{siteConfig('TITLE')}</h1> */}
 
         </footer>
   )
diff --git a/themes/nav/components/InfoCard.js b/themes/nav/components/InfoCard.js
index 13fe31c8..4b6e5cfe 100755
--- a/themes/nav/components/InfoCard.js
+++ b/themes/nav/components/InfoCard.js
@@ -1,18 +1,17 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import Router from 'next/router'
-import React from 'react'
 import SocialButton from './SocialButton'
+import { siteConfig } from '@/lib/config'
 
 const InfoCard = (props) => {
   const { siteInfo } = props
   return <div id='info-card' className='py-4'>
     <div className='items-center justify-center'>
         <div className='hover:scale-105 transform duration-200 cursor-pointer flex justify-center' onClick={ () => { Router.push('/about') }}>
-            <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={BLOG.AUTHOR}/>
+            <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={siteConfig('AUTHOR')}/>
          </div>
-        <div className='text-xl py-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-300'>{BLOG.AUTHOR}</div>
-        <div className='font-light text-gray-600 mb-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-400'>{BLOG.BIO}</div>
+        <div className='text-xl py-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-300'>{siteConfig('AUTHOR')}</div>
+        <div className='font-light text-gray-600 mb-2 hover:scale-105 transform duration-200 flex justify-center dark:text-gray-400'>{siteConfig('BIO')}</div>
         <SocialButton/>
     </div>
   </div>
diff --git a/themes/nav/components/LeftMenuBar.js b/themes/nav/components/LeftMenuBar.js
index e6636e19..6bde6c51 100755
--- a/themes/nav/components/LeftMenuBar.js
+++ b/themes/nav/components/LeftMenuBar.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 export default function LeftMenuBar () {
   return (
diff --git a/themes/nav/components/LogoBar.js b/themes/nav/components/LogoBar.js
index 3cff6732..c590a8a2 100755
--- a/themes/nav/components/LogoBar.js
+++ b/themes/nav/components/LogoBar.js
@@ -1,6 +1,6 @@
-import BLOG from '@/blog.config'
 import Link from 'next/link'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * Logo区域
@@ -15,8 +15,8 @@ export default function LogoBar(props) {
                 <Link href='/' className='md:w-48 grid justify-items-center text-md md:text-xl dark:text-gray-200'>
                     {/* eslint-disable-next-line @next/next/no-img-element */}
                     <img src={siteInfo?.icon?.replaceAll('width=400', 'width=280')}
-                        height='44px' alt={BLOG.AUTHOR + ' - ' + BLOG.NEXT_PUBLIC_BIO} className='md:block transition-all hover:scale-110 duration-150' placeholderSrc='' />
-                    {CONFIG.SHOW_TITLE_TEXT && siteInfo?.title}
+                        height='44px' alt={siteConfig('AUTHOR') + ' - ' + siteConfig('NEXT_PUBLIC_BIO')} className='md:block transition-all hover:scale-110 duration-150' placeholderSrc='' />
+                    {siteConfig('NAV_SHOW_TITLE_TEXT', null, CONFIG) && siteConfig('TITLE')}
                 </Link>
         </div>
   )
diff --git a/themes/nav/components/MenuBarMobile.js b/themes/nav/components/MenuBarMobile.js
index bfe3fe25..b80cae65 100755
--- a/themes/nav/components/MenuBarMobile.js
+++ b/themes/nav/components/MenuBarMobile.js
@@ -1,7 +1,6 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemCollapse } from './MenuItemCollapse'
 
 /**
@@ -15,10 +14,10 @@ export const MenuBarMobile = (props) => {
 
   let links = [
     // { name: locale.NAV.INDEX, to: '/' || '/', show: true },
-    { name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG },
-    { name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE }
-    // { name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH }
+    { name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('NAV_MENU_CATEGORY', null, CONFIG) },
+    { name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('NAV_MENU_TAG', null, CONFIG) },
+    { name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('NAV_MENU_ARCHIVE', null, CONFIG) }
+    // { name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MENU_SEARCH', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -26,7 +25,7 @@ export const MenuBarMobile = (props) => {
   }
 
   // 如果 开启自定义菜单，则不再使用 Page生成菜单。
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/nav/components/NavPostItem.js b/themes/nav/components/NavPostItem.js
index ed869d69..32b22694 100755
--- a/themes/nav/components/NavPostItem.js
+++ b/themes/nav/components/NavPostItem.js
@@ -1,5 +1,5 @@
 import BlogPostCard from './BlogPostCard'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import Collapse from '@/components/Collapse'
 
 /**
diff --git a/themes/nav/components/NavPostList.js b/themes/nav/components/NavPostList.js
index 0f06a008..7c382335 100755
--- a/themes/nav/components/NavPostList.js
+++ b/themes/nav/components/NavPostList.js
@@ -1,7 +1,4 @@
 import NavPostListEmpty from './NavPostListEmpty'
-import { useRouter } from 'next/router'
-import NavPostItem from './NavPostItem'
-import CONFIG from '../config'
 import Link from 'next/link'
 
 /**
@@ -12,91 +9,31 @@ import Link from 'next/link'
  * @constructor
  */
 const NavPostList = (props) => {
-  const { customMenu, categoryOptions } = props
-  // let groupedArray = categoryOptions
-  // const { filteredNavPages, categoryOptions, categories } = props
-  // const router = useRouter()
-  // let selectedSth = false
-
-  // let groupedArray = categoryOptions?.map(item) => {
-  //   // let groups = [];
-  //   groupedArray.push({ category: item.name, id: item.id, count: item.count, selected: false,items: [] })
-  //   return groups
-  // })
-
-  // const groupedArray = categoryOptions?.reduce((groups, item) => {
-  //   const categoryName = item?.name ? item?.name : '' // 将category转换为字符串
-  //   // let existingGroup = null
-  //   console.log('categoryOptions => item::')
-  //   console.log(item)
-  //   // 添加数据
-  //   groups.push({ category: item.name, id: item.id, count: item.count, selected: false, items: [] })
-  //   return groups
-  // }, [])
-
-  // 处理是否选中
-  // groupedArray?.map((group) => {
-  //   let groupSelected = false
-  //   for (const post of group?.items) {
-  //     if (router.asPath.split('?')[0] === '/' + post.slug) {
-  //       groupSelected = true
-  //       selectedSth = true
-  //     }
-  //   }
-  //   group.selected = groupSelected
-  //   return null
-  // })
-
-  // 如果都没有选中默认打开第一个
-  // if (!selectedSth && groupedArray && groupedArray?.length > 0) {
-  //   groupedArray[0].selected = true
-  // }
-
-  
-  
-  // console.log('groupedArray::')
-  // console.log(groupedArray)
-
-  // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  // if (BLOG.CUSTOM_MENU) {
-  //   links = customMenu
-  // }
-  let links = customMenu
-  return 
-    {links && links?.map((link, index) => <MenuItemDrop key={index} link={link} />)}
-  
-
-  console.log('categoryOptions::')
-  console.log(categoryOptions)
+  const { categoryOptions } = props
   if (!categoryOptions) {
     return <NavPostListEmpty />
   } else {
-    return 
-    
-    <div id='category-list' className='dark:border-gray-700 flex flex-wrap  mx-4'>
-    {categoryOptions.map(category => {
-      // const selected = currentCategory === category.name
-      let selected = false
-      return (
-        <Link
-          key={category.name}
-          href={`/category/${category.name}`}
-          passHref
-          className={(selected
-            ? 'hover:text-black dark:hover:text-gray bg-indigo-600 text-black '
-            : 'dark:text-gray-400 text-gray-500 hover:text-black dark:hover:text-white hover:bg-indigo-600') +
-            '  text-sm w-full items-center duration-300 px-2  cursor-pointer py-1 font-light'}>
+    return <div id='category-list' className='dark:border-gray-700 flex flex-wrap  mx-4'>
+            {categoryOptions?.map(category => {
+              // const selected = currentCategory === category.name
+              const selected = false
+              return (
+                    <Link
+                        key={category.name}
+                        href={`/category/${category.name}`}
+                        passHref
+                        className={(selected
+                          ? 'hover:text-black dark:hover:text-gray bg-indigo-600 text-black '
+                          : 'dark:text-gray-400 text-gray-500 hover:text-black dark:hover:text-white hover:bg-indigo-600') +
+                            '  text-sm w-full items-center duration-300 px-2  cursor-pointer py-1 font-light'}>
 
-          <div> <i className={`mr-2 fas ${selected ? 'fa-folder-open' : 'fa-folder'}`} />{category.name}({category.count})</div>
+                        <div> <i className={`mr-2 fas ${selected ? 'fa-folder-open' : 'fa-folder'}`} />{category.name}({category.count})</div>
 
-        </Link>
-        )
-      })}
-    </div>
+                    </Link>
+              )
+            })}
+        </div>
   }
-
-
-
 }
 
 export default NavPostList
diff --git a/themes/nav/components/Progress.js b/themes/nav/components/Progress.js
index 669d09a8..29feef49 100755
--- a/themes/nav/components/Progress.js
+++ b/themes/nav/components/Progress.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { isBrowser } from '@/lib/utils'
 
 /**
diff --git a/themes/nav/components/SocialButton.js b/themes/nav/components/SocialButton.js
index 164a71fc..b1bd85f9 100755
--- a/themes/nav/components/SocialButton.js
+++ b/themes/nav/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -8,28 +7,28 @@ import React from 'react'
  */
 const SocialButton = () => {
   return <div className='space-x-3 text-xl text-gray-600 dark:text-gray-400 flex-wrap flex justify-center '>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {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 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='fab fa-twitter transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='fab fa-telegram transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkedIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkedIn'} >
         <i className='transform hover:scale-125 duration-150 fab fa-linkedin dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='fab fa-weibo transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='fab fa-instagram transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='fas fa-envelope transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='fas fa-rss transform hover:scale-125 duration-150 hover:text-green-600'/>
       </a>}
     </div>
diff --git a/themes/nav/config.js b/themes/nav/config.js
index 48ca7d31..910a59ac 100755
--- a/themes/nav/config.js
+++ b/themes/nav/config.js
@@ -1,20 +1,20 @@
 const CONFIG = {
 
-  INDEX_PAGE: 'about', // 文档首页显示的文章，请确此路径包含在您的notion数据库中
+  NAV_INDEX_PAGE: 'about', // 文档首页显示的文章，请确此路径包含在您的notion数据库中
 
-  AUTO_SORT: process.env.NEXT_PUBLIC_GITBOOK_AUTO_SORT || true, // 是否自动按分类名 归组排序文章；自动归组可能会打乱您Notion中的文章顺序
+  NAV_AUTO_SORT: process.env.NEXT_PUBLIC_GITBOOK_AUTO_SORT || true, // 是否自动按分类名 归组排序文章；自动归组可能会打乱您Notion中的文章顺序
 
-  SHOW_TITLE_TEXT: false, // 标题栏显示文本
-  USE_CUSTOM_MENU: true, // 使用自定义菜单（可支持子菜单，支持自定义分类图标），若为true则显示所有的category分类
+  NAV_SHOW_TITLE_TEXT: false, // 标题栏显示文本
+  NAV_USE_CUSTOM_MENU: true, // 使用自定义菜单（可支持子菜单，支持自定义分类图标），若为true则显示所有的category分类
 
   // 菜单
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  NAV_MENU_CATEGORY: true, // 显示分类
+  NAV_MENU_TAG: true, // 显示标签
+  NAV_MENU_ARCHIVE: true, // 显示归档
+  NAV_MENU_SEARCH: true, // 显示搜索
 
   // Widget
-  WIDGET_REVOLVER_MAPS: process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
-  WIDGET_TO_TOP: true // 跳回顶部
+  NAV_WIDGET_REVOLVER_MAPS: process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
+  NAV_WIDGET_TO_TOP: true // 跳回顶部
 }
 export default CONFIG
diff --git a/themes/nav/index.js b/themes/nav/index.js
index e34c378b..d4870f12 100755
--- a/themes/nav/index.js
+++ b/themes/nav/index.js
@@ -11,7 +11,6 @@ import { useEffect, useState, createContext, useContext } from 'react'
 import Footer from './components/Footer'
 import TopNavBar from './components/TopNavBar'
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import Announcement from './components/Announcement'
 import PageNavDrawer from './components/PageNavDrawer'
 import FloatTocButton from './components/FloatTocButton'
@@ -33,6 +32,7 @@ import Link from 'next/link'
 import dynamic from 'next/dynamic'
 
 import { MenuItem } from './components/MenuItem'
+import { siteConfig } from '@/lib/config'
 const WWAds = dynamic(() => import('@/components/WWAds'), { ssr: false })
 
 // 主题全局变量
@@ -61,7 +61,7 @@ const LayoutBase = (props) => {
   let links = customMenu
 
   // 默认使用自定义菜单，否则将遍历所有的category生成菜单
-  if (!CONFIG.USE_CUSTOM_MENU) {
+  if (!siteConfig('NAV_USE_CUSTOM_MENU', null, CONFIG)) {
     links = categoryOptions && categoryOptions?.map(c => {
       return { id: c.name, title: `# ${c.name}`, to: `/category/${c.name}`, show: true }
     })
@@ -81,7 +81,7 @@ const LayoutBase = (props) => {
                 <TopNavBar {...props} />
 
                 {/* 左右布局区块 */}
-                <main id='wrapper' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + ' relative flex justify-between w-full h-screen mx-auto'}>
+                <main id='wrapper' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + ' relative flex justify-between w-full h-screen mx-auto'}>
 
                     {/* 左侧推拉抽屉 */}
                     <div className={'font-sans hidden md:block dark:border-transparent relative z-10 mx-4 w-52 max-h-full pb-44'}>
@@ -227,9 +227,9 @@ const LayoutSlug = (props) => {
                     {/* <ShareBar post={post} /> */}
                     {/* 文章分类和标签信息 */}
                     <div className='flex justify-between'>
-                        {CONFIG.POST_DETAIL_CATEGORY && post?.category && <CategoryItem category={post.category} />}
+                        {siteConfig('POST_DETAIL_CATEGORY', null, CONFIG) && post?.category && <CategoryItem category={post.category} />}
                         <div>
-                            {CONFIG.POST_DETAIL_TAG && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
+                            {siteConfig('POST_DETAIL_TAG', null, CONFIG) && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
                         </div>
                     </div>
 
diff --git a/themes/next/components/ArticleCopyright.js b/themes/next/components/ArticleCopyright.js
index 143ce4f1..236fb187 100644
--- a/themes/next/components/ArticleCopyright.js
+++ b/themes/next/components/ArticleCopyright.js
@@ -1,10 +1,11 @@
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function ArticleCopyright ({ author, url }) {
   const { locale } = useGlobal()
-  if (!CONFIG.ARTICLE_COPYRIGHT) {
+  if (!siteConfig('NEXT_ARTICLE_COPYRIGHT', null, CONFIG)) {
     return <></>
   }
   return (
diff --git a/themes/next/components/ArticleDetail.js b/themes/next/components/ArticleDetail.js
index f26b6691..6ba1c48e 100644
--- a/themes/next/components/ArticleDetail.js
+++ b/themes/next/components/ArticleDetail.js
@@ -1,4 +1,3 @@
-import BLOG from '@/blog.config'
 import BlogAround from './BlogAround'
 import Comment from '@/components/Comment'
 import RecommendPosts from './RecommendPosts'
@@ -14,6 +13,7 @@ import CONFIG from '../config'
 import NotionIcon from '@/components/NotionIcon'
 import LazyImage from '@/components/LazyImage'
 import { formatDateFmt } from '@/lib/formatDate'
+import { siteConfig } from '@/lib/config'
 
 /**
  *
@@ -22,9 +22,9 @@ import { formatDateFmt } from '@/lib/formatDate'
  */
 export default function ArticleDetail(props) {
   const { post, recommendPosts, prev, next } = props
-  const url = BLOG.LINK + useRouter().asPath
+  const url = siteConfig('LINK') + useRouter().asPath
   const { locale } = useGlobal()
-  const showArticleInfo = CONFIG.ARTICLE_INFO
+  const showArticleInfo = siteConfig('NEXT_ARTICLE_INFO', null, CONFIG)
 
   return (
         <div id="article-wrapper"
@@ -39,7 +39,7 @@ export default function ArticleDetail(props) {
 
                 {showArticleInfo && <header>
                     {/* 头图 */}
-                    {CONFIG.POST_HEADER_IMAGE_VISIBLE && post?.type && !post?.type !== 'Page' && post?.pageCover && (
+                    {siteConfig('NEXT_POST_HEADER_IMAGE_VISIBLE', null, CONFIG) && post?.type && !post?.type !== 'Page' && post?.pageCover && (
                         <div className="w-full relative md:flex-shrink-0 overflow-hidden">
                             <LazyImage alt={post.title} src={post?.pageCover} className='object-center w-full' />
                         </div>
@@ -88,7 +88,7 @@ export default function ArticleDetail(props) {
                     <ShareBar post={post} />
 
                     {/* 版权声明 */}
-                    {post?.type === 'Post' && <ArticleCopyright author={BLOG.AUTHOR} url={url} />}
+                    {post?.type === 'Post' && <ArticleCopyright author={siteConfig('AUTHOR')} url={url} />}
 
                     {/* 推荐文章 */}
                     {post?.type === 'Post' && <RecommendPosts currentPost={post} recommendPosts={recommendPosts} />}
diff --git a/themes/next/components/BlogPostArchive.js b/themes/next/components/BlogPostArchive.js
index b1f22296..c961d7f9 100644
--- a/themes/next/components/BlogPostArchive.js
+++ b/themes/next/components/BlogPostArchive.js
@@ -1,6 +1,6 @@
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
+
 /**
  * 博客归档列表
  * @param posts 所有文章
@@ -30,7 +30,7 @@ const BlogPostArchive = ({ posts = [], archiveTitle }) => {
                 <span className="text-gray-400">{post.date?.start_date}</span>{' '}
                 &nbsp;
                 <Link
-                  href={`${BLOG.SUB_PATH}/${post.slug}`}
+                  href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                   passHref
                   className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
 
diff --git a/themes/next/components/BlogPostCard.js b/themes/next/components/BlogPostCard.js
index 90224ecd..1d87b0fd 100644
--- a/themes/next/components/BlogPostCard.js
+++ b/themes/next/components/BlogPostCard.js
@@ -1,8 +1,6 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import Image from 'next/image'
 import Link from 'next/link'
-import React from 'react'
 import Card from './Card'
 import TagItemMini from './TagItemMini'
 import CONFIG from '../config'
@@ -10,10 +8,11 @@ import NotionPage from '@/components/NotionPage'
 import NotionIcon from '@/components/NotionIcon'
 import TwikooCommentCount from '@/components/TwikooCommentCount'
 import { formatDateFmt } from '@/lib/formatDate'
+import { siteConfig } from '@/lib/config'
 
 const BlogPostCard = ({ post, showSummary }) => {
   const { locale } = useGlobal()
-  const showPreview = CONFIG.POST_LIST_PREVIEW && post.blockMap
+  const showPreview = siteConfig('NEXT_POST_LIST_PREVIEW', null, CONFIG) && post.blockMap
   return (
     <Card className="w-full">
       <div
@@ -22,7 +21,7 @@ const BlogPostCard = ({ post, showSummary }) => {
       >
         <div className="lg:p-8 p-4 flex flex-col w-full">
           <Link
-            href={`${BLOG.SUB_PATH}/${post.slug}`}
+            href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
             passHref
             data-aos="fade-down"
             data-aos-duration="500"
@@ -105,7 +104,7 @@ const BlogPostCard = ({ post, showSummary }) => {
 
           <div className="text-right border-t pt-8 border-dashed">
             <Link
-              href={`${BLOG.SUB_PATH}/${post.slug}`}
+              href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
               className="hover:bg-opacity-100 hover:underline transform duration-300 p-3 text-white bg-gray-800 cursor-pointer">
 
               {locale.COMMON.ARTICLE_DETAIL}
@@ -115,8 +114,8 @@ const BlogPostCard = ({ post, showSummary }) => {
           </div>
         </div>
 
-        {CONFIG.POST_LIST_COVER && post?.pageCoverThumbnail && (
-          <Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
+        {siteConfig('NEXT_POST_LIST_COVER', null, CONFIG) && post?.pageCoverThumbnail && (
+          <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} passHref legacyBehavior>
             <div className="h-72 w-full relative duration-200 cursor-pointer transform overflow-hidden">
               <Image
                 className="hover:scale-105 transform duration-500"
diff --git a/themes/next/components/BlogPostListPage.js b/themes/next/components/BlogPostListPage.js
index c87e626a..fe87ad04 100644
--- a/themes/next/components/BlogPostListPage.js
+++ b/themes/next/components/BlogPostListPage.js
@@ -1,7 +1,7 @@
 import BlogPostCard from './BlogPostCard'
 import PaginationNumber from './PaginationNumber'
-import BLOG from '@/blog.config'
 import BlogPostListEmpty from './BlogPostListEmpty'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 文章列表分页表格
@@ -12,7 +12,7 @@ import BlogPostListEmpty from './BlogPostListEmpty'
  * @constructor
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
 
   if (!posts || posts.length === 0) {
     return <BlogPostListEmpty />
diff --git a/themes/next/components/BlogPostListScroll.js b/themes/next/components/BlogPostListScroll.js
index e9124bc6..64f42d0e 100644
--- a/themes/next/components/BlogPostListScroll.js
+++ b/themes/next/components/BlogPostListScroll.js
@@ -1,10 +1,10 @@
-import BLOG from '@/blog.config'
 import BlogPostCard from './BlogPostCard'
 import BlogPostListEmpty from './BlogPostListEmpty'
 import { useGlobal } from '@/lib/global'
 import throttle from 'lodash.throttle'
-import React, { useCallback, useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 博客列表滚动分页
@@ -13,8 +13,8 @@ import CONFIG from '../config'
  * @returns {JSX.Element}
  * @constructor
  */
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.POST_LIST_SUMMARY }) => {
-  const postsPerPage = BLOG.POSTS_PER_PAGE
+const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('NEXT_POST_LIST_SUMMARY', null, CONFIG) }) => {
+  const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
   const [page, updatePage] = useState(1)
   const postsToShow = getPostByPage(page, posts, postsPerPage)
 
diff --git a/themes/next/components/CategoryGroup.js b/themes/next/components/CategoryGroup.js
index 8e24231a..872c4a28 100644
--- a/themes/next/components/CategoryGroup.js
+++ b/themes/next/components/CategoryGroup.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 
 const CategoryGroup = ({ currentCategory, categories }) => {
   if (!categories) return <></>
diff --git a/themes/next/components/CategoryList.js b/themes/next/components/CategoryList.js
index ffe038ef..af8e3b52 100644
--- a/themes/next/components/CategoryList.js
+++ b/themes/next/components/CategoryList.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 
 const CategoryList = ({ currentCategory, categoryOptions }) => {
@@ -11,7 +10,7 @@ const CategoryList = ({ currentCategory, categoryOptions }) => {
   return (
     <ul className='flex py-1 space-x-3'>
       <li className='w-16 py-2 dark:text-gray-200 whitespace-nowrap'>{locale.COMMON.CATEGORY}</li>
-      {categoryOptions.map(category => {
+      {categoryOptions?.map(category => {
         const selected = category.name === currentCategory
         return (
           <Link
diff --git a/themes/next/components/ContactButton.js b/themes/next/components/ContactButton.js
index b9e0a75b..bc95ab25 100644
--- a/themes/next/components/ContactButton.js
+++ b/themes/next/components/ContactButton.js
@@ -1,4 +1,3 @@
-import React from 'react'
 import Link from 'next/link'
 
 /**
diff --git a/themes/next/components/FloatDarkModeButton.js b/themes/next/components/FloatDarkModeButton.js
index 6fef32ff..0cc5e5bf 100644
--- a/themes/next/components/FloatDarkModeButton.js
+++ b/themes/next/components/FloatDarkModeButton.js
@@ -1,11 +1,12 @@
 import { useGlobal } from '@/lib/global'
 import { saveDarkModeToCookies } from '@/themes/theme'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 export default function FloatDarkModeButton () {
   const { isDarkMode, updateDarkMode } = useGlobal()
 
-  if (!CONFIG.WIDGET_DARK_MODE) {
+  if (!siteConfig('NEXT_WIDGET_DARK_MODE', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/next/components/Footer.js b/themes/next/components/Footer.js
index 2afc2f7a..fc4f5de9 100644
--- a/themes/next/components/Footer.js
+++ b/themes/next/components/Footer.js
@@ -1,16 +1,11 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import DarkModeButton from '@/components/DarkModeButton'
 
 const Footer = ({ title }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function () {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return (
         <footer
@@ -20,9 +15,9 @@ const Footer = ({ title }) => {
             <span>
                 <DarkModeButton />
 
-                <i className='fas fa-copyright' /> {`${copyrightDate}`} <span className='mx-1 animate-pulse'><i className='fas fa-heart' /></span> <a href={BLOG.LINK} className='underline font-bold '>{BLOG.AUTHOR}</a>.<br />
+                <i className='fas fa-copyright' /> {`${copyrightDate}`} <span className='mx-1 animate-pulse'><i className='fas fa-heart' /></span> <a href={siteConfig('LINK')} className='underline font-bold '>{siteConfig('AUTHOR')}</a>.<br />
 
-                {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br /></>}
+                {siteConfig('BEI_AN') && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{siteConfig('BEI_AN')}</a><br /></>}
 
                 <span className='hidden busuanzi_container_site_pv'>
                     <i className='fas fa-eye' /><span className='px-1 busuanzi_value_site_pv'> </span> </span>
@@ -30,7 +25,7 @@ const Footer = ({ title }) => {
                     <i className='fas fa-users' /> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
                 <br />
                 <h1>{title}</h1>
-                <span className='text-xs font-serif  text-gray-500 dark:text-gray-300 '>Powered by  <a href='https://github.com/tangly1024/NotionNext' className='underline '>NotionNext {BLOG.VERSION}</a>.</span>
+                <span className='text-xs font-serif  text-gray-500 dark:text-gray-300 '>Powered by  <a href='https://github.com/tangly1024/NotionNext' className='underline '>NotionNext {siteConfig('VERSION')}</a>.</span>
             </span>
         </footer>
   )
diff --git a/themes/next/components/InfoCard.js b/themes/next/components/InfoCard.js
index 8dc988f6..ababf306 100644
--- a/themes/next/components/InfoCard.js
+++ b/themes/next/components/InfoCard.js
@@ -1,18 +1,17 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import Router from 'next/router'
-import React from 'react'
 import SocialButton from './SocialButton'
+import { siteConfig } from '@/lib/config'
 
 const InfoCard = (props) => {
   const { siteInfo } = props
   return <>
     <div className='flex flex-col items-center justify-center '>
         <div className='hover:rotate-45 hover:scale-125 transform duration-200 cursor-pointer' onClick={ () => { Router.push('/') }}>
-        <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={BLOG.AUTHOR}/>
+        <LazyImage src={siteInfo?.icon} className='rounded-full' width={120} alt={siteConfig('AUTHOR')}/>
         </div>
-        <div className='text-2xl font-serif dark:text-white py-2 hover:scale-105 transform duration-200'>{BLOG.AUTHOR}</div>
-        <div className='font-light dark:text-white py-2 hover:scale-105 transform duration-200 text-center'>{BLOG.BIO}</div>
+        <div className='text-2xl font-serif dark:text-white py-2 hover:scale-105 transform duration-200'>{siteConfig('AUTHOR')}</div>
+        <div className='font-light dark:text-white py-2 hover:scale-105 transform duration-200 text-center'>{siteConfig('BIO')}</div>
         <SocialButton/>
     </div>
   </>
diff --git a/themes/next/components/JumpToBottomButton.js b/themes/next/components/JumpToBottomButton.js
index cc624f2b..34d73922 100644
--- a/themes/next/components/JumpToBottomButton.js
+++ b/themes/next/components/JumpToBottomButton.js
@@ -1,5 +1,6 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到网页顶部
@@ -37,7 +38,7 @@ const JumpToBottomButton = ({ showPercent = false }) => {
     window.scrollTo({ top: targetRef.clientHeight, behavior: 'smooth' })
   }
 
-  if (!CONFIG.WIDGET_TO_BOTTOM) {
+  if (!siteConfig('NEXT_WIDGET_TO_BOTTOM', null, CONFIG)) {
     return <></>
   }
 
diff --git a/themes/next/components/JumpToTopButton.js b/themes/next/components/JumpToTopButton.js
index 9629d65b..c58e948e 100644
--- a/themes/next/components/JumpToTopButton.js
+++ b/themes/next/components/JumpToTopButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 跳转到网页顶部
@@ -12,7 +12,7 @@ import CONFIG from '../config'
  */
 const JumpToTopButton = ({ showPercent = true, percent }) => {
   const { locale } = useGlobal()
-  if (!CONFIG.WIDGET_TO_TOP) {
+  if (!siteConfig('NEXT_WIDGET_TO_TOP', null, CONFIG)) {
     return <></>
   }
   return (<div className='flex space-x-1 items-center transform hover:scale-105 duration-200 py-2 px-3' onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })} >
diff --git a/themes/next/components/LatestPostsGroup.js b/themes/next/components/LatestPostsGroup.js
index bf7cd4be..da80b68f 100644
--- a/themes/next/components/LatestPostsGroup.js
+++ b/themes/next/components/LatestPostsGroup.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
@@ -26,12 +26,12 @@ const LatestPostsGroup = ({ latestPosts }) => {
       </div>
     </div>
     {latestPosts.map(post => {
-      const selected = currentPath === `${BLOG.SUB_PATH}/${post.slug}`
+      const selected = currentPath === `${siteConfig('SUB_PATH', '')}/${post.slug}`
       return (
         (<Link
           key={post.id}
           title={post.title}
-          href={`${BLOG.SUB_PATH}/${post.slug}`}
+          href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
           passHref
           className={'my-1 flex font-light'}>
 
diff --git a/themes/next/components/LeftFloatButton.js b/themes/next/components/LeftFloatButton.js
index a84312da..bf303565 100644
--- a/themes/next/components/LeftFloatButton.js
+++ b/themes/next/components/LeftFloatButton.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import throttle from 'lodash.throttle'
 import DarkModeButton from './DarkModeButton'
 
diff --git a/themes/next/components/Logo.js b/themes/next/components/Logo.js
index dd8caed2..45b26f4d 100644
--- a/themes/next/components/Logo.js
+++ b/themes/next/components/Logo.js
@@ -1,8 +1,8 @@
 import Link from 'next/link'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 const Logo = props => {
-  const { siteInfo, className } = props
+  const { className } = props
   return (
         <Link href='/' passHref legacyBehavior>
             <div className={'flex flex-col justify-center items-center cursor-pointer bg-black dark:bg-gray-800 space-y-3 font-bold ' + className}>
@@ -10,13 +10,13 @@ const Logo = props => {
                     data-aos-duration="500"
                     data-aos-once="true"
                     data-aos-anchor-placement="top-bottom"
-                    className='font-serif text-xl text-white'> {siteInfo?.title}</div>
+                    className='font-serif text-xl text-white'> {siteConfig('TITLE')}</div>
                 <div data-aos="fade-down"
                     data-aos-duration="500"
                     data-aos-delay="300"
                     data-aos-once="true"
                     data-aos-anchor-placement="top-bottom"
-                    className='text-sm text-gray-300 font-light text-center'> {siteInfo?.description}</div>
+                    className='text-sm text-gray-300 font-light text-center'> {siteConfig('DESCRIPTION')}</div>
             </div>
         </Link>
   )
diff --git a/themes/next/components/MenuItemCollapse.js b/themes/next/components/MenuItemCollapse.js
index 20a26521..77fd4282 100644
--- a/themes/next/components/MenuItemCollapse.js
+++ b/themes/next/components/MenuItemCollapse.js
@@ -39,8 +39,8 @@ export const MenuItemCollapse = (props) => {
 
         {/* 折叠子菜单 */}
         {hasSubMenu && <Collapse isOpen={isOpen} onHeightChange={props.onHeightChange}>
-            {link.subMenus.map(sLink => {
-              return <div key={sLink.id} className='whitespace-nowrap   dark:text-gray-200
+            {link.subMenus.map((sLink, index) => {
+              return <div key={index} className='whitespace-nowrap   dark:text-gray-200
               not:last-child:border-b-0 border-b dark:border-gray-800 py-2 px-14 cursor-pointer hover:bg-gray-100
               font-extralight dark:bg-black text-left justify-start text-gray-600 bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
diff --git a/themes/next/components/MenuList.js b/themes/next/components/MenuList.js
index ec03a7bd..96d0726e 100644
--- a/themes/next/components/MenuList.js
+++ b/themes/next/components/MenuList.js
@@ -1,7 +1,6 @@
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { MenuItemDrop } from './MenuItemDrop'
 import { MenuItemCollapse } from './MenuItemCollapse'
 
@@ -12,9 +11,9 @@ export const MenuList = (props) => {
 
   const defaultLinks = [
     { id: 1, icon: 'fas fa-home', name: locale.NAV.INDEX, to: '/' || '/', show: true },
-    { id: 2, icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { id: 3, icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG },
-    { id: 4, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', slot: archiveSlot, show: CONFIG.MENU_ARCHIVE }
+    { id: 2, icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('NEXT_MENU_CATEGORY', null, CONFIG) },
+    { id: 3, icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('NEXT_MENU_TAG', null, CONFIG) },
+    { id: 4, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', slot: archiveSlot, show: siteConfig('NEXT_MENU_ARCHIVE', null, CONFIG) }
   ]
 
   let links = [].concat(defaultLinks)
@@ -23,7 +22,7 @@ export const MenuList = (props) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
@@ -40,12 +39,12 @@ export const MenuList = (props) => {
                 data-aos-once="true"
                 data-aos-anchor-placement="top-bottom"
                 className='hidden md:block leading-8 text-gray-500 dark:text-gray-400 font-sans'>
-                {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>
 
             {/* 移动端菜单 */}
             <div id='nav-menu-mobile' className='block md:hidden my-auto justify-start bg-white'>
-                {links?.map(link => link && link.show && <MenuItemCollapse onHeightChange={props.onHeightChange} key={link?.id} link={link} />)}
+                {links?.map((link, index) => link && link.show && <MenuItemCollapse onHeightChange={props.onHeightChange} key={index} link={link} />)}
             </div>
         </>
   )
diff --git a/themes/next/components/NextRecentComments.js b/themes/next/components/NextRecentComments.js
index 2564949e..0237b07f 100644
--- a/themes/next/components/NextRecentComments.js
+++ b/themes/next/components/NextRecentComments.js
@@ -1,7 +1,7 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { useEffect, useState } from 'react'
 import Link from 'next/link'
 import { RecentComments } from '@waline/client'
+import { siteConfig } from '@/lib/config'
 
 /**
  * @see https://waline.js.org/guide/get-started.html
@@ -9,11 +9,11 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const NextRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [comments, updateComments] = useState([])
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/next/components/Progress.js b/themes/next/components/Progress.js
index 8eab47e9..bc206206 100644
--- a/themes/next/components/Progress.js
+++ b/themes/next/components/Progress.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { isBrowser } from '@/lib/utils'
 
 /**
diff --git a/themes/next/components/RecommendPosts.js b/themes/next/components/RecommendPosts.js
index 1626f664..9be418da 100644
--- a/themes/next/components/RecommendPosts.js
+++ b/themes/next/components/RecommendPosts.js
@@ -1,16 +1,16 @@
-import React from 'react'
 import Link from 'next/link'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 展示文章推荐
  */
 const RecommendPosts = ({ recommendPosts }) => {
-  if (!CONFIG.ARTICLE_RELATE_POSTS || !recommendPosts || recommendPosts.length < 1) {
+  const { locale } = useGlobal()
+  if (!siteConfig('NEXT_ARTICLE_RELATE_POSTS', null, CONFIG) || !recommendPosts || recommendPosts.length < 1) {
     return <></>
   }
-  const { locale } = useGlobal()
 
   return (
     <div className="pt-2 border pl-4 py-2 my-4 dark:text-gray-300 ">
diff --git a/themes/next/components/RewardButton.js b/themes/next/components/RewardButton.js
index 44733d6d..fe3e10bb 100644
--- a/themes/next/components/RewardButton.js
+++ b/themes/next/components/RewardButton.js
@@ -1,4 +1,3 @@
-import React from 'react'
 import Image from 'next/image'
 
 /**
diff --git a/themes/next/components/SideAreaLeft.js b/themes/next/components/SideAreaLeft.js
index 0fb39643..9aed7c97 100644
--- a/themes/next/components/SideAreaLeft.js
+++ b/themes/next/components/SideAreaLeft.js
@@ -3,13 +3,12 @@ import { MenuList } from './MenuList'
 import SearchInput from './SearchInput'
 import Toc from './Toc'
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import Tabs from '@/components/Tabs'
 import Logo from './Logo'
 import Card from './Card'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
 import Live2D from '@/components/Live2D'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 侧边平铺
@@ -24,7 +23,7 @@ const SideAreaLeft = props => {
   const { post, slot, postCount } = props
   const { locale } = useGlobal()
   const showToc = post && post.toc && post.toc.length > 1
-  return <aside id='left' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'ml-4' : 'mr-4') + ' hidden lg:block flex-col w-60 z-20 relative'}>
+  return <aside id='left' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'ml-4' : 'mr-4') + ' hidden lg:block flex-col w-60 z-20 relative'}>
 
         <section
             className='w-60'>
@@ -34,7 +33,7 @@ const SideAreaLeft = props => {
                 <div className='pt-2 px-2 font-sans'>
                     <MenuList allowCollapse={true} {...props} />
                 </div>
-                {CONFIG.MENU_SEARCH && <div className='px-2 pt-2 font-sans'>
+                {siteConfig('NEXT_MENU_SEARCH', null, CONFIG) && <div className='px-2 pt-2 font-sans'>
                     <SearchInput {...props} />
                 </div>}
 
diff --git a/themes/next/components/SideAreaRight.js b/themes/next/components/SideAreaRight.js
index ee694d35..4a4b30b8 100644
--- a/themes/next/components/SideAreaRight.js
+++ b/themes/next/components/SideAreaRight.js
@@ -1,15 +1,14 @@
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
-import React from 'react'
 import Card from './Card'
 import CategoryGroup from './CategoryGroup'
 import TagGroups from './TagGroups'
 import CONFIG from '../config'
 import { useRouter } from 'next/router'
-import BLOG from '@/blog.config'
 import dynamic from 'next/dynamic'
 import Announcement from './Announcement'
 import LatestPostsGroup from './LatestPostsGroup'
+import { siteConfig } from '@/lib/config'
 const NextRecentComments = dynamic(() => import('./NextRecentComments'))
 
 /**
@@ -28,9 +27,9 @@ const SideAreaRight = (props) => {
   const router = useRouter()
   const announcementVisible = notice && Object.keys(notice).length > 0
 
-  return (<aside id='right' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'mr-4' : 'ml-4') + ' space-y-4 hidden xl:block flex-col w-60 relative z-10'}>
+  return (<aside id='right' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'mr-4' : 'ml-4') + ' space-y-4 hidden xl:block flex-col w-60 relative z-10'}>
 
-        {CONFIG.RIGHT_AD && <Card className='mb-2'>
+        {siteConfig('NEXT_RIGHT_AD', null, CONFIG) && <Card className='mb-2'>
             {/* 展示广告  */}
             <ins
                 className='adsbygoogle'
@@ -49,11 +48,11 @@ const SideAreaRight = (props) => {
                 <Announcement post={notice} />
             </Card>}
 
-            {CONFIG.RIGHT_LATEST_POSTS && <Card><LatestPostsGroup latestPosts={latestPosts} /></Card>}
+            {siteConfig('NEXT_RIGHT_LATEST_POSTS', null, CONFIG) && <Card><LatestPostsGroup latestPosts={latestPosts} /></Card>}
             {slot}
 
             {/* 分类  */}
-            {CONFIG.RIGHT_CATEGORY_LIST && router.asPath !== '/category' && categoryOptions && (
+            {siteConfig('NEXT_RIGHT_CATEGORY_LIST', null, CONFIG) && router.asPath !== '/category' && categoryOptions && (
                 <Card>
                     <div className='text-sm px-2 flex flex-nowrap justify-between font-light'>
                         <div className='pb-2 text-gray-600 dark:text-gray-300'><i className='mr-2 fas fa-th-list' />{locale.COMMON.CATEGORY}</div>
@@ -70,7 +69,7 @@ const SideAreaRight = (props) => {
                 </Card>
             )}
 
-            {CONFIG.RIGHT_TAG_LIST && router.asPath !== '/tag' && tagOptions && (
+            {siteConfig('NEXT_RIGHT_TAG_LIST', null, CONFIG) && router.asPath !== '/tag' && tagOptions && (
                 <Card>
                     <div className="text-sm pb-1 px-2 flex flex-nowrap justify-between font-light dark:text-gray-200">
                         <div className="text-gray-600 dark:text-gray-200">
@@ -93,7 +92,7 @@ const SideAreaRight = (props) => {
                 </Card>
             )}
 
-            {BLOG.COMMENT_WALINE_SERVER_URL && BLOG.COMMENT_WALINE_RECENT && <Card>
+            {siteConfig('COMMENT_WALINE_SERVER_URL') && siteConfig('COMMENT_WALINE_RECENT') && <Card>
                 <div className="text-sm pb-1 px-2 flex flex-nowrap justify-between font-light dark:text-gray-200">
                     <div className="text-gray-600 dark:text-gray-200">
                         <i className="mr-2 fas fa-tag" />
diff --git a/themes/next/components/SideBar.js b/themes/next/components/SideBar.js
index 3af651c5..27fe65b0 100644
--- a/themes/next/components/SideBar.js
+++ b/themes/next/components/SideBar.js
@@ -3,7 +3,6 @@ import InfoCard from './InfoCard'
 import TagGroups from './TagGroups'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
-import React from 'react'
 
 /**
  * 侧边栏
diff --git a/themes/next/components/SideBarDrawer.js b/themes/next/components/SideBarDrawer.js
index 213269f4..999e6b80 100644
--- a/themes/next/components/SideBarDrawer.js
+++ b/themes/next/components/SideBarDrawer.js
@@ -1,6 +1,6 @@
 import SideBar from './SideBar'
 import { useRouter } from 'next/router'
-import React, { useEffect, useImperativeHandle } from 'react'
+import { useEffect, useImperativeHandle } from 'react'
 
 /**
  * 侧边栏抽屉面板，可以从侧面拉出
diff --git a/themes/next/components/SocialButton.js b/themes/next/components/SocialButton.js
index 7508b273..6da30787 100644
--- a/themes/next/components/SocialButton.js
+++ b/themes/next/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -9,34 +8,34 @@ import React from 'react'
 const SocialButton = () => {
   return <div className='w-52 justify-center flex-wrap flex'>
     <div className='space-x-3 text-xl text-gray-600 dark:text-gray-400 text-center'>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {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>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='fab fa-twitter transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='fab fa-telegram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkedIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkedIn'} >
         <i className='transform hover:scale-125 duration-150 fab fa-linkedin dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='fab fa-weibo transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='fab fa-instagram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='fas fa-envelope transform hover:scale-125 duration-150'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='fas fa-rss transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+      {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
         <i className='fab fa-bilibili transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+      {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
         <i className='fab fa-youtube transform hover:scale-125 duration-150'/>
       </a>}
     </div>
diff --git a/themes/next/components/StickyBar.js b/themes/next/components/StickyBar.js
index 13169f8e..e763b594 100644
--- a/themes/next/components/StickyBar.js
+++ b/themes/next/components/StickyBar.js
@@ -1,6 +1,7 @@
 import throttle from 'lodash.throttle'
 import { useCallback, useEffect } from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 let windowTop = 0
 
@@ -13,7 +14,7 @@ let windowTop = 0
 const StickyBar = ({ children }) => {
   // 滚动页面时导航条样式调整
   const scrollTrigger = useCallback(throttle(() => {
-    if (CONFIG.NAV_TYPE === 'normal') {
+    if (siteConfig('NEXT_NAV_TYPE', null, CONFIG) === 'normal') {
       return
     }
     const scrollS = window.scrollY
diff --git a/themes/next/components/TagItem.js b/themes/next/components/TagItem.js
index 85f6e0be..bb40a2f1 100644
--- a/themes/next/components/TagItem.js
+++ b/themes/next/components/TagItem.js
@@ -1,5 +1,4 @@
 import Link from 'next/link'
-import React from 'react'
 import { useGlobal } from '@/lib/global'
 
 const TagItem = ({ tag, selected }) => {
diff --git a/themes/next/components/TagList.js b/themes/next/components/TagList.js
index 973e7b68..08d25add 100644
--- a/themes/next/components/TagList.js
+++ b/themes/next/components/TagList.js
@@ -1,5 +1,5 @@
-import React from 'react'
 import TagItem from './TagItem'
+
 /**
  * 横向的标签列表
  * @param tags
diff --git a/themes/next/components/Toc.js b/themes/next/components/Toc.js
index f734990d..077c9863 100644
--- a/themes/next/components/Toc.js
+++ b/themes/next/components/Toc.js
@@ -1,8 +1,7 @@
-import React, { useRef } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import throttle from 'lodash.throttle'
 import { uuidToId } from 'notion-utils'
 import Progress from './Progress'
-// import { cs } from 'react-notion-x'
 
 /**
  * 目录导航组件
@@ -12,7 +11,7 @@ import Progress from './Progress'
  */
 const Toc = ({ toc }) => {
   // 监听滚动事件
-  React.useEffect(() => {
+  useEffect(() => {
     window.addEventListener('scroll', actionSectionScrollSpy)
     actionSectionScrollSpy()
     return () => {
@@ -25,9 +24,9 @@ const Toc = ({ toc }) => {
   const tocIds = []
 
   // 同步选中目录事件
-  const [activeSection, setActiveSection] = React.useState(null)
+  const [activeSection, setActiveSection] = useState(null)
   const throttleMs = 200
-  const actionSectionScrollSpy = React.useCallback(throttle(() => {
+  const actionSectionScrollSpy = useCallback(throttle(() => {
     const sections = document.getElementsByClassName('notion-h')
     let prevBBox = null
     let currentSectionId = activeSection
diff --git a/themes/next/components/TocDrawer.js b/themes/next/components/TocDrawer.js
index 83861934..33172166 100644
--- a/themes/next/components/TocDrawer.js
+++ b/themes/next/components/TocDrawer.js
@@ -1,5 +1,5 @@
 import Toc from './Toc'
-import React, { useImperativeHandle, useState } from 'react'
+import { useImperativeHandle, useState } from 'react'
 import { useGlobal } from '@/lib/global'
 
 /**
diff --git a/themes/next/components/TocDrawerButton.js b/themes/next/components/TocDrawerButton.js
index fc8548e4..6d51fdc2 100644
--- a/themes/next/components/TocDrawerButton.js
+++ b/themes/next/components/TocDrawerButton.js
@@ -1,6 +1,6 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 点击召唤目录抽屉
@@ -11,7 +11,7 @@ import CONFIG from '../config'
  */
 const TocDrawerButton = (props) => {
   const { locale } = useGlobal()
-  if (!CONFIG.WIDGET_TOC) {
+  if (!siteConfig('NEXT_WIDGET_TOC', null, CONFIG)) {
     return <></>
   }
   if (props?.post?.toc?.length > 1) {
diff --git a/themes/next/components/TopNav.js b/themes/next/components/TopNav.js
index bf561bfd..5f6eec1e 100644
--- a/themes/next/components/TopNav.js
+++ b/themes/next/components/TopNav.js
@@ -9,6 +9,7 @@ import { MenuList } from './MenuList'
 import SearchDrawer from './SearchDrawer'
 import TagGroups from './TagGroups'
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 let windowTop = 0
 
@@ -38,12 +39,12 @@ const TopNav = (props) => {
 
   // 监听滚动
   useEffect(() => {
-    if (CONFIG.NAV_TYPE === 'autoCollapse') {
+    if (siteConfig('NEXT_NAV_TYPE', null, CONFIG) === 'autoCollapse') {
       scrollTrigger()
       window.addEventListener('scroll', scrollTrigger)
     }
     return () => {
-      CONFIG.NAV_TYPE === 'autoCollapse' && window.removeEventListener('scroll', scrollTrigger)
+      siteConfig('NEXT_NAV_TYPE', null, CONFIG) === 'autoCollapse' && window.removeEventListener('scroll', scrollTrigger)
     }
   }, [])
 
@@ -96,7 +97,7 @@ const TopNav = (props) => {
             <SearchDrawer cRef={searchDrawer} slot={searchDrawerSlot} />
 
             {/* 导航栏 */}
-            <div id='sticky-nav' className={`${CONFIG.NAV_TYPE !== 'normal' ? 'fixed' : 'relative'} lg:relative w-full top-0 z-20 transform duration-500`}>
+            <div id='sticky-nav' className={`${siteConfig('NEXT_NAV_TYPE', null, CONFIG) !== 'normal' ? 'fixed' : 'relative'} lg:relative w-full top-0 z-20 transform duration-500`}>
                 <div className='w-full flex justify-between items-center p-4 bg-black dark:bg-gray-800 text-white'>
                     {/* 左侧LOGO 标题 */}
                     <div className='flex flex-none flex-grow-0'>
diff --git a/themes/next/config.js b/themes/next/config.js
index 16203f5c..7bd35ba3 100644
--- a/themes/next/config.js
+++ b/themes/next/config.js
@@ -1,38 +1,38 @@
 const CONFIG = {
 
-  HOME_BANNER: true, // 首页是否显示大图及标语 [true,false]
-  HOME_BANNER_Strings: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
+  NEXT_HOME_BANNER: true, // 首页是否显示大图及标语 [true,false]
+  NEXT_HOME_BANNER_STRINGS: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
 
-  NAV_TYPE: 'normal', // ['fixed','autoCollapse','normal'] 分别是固定屏幕顶部并始终显示、固定屏幕顶部且滚动时隐藏，不固定屏幕顶部
+  NEXT_NAV_TYPE: 'normal', // ['fixed','autoCollapse','normal'] 分别是固定屏幕顶部并始终显示、固定屏幕顶部且滚动时隐藏，不固定屏幕顶部
 
-  POST_LIST_COVER: false, // 文章列表显示封面图
-  POST_LIST_PREVIEW: true, // 显示文章预览
-  POST_LIST_SUMMARY: false, // 显示用户自定义摘要，有预览时优先只展示预览
+  NEXT_POST_LIST_COVER: false, // 文章列表显示封面图
+  NEXT_POST_LIST_PREVIEW: true, // 显示文章预览
+  NEXT_POST_LIST_SUMMARY: false, // 显示用户自定义摘要，有预览时优先只展示预览
 
-  POST_HEADER_IMAGE_VISIBLE: false, // 文章详情页是否显示封面图
+  NEXT_POST_HEADER_IMAGE_VISIBLE: false, // 文章详情页是否显示封面图
 
   // 右侧组件
-  RIGHT_BAR: true, // 是否显示右侧栏
-  RIGHT_LATEST_POSTS: true, // 右侧栏最新文章
-  RIGHT_CATEGORY_LIST: true, // 右侧边栏文章分类列表
-  RIGHT_TAG_LIST: true, // 右侧边栏标签分类列表
-  RIGHT_AD: false, // 右侧广告
+  NEXT_RIGHT_BAR: true, // 是否显示右侧栏
+  NEXT_RIGHT_LATEST_POSTS: true, // 右侧栏最新文章
+  NEXT_RIGHT_CATEGORY_LIST: true, // 右侧边栏文章分类列表
+  NEXT_RIGHT_TAG_LIST: true, // 右侧边栏标签分类列表
+  NEXT_RIGHT_AD: false, // 右侧广告
 
   // 菜单
-  MENU_HOME: true, // 显示首页
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
+  NEXT_MENU_HOME: true, // 显示首页
+  NEXT_MENU_CATEGORY: true, // 显示分类
+  NEXT_MENU_TAG: true, // 显示标签
+  NEXT_MENU_ARCHIVE: true, // 显示归档
+  NEXT_MENU_SEARCH: true, // 显示搜索
 
-  WIDGET_TO_TOP: true, // 是否显示回顶
-  WIDGET_TO_BOTTOM: false, // 显示回底
-  WIDGET_DARK_MODE: false, // 显示日间/夜间模式切换
-  WIDGET_TOC: true, // 移动端显示悬浮目录
+  NEXT_WIDGET_TO_TOP: true, // 是否显示回顶
+  NEXT_WIDGET_TO_BOTTOM: false, // 显示回底
+  NEXT_WIDGET_DARK_MODE: false, // 显示日间/夜间模式切换
+  NEXT_WIDGET_TOC: true, // 移动端显示悬浮目录
 
-  ARTICLE_RELATE_POSTS: true, // 相关文章推荐
-  ARTICLE_COPYRIGHT: true, // 文章版权声明
-  ARTICLE_INFO: true // 显示文章信息
+  NEXT_ARTICLE_RELATE_POSTS: true, // 相关文章推荐
+  NEXT_ARTICLE_COPYRIGHT: true, // 文章版权声明
+  NEXT_ARTICLE_INFO: true // 显示文章信息
 
 }
 
diff --git a/themes/next/index.js b/themes/next/index.js
index 93590525..cb702903 100644
--- a/themes/next/index.js
+++ b/themes/next/index.js
@@ -8,7 +8,6 @@ import SideAreaRight from './components/SideAreaRight'
 import TopNav from './components/TopNav'
 import { useGlobal } from '@/lib/global'
 import { useEffect, useRef, useState } from 'react'
-import BLOG from '@/blog.config'
 import BlogPostListScroll from './components/BlogPostListScroll'
 import BlogPostListPage from './components/BlogPostListPage'
 import StickyBar from './components/StickyBar'
@@ -26,6 +25,7 @@ import { Transition } from '@headlessui/react'
 import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
 import CommonHead from '@/components/CommonHead'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 基础布局 采用左中右三栏布局，移动端使用顶部导航栏
@@ -33,7 +33,7 @@ import CommonHead from '@/components/CommonHead'
  * @constructor
  */
 const LayoutBase = (props) => {
-  const { children, headerSlot, floatSlot, rightAreaSlot, siteInfo, meta } = props
+  const { children, headerSlot, floatSlot, rightAreaSlot, meta } = props
   const { onLoading } = useGlobal()
   const targetRef = useRef(null)
   const floatButtonGroup = useRef(null)
@@ -83,12 +83,12 @@ const LayoutBase = (props) => {
             <div className='h-0.5 w-full bg-gray-700 dark:bg-gray-600 hidden lg:block' />
 
             {/* 主区 */}
-            <main id='wrapper' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + ' next relative flex justify-center flex-1 pb-12'}>
+            <main id='wrapper' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + ' next relative flex justify-center flex-1 pb-12'}>
                 {/* 左侧栏样式 */}
                 <SideAreaLeft targetRef={targetRef} {...props} />
 
                 {/* 中央内容 */}
-                <section id='container-inner' className={`${CONFIG.NAV_TYPE !== 'normal' ? 'mt-24' : ''} lg:max-w-3xl xl:max-w-4xl flex-grow md:mt-0 min-h-screen w-full relative z-10`} ref={targetRef}>
+                <section id='container-inner' className={`${siteConfig('NEXT_NAV_TYPE', null, CONFIG) !== 'normal' ? 'mt-24' : ''} lg:max-w-3xl xl:max-w-4xl flex-grow md:mt-0 min-h-screen w-full relative z-10`} ref={targetRef}>
                     <Transition
                         show={!onLoading}
                         appear={true}
@@ -105,7 +105,7 @@ const LayoutBase = (props) => {
                 </section>
 
                 {/* 右侧栏样式 */}
-                {CONFIG.RIGHT_BAR && <SideAreaRight targetRef={targetRef} slot={rightAreaSlot} {...props} />}
+                {siteConfig('NEXT_RIGHT_BAR', null, CONFIG) && <SideAreaRight targetRef={targetRef} slot={rightAreaSlot} {...props} />}
             </main>
 
             {/* 右下角悬浮 */}
@@ -119,7 +119,7 @@ const LayoutBase = (props) => {
             </div>
 
             {/* 页脚 */}
-            <Footer title={siteInfo?.title} />
+            <Footer title={siteConfig('TITLE')} />
         </div>
   )
 }
@@ -144,7 +144,7 @@ const LayoutPostList = (props) => {
 
         <BlogListBar {...props} />
 
-        {BLOG.POST_LIST_STYLE !== 'page'
+        {siteConfig('POST_LIST_STYLE') !== 'page'
           ? <BlogPostListScroll {...props} showSummary={true} />
           : <BlogPostListPage {...props} />
         }
@@ -182,7 +182,7 @@ const LayoutSearch = (props) => {
                 </div>
             </StickyBar>
             <div className="md:mt-5">
-                {BLOG.POST_LIST_STYLE !== 'page'
+                {siteConfig('POST_LIST_STYLE') !== 'page'
                   ? <BlogPostListScroll {...props} showSummary={true} />
                   : <BlogPostListPage {...props} />
                 }
@@ -291,7 +291,7 @@ const LayoutCategoryIndex = (props) => {
                     <i className='mr-4 fas faTh' />{locale.COMMON.CATEGORY}:
                 </div>
                 <div id='category-list' className='duration-200 flex flex-wrap'>
-                    {categoryOptions.map(category => {
+                    {categoryOptions?.map(category => {
                       return (
                             <Link
                                 key={category.name}
diff --git a/themes/nobelium/components/ArticleFooter.js b/themes/nobelium/components/ArticleFooter.js
index 87cf7baf..628dd05d 100644
--- a/themes/nobelium/components/ArticleFooter.js
+++ b/themes/nobelium/components/ArticleFooter.js
@@ -1,4 +1,3 @@
-import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { useGlobal } from '@/lib/global'
 
@@ -16,7 +15,7 @@ export const ArticleFooter = props => {
   return <div className="flex justify-between font-medium text-gray-500 dark:text-gray-400">
   <a>
     <button
-      onClick={() => router.push(BLOG.path || '/')}
+      onClick={() => router.push('/')}
       className="mt-2 cursor-pointer hover:text-black dark:hover:text-gray-100"
     >
       ← {locale.POST.BACK}
diff --git a/themes/nobelium/components/ArticleInfo.js b/themes/nobelium/components/ArticleInfo.js
index 0ecb4895..3e6a6220 100644
--- a/themes/nobelium/components/ArticleInfo.js
+++ b/themes/nobelium/components/ArticleInfo.js
@@ -1,52 +1,52 @@
 
 import Image from 'next/image'
-import BLOG from '@/blog.config'
 import TagItem from './TagItem'
 import md5 from 'js-md5'
+import { siteConfig } from '@/lib/config'
 
 export const ArticleInfo = (props) => {
   const { post } = props
 
-  const emailHash = md5(BLOG.CONTACT_EMAIL)
+  const emailHash = md5(siteConfig('CONTACT_EMAIL', '#'))
 
   return <section className="flex-wrap flex mt-2 text-gray--600 dark:text-gray-400 font-light leading-8">
         <div>
 
             <div className="font-bold text-3xl text-black dark:text-white">
-            {post?.title}
+                {post?.title}
             </div>
 
             {post?.type !== 'Page' && <>
-            <nav className="flex mt-7 items-start text-gray-500 dark:text-gray-400">
-            <div className="flex mb-4">
-              <a href={BLOG.CONTACT_GITHUB || '#'} className="flex">
-                <Image
-                  alt={BLOG.author}
-                  width={24}
-                  height={24}
-                  src={`https://gravatar.com/avatar/${emailHash}`}
-                  className="rounded-full"
-                />
-                <p className="ml-2 md:block">{BLOG.author}</p>
-              </a>
-              <span className="block">&nbsp;/&nbsp;</span>
-            </div>
-            <div className="mr-2 mb-4 md:ml-0">
-              {post?.publishDay}
-            </div>
-            {post?.tags && (
-              <div className="flex flex-nowrap max-w-full overflow-x-auto article-tags">
-                {post?.tags.map(tag => (
-                  <TagItem key={tag} tag={tag} />
-                ))}
-              </div>
-            )}
-            <span className="hidden busuanzi_container_page_pv mr-2">
-                    <i className='mr-1 fas fa-eye' />
-                    &nbsp;
-                    <span className="mr-2 busuanzi_value_page_pv" />
-                </span>
-             </nav>
+                <nav className="flex mt-7 items-start text-gray-500 dark:text-gray-400">
+                    <div className="flex mb-4">
+                        <a href={siteConfig('CONTACT_GITHUB', '#')} className="flex">
+                            <Image
+                                alt={siteConfig('AUTHOR')}
+                                width={24}
+                                height={24}
+                                src={`https://gravatar.com/avatar/${emailHash}`}
+                                className="rounded-full"
+                            />
+                            <p className="ml-2 md:block">{siteConfig('AUTHOR')}</p>
+                        </a>
+                        <span className="block">&nbsp;/&nbsp;</span>
+                    </div>
+                    <div className="mr-2 mb-4 md:ml-0">
+                        {post?.publishDay}
+                    </div>
+                    {post?.tags && (
+                        <div className="flex flex-nowrap max-w-full overflow-x-auto article-tags">
+                            {post?.tags.map(tag => (
+                                <TagItem key={tag} tag={tag} />
+                            ))}
+                        </div>
+                    )}
+                    <span className="hidden busuanzi_container_page_pv mr-2">
+                        <i className='mr-1 fas fa-eye' />
+                        &nbsp;
+                        <span className="mr-2 busuanzi_value_page_pv" />
+                    </span>
+                </nav>
             </>}
 
         </div>
diff --git a/themes/nobelium/components/BlogArchiveItem.js b/themes/nobelium/components/BlogArchiveItem.js
index b8184f45..809ac6d8 100644
--- a/themes/nobelium/components/BlogArchiveItem.js
+++ b/themes/nobelium/components/BlogArchiveItem.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 
 /**
@@ -25,7 +25,7 @@ export default function BlogArchiveItem({ archiveTitle, archivePosts }) {
                             </span>{' '}
                             &nbsp;
                             <Link
-                                href={`${BLOG.SUB_PATH}/${post.slug}`}
+                                href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                 passHref
                                 className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
 
diff --git a/themes/nobelium/components/BlogListPage.js b/themes/nobelium/components/BlogListPage.js
index fc6b72ad..46db49fa 100644
--- a/themes/nobelium/components/BlogListPage.js
+++ b/themes/nobelium/components/BlogListPage.js
@@ -1,5 +1,5 @@
 
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import Link from 'next/link'
@@ -9,7 +9,7 @@ export const BlogListPage = props => {
   const { page = 1, posts, postCount } = props
   const { locale } = useGlobal()
   const router = useRouter()
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
   const currentPage = +page
 
   const showPrev = currentPage > 1
diff --git a/themes/nobelium/components/BlogListScroll.js b/themes/nobelium/components/BlogListScroll.js
index d3d91abb..42a1f440 100644
--- a/themes/nobelium/components/BlogListScroll.js
+++ b/themes/nobelium/components/BlogListScroll.js
@@ -1,34 +1,34 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
-import React from 'react'
 import throttle from 'lodash.throttle'
 import { deepClone } from '@/lib/utils'
+import { siteConfig } from '@/lib/config'
+import { useCallback, useEffect, useRef, useState } from 'react'
 
 export const BlogListScroll = props => {
   const { posts } = props
   const { locale } = useGlobal()
 
-  const [page, updatePage] = React.useState(1)
+  const [page, updatePage] = useState(1)
 
   let hasMore = false
   const postsToShow = posts && Array.isArray(posts)
-    ? deepClone(posts).slice(0, BLOG.POSTS_PER_PAGE * page)
+    ? deepClone(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
     : []
 
   if (posts) {
     const totalCount = posts.length
-    hasMore = page * BLOG.POSTS_PER_PAGE < totalCount
+    hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
   }
   const handleGetMore = () => {
     if (!hasMore) return
     updatePage(page + 1)
   }
 
-  const targetRef = React.useRef(null)
+  const targetRef = useRef(null)
 
   // 监听滚动自动分页加载
-  const scrollTrigger = React.useCallback(throttle(() => {
+  const scrollTrigger = useCallback(throttle(() => {
     const scrollS = window.scrollY + window.outerHeight
     const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
     if (scrollS > clientHeight + 100) {
@@ -36,7 +36,7 @@ export const BlogListScroll = props => {
     }
   }, 500))
 
-  React.useEffect(() => {
+  useEffect(() => {
     window.addEventListener('scroll', scrollTrigger)
 
     return () => {
@@ -57,7 +57,7 @@ export const BlogListScroll = props => {
                       </h2>
 
                       <div className="mb-4 text-sm text-gray-700">
-                          by <a href="#" className="text-gray-700">{BLOG.AUTHOR}</a> on {p.date?.start_date || p.createdTime}
+                          by <a href="#" className="text-gray-700">{siteConfig('AUTHOR')}</a> on {p.date?.start_date || p.createdTime}
                           <span className="font-bold mx-1"> | </span>
                           <a href="#" className="text-gray-700">{p.category}</a>
                           <span className="font-bold mx-1"> | </span>
diff --git a/themes/nobelium/components/BlogPost.js b/themes/nobelium/components/BlogPost.js
index 28bc1710..1d641975 100644
--- a/themes/nobelium/components/BlogPost.js
+++ b/themes/nobelium/components/BlogPost.js
@@ -1,9 +1,9 @@
 import Link from 'next/link'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 const BlogPost = ({ post }) => {
   return (
-    (<Link href={`${BLOG.SUB_PATH}/${post.slug}`}>
+    (<Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}>
 
       <article key={post.id} className="mb-6 md:mb-8">
         <header className="flex flex-col justify-between md:flex-row md:items-baseline">
diff --git a/themes/nobelium/components/ExampleRecentComments.js b/themes/nobelium/components/ExampleRecentComments.js
index b1555c1d..e5097740 100644
--- a/themes/nobelium/components/ExampleRecentComments.js
+++ b/themes/nobelium/components/ExampleRecentComments.js
@@ -1,5 +1,5 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { useEffect, useState } from 'react'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import { RecentComments } from '@waline/client'
 
@@ -9,11 +9,11 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const ExampleRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [comments, updateComments] = useState([])
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/nobelium/components/Footer.js b/themes/nobelium/components/Footer.js
index 6b4b7857..a5d44e27 100644
--- a/themes/nobelium/components/Footer.js
+++ b/themes/nobelium/components/Footer.js
@@ -1,19 +1,14 @@
-import BLOG from '@/blog.config'
 import DarkModeButton from '@/components/DarkModeButton'
 import Vercel from '@/components/Vercel'
+import { siteConfig } from '@/lib/config'
 
 export const Footer = (props) => {
   const d = new Date()
   const currentYear = d.getFullYear()
   const { post } = props
   const fullWidth = post?.fullWidth ?? false
-
-  const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return <footer
      className={`z-10 relative mt-6 flex-shrink-0 m-auto w-full text-gray-500 dark:text-gray-400 transition-all ${
@@ -25,7 +20,7 @@ export const Footer = (props) => {
      <div className="my-4 text-sm leading-6">
        <div className="flex align-baseline justify-between flex-wrap">
          <p>
-           © {BLOG.AUTHOR} {copyrightDate}
+           © {siteConfig('AUTHOR')} {copyrightDate}
          </p>
          <Vercel />
        </div>
diff --git a/themes/nobelium/components/JumpToTopButton.js b/themes/nobelium/components/JumpToTopButton.js
index 30e684a8..f5e22b61 100644
--- a/themes/nobelium/components/JumpToTopButton.js
+++ b/themes/nobelium/components/JumpToTopButton.js
@@ -1,5 +1,4 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 
 /**
  * 跳转到网页顶部
diff --git a/themes/nobelium/components/MenuItemCollapse.js b/themes/nobelium/components/MenuItemCollapse.js
index d2fd9d87..8f53f622 100644
--- a/themes/nobelium/components/MenuItemCollapse.js
+++ b/themes/nobelium/components/MenuItemCollapse.js
@@ -43,8 +43,8 @@ export const MenuItemCollapse = (props) => {
 
         {/* 折叠子菜单 */}
         {hasSubMenu && <Collapse isOpen={isOpen} onHeightChange={props.onHeightChange}>
-            {link.subMenus.map(sLink => {
-              return <div key={sLink.id} className='font-extralight dark:bg-black text-left px-10 justify-start  bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
+            {link.subMenus.map((sLink, index) => {
+              return <div key={index} className='font-extralight dark:bg-black text-left px-10 justify-start  bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
                         <span className='text-xs'>{sLink.title}</span>
                     </Link>
diff --git a/themes/nobelium/components/MenuItemDrop.js b/themes/nobelium/components/MenuItemDrop.js
index 9ea57461..0386910c 100644
--- a/themes/nobelium/components/MenuItemDrop.js
+++ b/themes/nobelium/components/MenuItemDrop.js
@@ -30,12 +30,12 @@ export const MenuItemDrop = ({ link }) => {
 
             {/* 子菜单 */}
             {hasSubMenu && <ul className={`${show ? 'visible opacity-100 top-12 ' : 'invisible opacity-0 top-10 '} border-gray-100  bg-white  dark:bg-black dark:border-gray-800 transition-all duration-300 z-20 absolute block drop-shadow-lg `}>
-                {link.subMenus.map(sLink => {
-                  return <li key={sLink.id} className='not:last-child:border-b-0 border-b text-gray-700 dark:text-gray-200  hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  dark:border-gray-800 py-3 pr-6 pl-3'>
+                {link.subMenus.map((sLink, index) => {
+                  return <div key={index} className='not:last-child:border-b-0 border-b text-gray-700 dark:text-gray-200  hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  dark:border-gray-800 py-3 pr-6 pl-3'>
                         <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'} >
                             <span className='text-sm text-nowrap font-extralight'>{link?.icon && <i className={sLink?.icon} > &nbsp; </i>}{sLink.title}</span>
                         </Link>
-                    </li>
+                    </div>
                 })}
             </ul>}
 
diff --git a/themes/nobelium/components/Nav.js b/themes/nobelium/components/Nav.js
index 7e6c12ac..dfa4046b 100644
--- a/themes/nobelium/components/Nav.js
+++ b/themes/nobelium/components/Nav.js
@@ -1,6 +1,5 @@
 import { useEffect, useRef, useState } from 'react'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
 import { SvgIcon } from './SvgIcon'
@@ -10,10 +9,11 @@ import { MenuItemCollapse } from './MenuItemCollapse'
 import LazyImage from '@/components/LazyImage'
 import RandomPostButton from './RandomPostButton'
 import SearchButton from './SearchButton'
+import { siteConfig } from '@/lib/config'
 
 const Nav = props => {
   const { navBarTitle, fullWidth, siteInfo } = props
-  const useSticky = !BLOG.autoCollapsedNavBar
+  const useSticky = !JSON.parse(siteConfig('NOBELIUM_AUTO_COLLAPSE_NAV_BAR', true))
   const navRef = useRef(null)
   const sentinalRef = useRef([])
   const handler = ([entry]) => {
@@ -43,12 +43,12 @@ const Nav = props => {
             ref={navRef}
         >
             <div className="flex items-center">
-                <Link href="/" aria-label={BLOG.title}>
+                <Link href="/" aria-label={siteConfig('TITLE')}>
 
                     <div className="h-6 w-6">
                         {/* <SvgIcon/> */}
-                        {CONFIG.NAV_NOTION_ICON
-                          ? <LazyImage src={siteInfo?.icon} width={24} height={24} alt={BLOG.AUTHOR} />
+                        {siteConfig('NOBELIUM_NAV_NOTION_ICON', null, CONFIG)
+                          ? <LazyImage src={siteInfo?.icon} width={24} height={24} alt={siteConfig('AUTHOR')} />
                           : <SvgIcon />}
 
                     </div>
@@ -61,9 +61,9 @@ const Nav = props => {
                         </p>
                     )
                   : (
-                        <p className="ml-2 font-medium text-gray-800 dark:text-gray-300 header-name">
-                            {siteInfo?.title}
-                            {/* ,{' '}<span className="font-normal">{siteInfo?.description}</span> */}
+                        <p className="ml-2 font-medium text-gray-800 dark:text-gray-300 header-name whitespace-nowrap">
+                            {siteConfig('TITLE')}
+                            {/* ,{' '}<span className="font-normal">{siteConfig('DESCRIPTION')}</span> */}
                         </p>
                     )}
             </div>
@@ -82,18 +82,18 @@ const NavBar = props => {
 
   const { locale } = useGlobal()
   let links = [
-    { id: 2, name: locale.NAV.RSS, to: '/feed', show: BLOG.ENABLE_RSS && CONFIG.MENU_RSS, target: '_blank' },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { id: 2, name: locale.NAV.RSS, to: '/feed', show: siteConfig('ENABLE_RSS') && siteConfig('NOBELIUM_MENU_RSS', null, CONFIG), target: '_blank' },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('NOBELIUM_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('NOBELIUM_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('NOBELIUM_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('NOBELIUM_MENU_TAG', null, CONFIG) }
   ]
   if (customNav) {
     links = links.concat(customNav)
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
@@ -114,18 +114,11 @@ const NavBar = props => {
                 </Collapse>
             </div>
 
-            {JSON.parse(CONFIG.MENU_RANDOM_POST) && <RandomPostButton {...props} />}
-            {JSON.parse(CONFIG.MENU_SEARCH_BUTTON) && <SearchButton {...props}/>}
+            {JSON.parse(siteConfig('NOBELIUM_MENU_RANDOM_POST', null, CONFIG)) && <RandomPostButton {...props} />}
+            {JSON.parse(siteConfig('NOBELIUM_MENU_SEARCH_BUTTON', null, CONFIG)) && <SearchButton {...props}/>}
             <i onClick={toggleOpen} className='fas fa-bars cursor-pointer px-5 flex justify-center items-center md:hidden'></i>
         </div>
   )
 }
 
 export default Nav
-
-/**
- *
-                    {!JSON.parse(BLOG.THEME_SWITCH) && <div className='hidden md:block'><DarkModeButton {...props} /></div>}
-                    <ReadingProgress />
-
- */
diff --git a/themes/nobelium/components/RandomPostButton.js b/themes/nobelium/components/RandomPostButton.js
index a8a0597f..a791f0f8 100644
--- a/themes/nobelium/components/RandomPostButton.js
+++ b/themes/nobelium/components/RandomPostButton.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 
@@ -15,7 +15,7 @@ export default function RandomPostButton(props) {
   function handleClick() {
     const randomIndex = Math.floor(Math.random() * latestPosts.length)
     const randomPost = latestPosts[randomIndex]
-    router.push(`${BLOG.SUB_PATH}/${randomPost?.slug}`)
+    router.push(`${siteConfig('SUB_PATH', '')}/${randomPost?.slug}`)
   }
 
   return (
diff --git a/themes/nobelium/components/SearchButton.js b/themes/nobelium/components/SearchButton.js
index 91e805c3..23b3c065 100644
--- a/themes/nobelium/components/SearchButton.js
+++ b/themes/nobelium/components/SearchButton.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import { useNobeliumGlobal } from '..'
@@ -13,7 +13,7 @@ export default function SearchButton(props) {
   const router = useRouter()
 
   function handleSearch() {
-    if (BLOG.ALGOLIA_APP_ID) {
+    if (siteConfig('ALGOLIA_APP_ID')) {
       searchModal.current.openSearch()
     } else {
       router.push('/search')
diff --git a/themes/nobelium/components/SideBar.js b/themes/nobelium/components/SideBar.js
index 986063b0..a4d1e060 100644
--- a/themes/nobelium/components/SideBar.js
+++ b/themes/nobelium/components/SideBar.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Live2D from '@/components/Live2D'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
@@ -48,7 +48,7 @@ export const SideBar = (props) => {
                 </div>
             </aside>
 
-            {BLOG.COMMENT_WALINE_SERVER_URL && BLOG.COMMENT_WALINE_RECENT && <aside className="rounded shadow overflow-hidden mb-6">
+            {siteConfig('COMMENT_WALINE_SERVER_URL') && JSON.parse(siteConfig('COMMENT_WALINE_RECENT')) && <aside className="rounded shadow overflow-hidden mb-6">
                 <h3 className="text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b">{locale.COMMON.RECENT_COMMENTS}</h3>
 
                 <div className="p-4">
diff --git a/themes/nobelium/components/TagItem.js b/themes/nobelium/components/TagItem.js
index 6c385b9b..0364e3fc 100644
--- a/themes/nobelium/components/TagItem.js
+++ b/themes/nobelium/components/TagItem.js
@@ -2,11 +2,9 @@ import Link from 'next/link'
 
 const TagItem = ({ tag }) => (
   (<Link href={`/tag/${encodeURIComponent(tag)}`}>
-
     <p className="mr-1 rounded-full px-2 py-1 border leading-none text-sm dark:border-gray-600">
       {tag}
     </p>
-
   </Link>)
 )
 
diff --git a/themes/nobelium/components/Title.js b/themes/nobelium/components/Title.js
index e57e2347..151d736e 100644
--- a/themes/nobelium/components/Title.js
+++ b/themes/nobelium/components/Title.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 标题栏
@@ -6,9 +6,9 @@ import BLOG from '@/blog.config'
  * @returns
  */
 export const Title = (props) => {
-  const { siteInfo, post } = props
-  const title = post?.title || siteInfo?.description
-  const description = post?.description || BLOG.AUTHOR
+  const { post } = props
+  const title = post?.title || siteConfig('DESCRIPTION')
+  const description = post?.description || siteConfig('AUTHOR')
 
   return <div className="text-center px-6 py-12 mb-6 bg-gray-100 dark:bg-hexo-black-gray dark:border-hexo-black-gray border-b">
         <h1 className=" text-xl md:text-4xl pb-4">{title}</h1>
diff --git a/themes/nobelium/config.js b/themes/nobelium/config.js
index 18dd8488..0c4a9c1e 100644
--- a/themes/nobelium/config.js
+++ b/themes/nobelium/config.js
@@ -1,17 +1,17 @@
 const CONFIG = {
 
-  NAV_NOTION_ICON: true, // 是否读取Notion图标作为站点头像 ; 否则默认显示黑色SVG方块
+  NOBELIUM_NAV_NOTION_ICON: true, // 是否读取Notion图标作为站点头像 ; 否则默认显示黑色SVG方块
 
   // 特殊菜单
-  MENU_RANDOM_POST: true, // 是否显示随机跳转文章按钮
-  MENU_SEARCH_BUTTON: true, // 是否显示搜索按钮，该按钮支持Algolia搜索
+  NOBELIUM_MENU_RANDOM_POST: true, // 是否显示随机跳转文章按钮
+  NOBELIUM_MENU_SEARCH_BUTTON: true, // 是否显示搜索按钮，该按钮支持Algolia搜索
 
   // 默认菜单配置 （开启自定义菜单后，以下配置则失效，请在Notion中自行配置菜单）
-  MENU_CATEGORY: false, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: false, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
-  MENU_RSS: false // 显示订阅
+  NOBELIUM_MENU_CATEGORY: false, // 显示分类
+  NOBELIUM_MENU_TAG: true, // 显示标签
+  NOBELIUM_MENU_ARCHIVE: false, // 显示归档
+  NOBELIUM_MENU_SEARCH: true, // 显示搜索
+  NOBELIUM_MENU_RSS: false // 显示订阅
 
 }
 export default CONFIG
diff --git a/themes/nobelium/index.js b/themes/nobelium/index.js
index 319cd37f..c45bd08d 100644
--- a/themes/nobelium/index.js
+++ b/themes/nobelium/index.js
@@ -1,6 +1,5 @@
-import BLOG from '@/blog.config'
 import CONFIG from './config'
-import React, { createContext, useEffect, useState, useContext, useRef } from 'react'
+import { createContext, useEffect, useState, useContext, useRef } from 'react'
 import Nav from './components/Nav'
 import { Footer } from './components/Footer'
 import JumpToTopButton from './components/JumpToTopButton'
@@ -25,6 +24,7 @@ import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
 import CommonHead from '@/components/CommonHead'
 import AlgoliaSearchModal from '@/components/AlgoliaSearchModal'
+import { siteConfig } from '@/lib/config'
 
 // 主题全局状态
 const ThemeGlobalNobelium = createContext()
@@ -132,7 +132,7 @@ const LayoutPostList = props => {
   return (
         <LayoutBase {...props} topSlot={<BlogListBar {...props} setFilterKey={setFilterKey} />}>
             {topSlot}
-            {BLOG.POST_LIST_STYLE === 'page' ? <BlogListPage {...props} posts={filteredBlogPosts} /> : <BlogListScroll {...props} posts={filteredBlogPosts} />}
+            {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogListPage {...props} posts={filteredBlogPosts} /> : <BlogListScroll {...props} posts={filteredBlogPosts} />}
         </LayoutBase>
   )
 }
@@ -170,11 +170,10 @@ const LayoutSearch = props => {
   } else {
     filteredBlogPosts = deepClone(posts)
   }
-  console.log('posts', props, posts, filteredBlogPosts)
 
   return <LayoutBase {...props} topSlot={<BlogListBar {...props} setFilterKey={setFilterKey} />}>
     <SearchNavBar {...props} />
-    {BLOG.POST_LIST_STYLE === 'page' ? <BlogListPage {...props} posts={filteredBlogPosts} /> : <BlogListScroll {...props} posts={filteredBlogPosts} />}
+    {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogListPage {...props} posts={filteredBlogPosts} /> : <BlogListScroll {...props} posts={filteredBlogPosts} />}
   </LayoutBase>
 }
 
diff --git a/themes/plog/components/ArticleFooter.js b/themes/plog/components/ArticleFooter.js
index 87cf7baf..ec65adba 100644
--- a/themes/plog/components/ArticleFooter.js
+++ b/themes/plog/components/ArticleFooter.js
@@ -1,6 +1,6 @@
-import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import { useGlobal } from '@/lib/global'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 加密文章校验组件
@@ -16,7 +16,7 @@ export const ArticleFooter = props => {
   return <div className="flex justify-between font-medium text-gray-500 dark:text-gray-400">
   <a>
     <button
-      onClick={() => router.push(BLOG.path || '/')}
+      onClick={() => router.push(siteConfig('path') || '/')}
       className="mt-2 cursor-pointer hover:text-black dark:hover:text-gray-100"
     >
       ← {locale.POST.BACK}
diff --git a/themes/plog/components/ArticleInfo.js b/themes/plog/components/ArticleInfo.js
index 0ecb4895..784faa48 100644
--- a/themes/plog/components/ArticleInfo.js
+++ b/themes/plog/components/ArticleInfo.js
@@ -1,13 +1,13 @@
 
 import Image from 'next/image'
-import BLOG from '@/blog.config'
 import TagItem from './TagItem'
 import md5 from 'js-md5'
+import { siteConfig } from '@/lib/config'
 
 export const ArticleInfo = (props) => {
   const { post } = props
 
-  const emailHash = md5(BLOG.CONTACT_EMAIL)
+  const emailHash = md5(siteConfig('CONTACT_EMAIL', '#'))
 
   return <section className="flex-wrap flex mt-2 text-gray--600 dark:text-gray-400 font-light leading-8">
         <div>
@@ -19,15 +19,15 @@ export const ArticleInfo = (props) => {
             {post?.type !== 'Page' && <>
             <nav className="flex mt-7 items-start text-gray-500 dark:text-gray-400">
             <div className="flex mb-4">
-              <a href={BLOG.CONTACT_GITHUB || '#'} className="flex">
+              <a href={siteConfig('CONTACT_GITHUB') || '#'} className="flex">
                 <Image
-                  alt={BLOG.author}
+                  alt={siteConfig('AUTHOR')}
                   width={24}
                   height={24}
                   src={`https://gravatar.com/avatar/${emailHash}`}
                   className="rounded-full"
                 />
-                <p className="ml-2 md:block">{BLOG.author}</p>
+                <p className="ml-2 md:block">{siteConfig('AUTHOR')}</p>
               </a>
               <span className="block">&nbsp;/&nbsp;</span>
             </div>
diff --git a/themes/plog/components/BlogArchiveItem.js b/themes/plog/components/BlogArchiveItem.js
index b8184f45..4d3f3d02 100644
--- a/themes/plog/components/BlogArchiveItem.js
+++ b/themes/plog/components/BlogArchiveItem.js
@@ -1,5 +1,5 @@
-import BLOG from '@/blog.config'
 import Link from 'next/link'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 归档分组文章
@@ -25,7 +25,7 @@ export default function BlogArchiveItem({ archiveTitle, archivePosts }) {
                             </span>{' '}
                             &nbsp;
                             <Link
-                                href={`${BLOG.SUB_PATH}/${post.slug}`}
+                                href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                 passHref
                                 className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
 
diff --git a/themes/plog/components/BlogListPage.js b/themes/plog/components/BlogListPage.js
index 1ac57222..488fd188 100644
--- a/themes/plog/components/BlogListPage.js
+++ b/themes/plog/components/BlogListPage.js
@@ -1,16 +1,16 @@
 
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import Link from 'next/link'
 import BlogPost from './BlogPost'
 import { useEffect, useRef } from 'react'
+import { siteConfig } from '@/lib/config'
 
 export const BlogListPage = props => {
   const { page = 1, posts, postCount } = props
   const { locale } = useGlobal()
   const router = useRouter()
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
   const currentPage = +page
 
   const showPrev = currentPage > 1
diff --git a/themes/plog/components/BlogListScroll.js b/themes/plog/components/BlogListScroll.js
index 157e80e4..8e71d14a 100644
--- a/themes/plog/components/BlogListScroll.js
+++ b/themes/plog/components/BlogListScroll.js
@@ -1,33 +1,33 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
-import React from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import throttle from 'lodash.throttle'
+import { siteConfig } from '@/lib/config'
 
 export const BlogListScroll = props => {
   const { posts } = props
   const { locale } = useGlobal()
 
-  const [page, updatePage] = React.useState(1)
+  const [page, updatePage] = useState(1)
 
   let hasMore = false
   const postsToShow = posts
-    ? Object.assign(posts).slice(0, BLOG.POSTS_PER_PAGE * page)
+    ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
     : []
 
   if (posts) {
     const totalCount = posts.length
-    hasMore = page * BLOG.POSTS_PER_PAGE < totalCount
+    hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
   }
   const handleGetMore = () => {
     if (!hasMore) return
     updatePage(page + 1)
   }
 
-  const targetRef = React.useRef(null)
+  const targetRef = useRef(null)
 
   // 监听滚动自动分页加载
-  const scrollTrigger = React.useCallback(throttle(() => {
+  const scrollTrigger = useCallback(throttle(() => {
     const scrollS = window.scrollY + window.outerHeight
     const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
     if (scrollS > clientHeight + 100) {
@@ -35,7 +35,7 @@ export const BlogListScroll = props => {
     }
   }, 500))
 
-  React.useEffect(() => {
+  useEffect(() => {
     window.addEventListener('scroll', scrollTrigger)
 
     return () => {
@@ -56,7 +56,7 @@ export const BlogListScroll = props => {
                       </h2>
 
                       <div className="mb-4 text-sm text-gray-700">
-                          by <a href="#" className="text-gray-700">{BLOG.AUTHOR}</a> on {p.date?.start_date || p.createdTime}
+                          by <a href="#" className="text-gray-700">{siteConfig('AUTHOR')}</a> on {p.date?.start_date || p.createdTime}
                           <span className="font-bold mx-1"> | </span>
                           <a href="#" className="text-gray-700">{p.category}</a>
                           <span className="font-bold mx-1"> | </span>
diff --git a/themes/plog/components/BottomNav.js b/themes/plog/components/BottomNav.js
index 7af88fba..d9bd58a7 100644
--- a/themes/plog/components/BottomNav.js
+++ b/themes/plog/components/BottomNav.js
@@ -1,10 +1,10 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
 import { MenuItemDrop } from './MenuItemDrop'
 import FullScreenButton from '@/components/FullScreenButton'
 import InformationButton from './InformationButton'
 import LogoBar from './LogoBar'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 桌面端底部导航
@@ -32,18 +32,18 @@ const MenuList = props => {
 
   const { locale } = useGlobal()
   let links = [
-    { id: 2, name: locale.NAV.RSS, to: '/feed', show: BLOG.ENABLE_RSS && CONFIG.MENU_RSS, target: '_blank' },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { id: 2, name: locale.NAV.RSS, to: '/feed', show: siteConfig('ENABLE_RSS') && siteConfig('NOBELIUM_MENU_RSS', null, CONFIG), target: '_blank' },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('NOBELIUM_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('NOBELIUM_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('NOBELIUM_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('NOBELIUM_MENU_TAG', null, CONFIG) }
   ]
   if (customNav) {
     links = links.concat(customNav)
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/plog/components/ExampleRecentComments.js b/themes/plog/components/ExampleRecentComments.js
index b1555c1d..24135110 100644
--- a/themes/plog/components/ExampleRecentComments.js
+++ b/themes/plog/components/ExampleRecentComments.js
@@ -1,7 +1,7 @@
-import React from 'react'
-import BLOG from '@/blog.config'
+import { useEffect, useState } from 'react'
 import Link from 'next/link'
 import { RecentComments } from '@waline/client'
+import { siteConfig } from '@/lib/config'
 
 /**
  * @see https://waline.js.org/guide/get-started.html
@@ -9,11 +9,11 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const ExampleRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [comments, updateComments] = useState([])
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/plog/components/Footer.js b/themes/plog/components/Footer.js
index 2a6bdcb9..1eabd26a 100644
--- a/themes/plog/components/Footer.js
+++ b/themes/plog/components/Footer.js
@@ -1,22 +1,18 @@
-import BLOG from '@/blog.config'
 import Vercel from '@/components/Vercel'
+import { siteConfig } from '@/lib/config'
 
 export const Footer = (props) => {
   const d = new Date()
   const currentYear = d.getFullYear()
 
-  const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return <footer className={'z-10 relative mt-6 flex-shrink-0 m-auto w-full text-gray-500 dark:text-gray-400 transition-all' } >
      <div className="my-4 text-sm leading-6">
        <div className="flex align-baseline justify-start flex-wrap space-x-6">
-         <div> © {BLOG.AUTHOR} {copyrightDate}  </div>
-         <div>Powered By <a href="https://github.com/tangly1024/NotionNext" className='underline'>NotionNext {BLOG.VERSION}</a></div>
+         <div> © {siteConfig('AUTHOR')} {copyrightDate}  </div>
+         <div>Powered By <a href="https://github.com/tangly1024/NotionNext" className='underline'>NotionNext {siteConfig('VERSION')}</a></div>
          <Vercel />
        </div>
      </div>
diff --git a/themes/plog/components/JumpToTopButton.js b/themes/plog/components/JumpToTopButton.js
index 30e684a8..f5e22b61 100644
--- a/themes/plog/components/JumpToTopButton.js
+++ b/themes/plog/components/JumpToTopButton.js
@@ -1,5 +1,4 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
 
 /**
  * 跳转到网页顶部
diff --git a/themes/plog/components/LogoBar.js b/themes/plog/components/LogoBar.js
index 07539f2f..46dd8555 100644
--- a/themes/plog/components/LogoBar.js
+++ b/themes/plog/components/LogoBar.js
@@ -1,8 +1,8 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import Link from 'next/link'
 import CONFIG from '../config'
 import { SvgIcon } from './SvgIcon'
+import { siteConfig } from '@/lib/config'
 
 /**
  * logo文字栏
@@ -13,16 +13,16 @@ export default function LogoBar(props) {
   const { navBarTitle, siteInfo } = props
 
   return <div className="flex items-center">
-    <Link href="/" aria-label={BLOG.title}>
+    <Link href="/" aria-label={siteConfig('title')}>
         <div className="h-6 w-6">
-            {CONFIG.NAV_NOTION_ICON
-              ? <LazyImage src={siteInfo?.icon} className='rounded-full' width={24} height={24} alt={BLOG.AUTHOR} />
+            {siteConfig('NOBELIUM_NAV_NOTION_ICON', null, CONFIG)
+              ? <LazyImage src={siteInfo?.icon} className='rounded-full' width={24} height={24} alt={siteConfig('AUTHOR')} />
               : <SvgIcon />}
         </div>
     </Link>
     {navBarTitle
       ? (
-            <Link href="/" aria-label={BLOG.title}>
+            <Link href="/" aria-label={siteConfig('title')}>
                 <p className="ml-2 font-medium text-gray-800 dark:text-gray-300 header-name">
                     {navBarTitle}
                 </p>
@@ -30,8 +30,8 @@ export default function LogoBar(props) {
         )
       : (
             <p className="ml-2 font-medium text-gray-800 dark:text-gray-300 header-name">
-                <Link href="/" aria-label={BLOG.title}> {siteInfo?.title}</Link>
-                {' '}<span className="font-normal text-sm text-gray-00 dark:text-gray-400">{siteInfo?.description}</span>
+                <Link href="/" aria-label={siteConfig('TITLE')}> {siteConfig('TITLE')}</Link>
+                {' '}<span className="font-normal text-sm text-gray-00 dark:text-gray-400">{siteConfig('DESCRIPTION')}</span>
             </p>
         )}
 </div>
diff --git a/themes/plog/components/Modal.js b/themes/plog/components/Modal.js
index fae47bb2..24494df7 100644
--- a/themes/plog/components/Modal.js
+++ b/themes/plog/components/Modal.js
@@ -3,7 +3,7 @@ import { Dialog, Transition } from '@headlessui/react'
 import { usePlogGlobal } from '..'
 import { ArrowPath, ChevronLeft, ChevronRight } from '@/components/HeroIcons'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import LazyImage from '@/components/LazyImage'
 
 /**
@@ -93,7 +93,7 @@ export default function Modal(props) {
                                             <h2 style={{ textShadow: '0.1em 0.1em 0.2em black' }} className='text-2xl md:text-5xl text-white mb-4 px-2 py-1 rounded-lg'>{modalContent?.title}</h2>
                                         </div>
 
-                                        <Link href={`${BLOG.SUB_PATH}/${modalContent.slug}`}>
+                                        <Link href={`${siteConfig('SUB_PATH', '')}/${modalContent.slug}`}>
                                             <div style={{ textShadow: '0.1em 0.1em 0.2em black' }} className={'line-clamp-3 md:line-clamp-none overflow-hidden cursor-pointer text-gray-50 rounded-lg m-2'}>
                                                 {modalContent?.summary}
                                             </div>
diff --git a/themes/plog/components/Nav.js b/themes/plog/components/Nav.js
index 401f0d49..a65beaff 100644
--- a/themes/plog/components/Nav.js
+++ b/themes/plog/components/Nav.js
@@ -1,6 +1,5 @@
 import { useRef, useState } from 'react'
 import Link from 'next/link'
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
 import { SvgIcon } from './SvgIcon'
@@ -8,27 +7,28 @@ import { MenuItemDrop } from './MenuItemDrop'
 import Collapse from '@/components/Collapse'
 import { MenuItemCollapse } from './MenuItemCollapse'
 import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
 
 const Header = props => {
   const { fullWidth, siteInfo } = props
 
-  const title = siteInfo?.title
+  const title = siteConfig('TITLE')
 
   return <div className='md:hidden fixed top-0 w-full z-20'>
         <div id="sticky-nav"
             className={`sticky-nav m-auto w-full h-6 flex flex-row justify-between items-center mb-2 md:mb-12 py-8  glassmorphism ${!fullWidth ? 'max-w-3xl px-4' : 'px-4 md:px-24'
                 }`} >
-                <Link href="/" aria-label={BLOG.title} className="flex items-center">
+                <Link href="/" aria-label={siteConfig('title')} className="flex items-center">
                     <>
                         <div className="h-6 w-6">
                             {/* <SvgIcon/> */}
-                            {CONFIG.NAV_NOTION_ICON
-                              ? <LazyImage src={siteInfo?.icon} width={24} height={24} alt={BLOG.AUTHOR} />
+                            {siteConfig('NOBELIUM_NAV_NOTION_ICON', null, CONFIG)
+                              ? <LazyImage src={siteInfo?.icon} width={24} height={24} alt={siteConfig('AUTHOR')} />
                               : <SvgIcon />}
 
                         </div>
                         <p className="ml-2 font-medium text-gray-800 dark:text-gray-300 header-name">
-                            {title}  {/* ,{' '}<span className="font-normal">{siteInfo?.description}</span> */}
+                            {title}  {/* ,{' '}<span className="font-normal">{siteConfig('HOME_BANNER_IMAGE')}</span> */}
                         </p>
                     </>
                 </Link>
@@ -48,18 +48,18 @@ const NavBar = props => {
 
   const { locale } = useGlobal()
   let links = [
-    { id: 2, name: locale.NAV.RSS, to: '/feed', show: BLOG.ENABLE_RSS && CONFIG.MENU_RSS, target: '_blank' },
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { id: 2, name: locale.NAV.RSS, to: '/feed', show: siteConfig('ENABLE_RSS') && siteConfig('NOBELIUM_MENU_RSS', null, CONFIG), target: '_blank' },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('NOBELIUM_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('NOBELIUM_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('NOBELIUM_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('NOBELIUM_MENU_TAG', null, CONFIG) }
   ]
   if (customNav) {
     links = links.concat(customNav)
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/plog/components/SideBar.js b/themes/plog/components/SideBar.js
index 986063b0..2779a64d 100644
--- a/themes/plog/components/SideBar.js
+++ b/themes/plog/components/SideBar.js
@@ -1,8 +1,9 @@
-import BLOG from '@/blog.config'
 import Live2D from '@/components/Live2D'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
 import dynamic from 'next/dynamic'
+import { siteConfig } from '@/lib/config'
+
 const ExampleRecentComments = dynamic(() => import('./ExampleRecentComments'))
 
 export const SideBar = (props) => {
@@ -48,7 +49,7 @@ export const SideBar = (props) => {
                 </div>
             </aside>
 
-            {BLOG.COMMENT_WALINE_SERVER_URL && BLOG.COMMENT_WALINE_RECENT && <aside className="rounded shadow overflow-hidden mb-6">
+            {siteConfig('COMMENT_WALINE_SERVER_URL') && siteConfig('COMMENT_WALINE_RECENT') && <aside className="rounded shadow overflow-hidden mb-6">
                 <h3 className="text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b">{locale.COMMON.RECENT_COMMENTS}</h3>
 
                 <div className="p-4">
diff --git a/themes/plog/components/SlideOvers.js b/themes/plog/components/SlideOvers.js
index 651758b0..901316bb 100644
--- a/themes/plog/components/SlideOvers.js
+++ b/themes/plog/components/SlideOvers.js
@@ -2,7 +2,7 @@ import { Fragment, useRef, useImperativeHandle, useState } from 'react'
 import { Dialog, Transition } from '@headlessui/react'
 import { Footer } from './Footer'
 import SocialButton from './SocialButton'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 侧拉抽屉
@@ -61,8 +61,8 @@ export default function SlideOvers({ children, cRef }) {
                                         leaveTo="opacity-0 transition-y-32"
                                     >
                                         <div className='max-w-7xl mx-auto space-y-6'>
-                                            <h2 className='text-4xl text-gray-200'>关于{BLOG.AUTHOR}</h2>
-                                            <h2 className='text-2xl text-gray-400'>{BLOG.BIO}</h2>
+                                            <h2 className='text-4xl text-gray-200'>关于{siteConfig('AUTHOR')}</h2>
+                                            <h2 className='text-2xl text-gray-400'>{siteConfig('BIO')}</h2>
                                             <h2 className='text-4xl text-gray-200'>联系我</h2>
                                             <SocialButton/>
                                             <Footer/>
diff --git a/themes/plog/components/SocialButton.js b/themes/plog/components/SocialButton.js
index 821ff90c..56cf9490 100644
--- a/themes/plog/components/SocialButton.js
+++ b/themes/plog/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -9,34 +8,34 @@ import React from 'react'
 const SocialButton = () => {
   return <div className='justify-start flex-wrap flex mx-1'>
     <div className='space-x-3 text-2xl text-gray-600 dark:text-gray-400 text-center'>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {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>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='fab fa-twitter transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='fab fa-telegram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkedIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkedIn'} >
         <i className='transform hover:scale-125 duration-150 fab fa-linkedin dark:hover:text-indigo-400 hover:text-indigo-600'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='fab fa-weibo transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='fab fa-instagram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='fas fa-envelope transform hover:scale-125 duration-150'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='fas fa-rss transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+      {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
         <i className='fab fa-bilibili transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+      {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
         <i className='fab fa-youtube transform hover:scale-125 duration-150'/>
       </a>}
     </div>
diff --git a/themes/plog/components/Title.js b/themes/plog/components/Title.js
index e57e2347..151d736e 100644
--- a/themes/plog/components/Title.js
+++ b/themes/plog/components/Title.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 标题栏
@@ -6,9 +6,9 @@ import BLOG from '@/blog.config'
  * @returns
  */
 export const Title = (props) => {
-  const { siteInfo, post } = props
-  const title = post?.title || siteInfo?.description
-  const description = post?.description || BLOG.AUTHOR
+  const { post } = props
+  const title = post?.title || siteConfig('DESCRIPTION')
+  const description = post?.description || siteConfig('AUTHOR')
 
   return <div className="text-center px-6 py-12 mb-6 bg-gray-100 dark:bg-hexo-black-gray dark:border-hexo-black-gray border-b">
         <h1 className=" text-xl md:text-4xl pb-4">{title}</h1>
diff --git a/themes/plog/config.js b/themes/plog/config.js
index 75f2e597..e2ffeaa5 100644
--- a/themes/plog/config.js
+++ b/themes/plog/config.js
@@ -1,13 +1,13 @@
 const CONFIG = {
 
   // 菜单配置
-  MENU_CATEGORY: false, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: false, // 显示归档
-  MENU_SEARCH: true, // 显示搜索
-  MENU_RSS: false, // 显示订阅
+  NOBELIUM_MENU_CATEGORY: false, // 显示分类
+  NOBELIUM_MENU_TAG: true, // 显示标签
+  NOBELIUM_MENU_ARCHIVE: false, // 显示归档
+  NOBELIUM_MENU_SEARCH: true, // 显示搜索
+  NOBELIUM_MENU_RSS: false, // 显示订阅
 
-  NAV_NOTION_ICON: true // 是否读取Notion图标作为站点头像
+  NOBELIUM_NAV_NOTION_ICON: true // 是否读取Notion图标作为站点头像
 
 }
 export default CONFIG
diff --git a/themes/plog/index.js b/themes/plog/index.js
index eb733e15..22ec32c6 100644
--- a/themes/plog/index.js
+++ b/themes/plog/index.js
@@ -2,8 +2,7 @@ import CONFIG from './config'
 import { createContext, useContext, useEffect, useState } from 'react'
 import Header from './components/Nav'
 import { useGlobal } from '@/lib/global'
-
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { BlogListPage } from './components/BlogListPage'
 import { BlogListScroll } from './components/BlogListScroll'
 import { isBrowser } from '@/lib/utils'
@@ -100,7 +99,7 @@ const LayoutIndex = props => {
 const LayoutPostList = props => {
   return (
         <LayoutBase {...props}>
-            {BLOG.POST_LIST_STYLE === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
+            {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
         </LayoutBase>
   )
 }
diff --git a/themes/simple/components/ArticleInfo.js b/themes/simple/components/ArticleInfo.js
index 30e1b5f4..26c13a93 100644
--- a/themes/simple/components/ArticleInfo.js
+++ b/themes/simple/components/ArticleInfo.js
@@ -1,7 +1,7 @@
 import Link from 'next/link'
 import { useGlobal } from '@/lib/global'
 import CONFIG from '../config'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { formatDateFmt } from '@/lib/formatDate'
 
 export const ArticleInfo = (props) => {
@@ -19,7 +19,7 @@ export const ArticleInfo = (props) => {
 
                 {post?.type !== 'Page' && (<>
                     <div className="mb-4 text-sm text-gray-700 dark:text-gray-300">
-                        <span> <i className="fa-regular fa-user"></i> <a href={CONFIG.AUTHOR_LINK}>{BLOG.AUTHOR}</a></span>
+                        <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>}
                         {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>)}
diff --git a/themes/simple/components/BlogArchiveItem.js b/themes/simple/components/BlogArchiveItem.js
index b8184f45..809ac6d8 100644
--- a/themes/simple/components/BlogArchiveItem.js
+++ b/themes/simple/components/BlogArchiveItem.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 
 /**
@@ -25,7 +25,7 @@ export default function BlogArchiveItem({ archiveTitle, archivePosts }) {
                             </span>{' '}
                             &nbsp;
                             <Link
-                                href={`${BLOG.SUB_PATH}/${post.slug}`}
+                                href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                                 passHref
                                 className="dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600">
 
diff --git a/themes/simple/components/BlogItem.js b/themes/simple/components/BlogItem.js
index 49f5cd12..2fb2d7ae 100644
--- a/themes/simple/components/BlogItem.js
+++ b/themes/simple/components/BlogItem.js
@@ -1,8 +1,8 @@
-import BLOG from '@/blog.config'
 import Link from 'next/link'
 import CONFIG from '../config'
 import TwikooCommentCount from '@/components/TwikooCommentCount'
 import { formatDateFmt } from '@/lib/formatDate'
+import { siteConfig } from '@/lib/config'
 
 export const BlogItem = props => {
   const { post } = props
@@ -12,7 +12,7 @@ export const BlogItem = props => {
 
         <h2 className="mb-2">
             <Link
-                href={`${BLOG.SUB_PATH}/${post.slug}`}
+                href={`${siteConfig('SUB_PATH', '')}/${post.slug}`}
                 className="blog-item-title font-bold text-black text-2xl menu-link">
                 {post.title}
             </Link>
@@ -22,7 +22,7 @@ export const BlogItem = props => {
 
         <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={CONFIG.AUTHOR_LINK} className='p-1 hover:text-red-400 transition-all duration-200'><i className="fa-regular fa-user"></i> {BLOG.AUTHOR}</a></span>
+                <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}
@@ -43,7 +43,7 @@ export const BlogItem = props => {
         </div>
 
         <div className='block'>
-            <Link href={`${BLOG.SUB_PATH}/${post.slug}`} className='inline-block rounded-sm text-blue-600 text-xs dark:border-gray-800 border hover:text-red-400 transition-all duration-200 hover:border-red-300 h-9 leading-8 px-5'>
+            <Link href={`${siteConfig('SUB_PATH', '')}/${post.slug}`} className='inline-block rounded-sm text-blue-600 text-xs dark:border-gray-800 border hover:text-red-400 transition-all duration-200 hover:border-red-300 h-9 leading-8 px-5'>
                 Continue Reading <i className="fa-solid fa-angle-right align-middle"></i>
             </Link>
         </div>
diff --git a/themes/simple/components/BlogListPage.js b/themes/simple/components/BlogListPage.js
index e05d4ecf..f09fb801 100644
--- a/themes/simple/components/BlogListPage.js
+++ b/themes/simple/components/BlogListPage.js
@@ -1,14 +1,14 @@
 
-import BLOG from '@/blog.config'
 import { useRouter } from 'next/router'
 import Link from 'next/link'
 import { BlogItem } from './BlogItem'
 import { AdSlot } from '@/components/GoogleAdsense'
+import { siteConfig } from '@/lib/config'
 
 export const BlogListPage = props => {
   const { page = 1, posts, postCount } = props
   const router = useRouter()
-  const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
   const currentPage = +page
 
   const showPrev = currentPage > 1
diff --git a/themes/simple/components/BlogListScroll.js b/themes/simple/components/BlogListScroll.js
index dc0b7dd3..8ae37cc8 100644
--- a/themes/simple/components/BlogListScroll.js
+++ b/themes/simple/components/BlogListScroll.js
@@ -1,33 +1,33 @@
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
-import React from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import throttle from 'lodash.throttle'
 import { BlogItem } from './BlogItem'
+import { siteConfig } from '@/lib/config'
 
 export const BlogListScroll = props => {
   const { posts } = props
   const { locale } = useGlobal()
 
-  const [page, updatePage] = React.useState(1)
+  const [page, updatePage] = useState(1)
 
   let hasMore = false
   const postsToShow = posts
-    ? Object.assign(posts).slice(0, BLOG.POSTS_PER_PAGE * page)
+    ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
     : []
 
   if (posts) {
     const totalCount = posts.length
-    hasMore = page * BLOG.POSTS_PER_PAGE < totalCount
+    hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
   }
   const handleGetMore = () => {
     if (!hasMore) return
     updatePage(page + 1)
   }
 
-  const targetRef = React.useRef(null)
+  const targetRef = useRef(null)
 
   // 监听滚动自动分页加载
-  const scrollTrigger = React.useCallback(throttle(() => {
+  const scrollTrigger = useCallback(throttle(() => {
     const scrollS = window.scrollY + window.outerHeight
     const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
     if (scrollS > clientHeight + 100) {
@@ -35,7 +35,7 @@ export const BlogListScroll = props => {
     }
   }, 500))
 
-  React.useEffect(() => {
+  useEffect(() => {
     window.addEventListener('scroll', scrollTrigger)
 
     return () => {
diff --git a/themes/simple/components/ExampleRecentComments.js b/themes/simple/components/ExampleRecentComments.js
index b1555c1d..7aad731b 100644
--- a/themes/simple/components/ExampleRecentComments.js
+++ b/themes/simple/components/ExampleRecentComments.js
@@ -1,7 +1,7 @@
-import React from 'react'
-import BLOG from '@/blog.config'
 import Link from 'next/link'
 import { RecentComments } from '@waline/client'
+import { useEffect, useState } from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * @see https://waline.js.org/guide/get-started.html
@@ -9,11 +9,11 @@ import { RecentComments } from '@waline/client'
  * @returns
  */
 const ExampleRecentComments = (props) => {
-  const [comments, updateComments] = React.useState([])
-  const [onLoading, changeLoading] = React.useState(true)
-  React.useEffect(() => {
+  const [comments, updateComments] = useState([])
+  const [onLoading, changeLoading] = useState(true)
+  useEffect(() => {
     RecentComments({
-      serverURL: BLOG.COMMENT_WALINE_SERVER_URL,
+      serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
       count: 5
     }).then(({ comments }) => {
       changeLoading(false)
diff --git a/themes/simple/components/Footer.js b/themes/simple/components/Footer.js
index 7ebcfc32..d902f341 100644
--- a/themes/simple/components/Footer.js
+++ b/themes/simple/components/Footer.js
@@ -1,28 +1,24 @@
-import BLOG from '@/blog.config'
 import DarkModeButton from '@/components/DarkModeButton'
+import { siteConfig } from '@/lib/config'
 
 export const Footer = (props) => {
   const d = new Date()
   const currentYear = d.getFullYear()
-  const copyrightDate = (function() {
-    if (Number.isInteger(BLOG.SINCE) && BLOG.SINCE < currentYear) {
-      return BLOG.SINCE + '-' + currentYear
-    }
-    return currentYear
-  })()
+  const since = siteConfig('SINCE')
+  const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
 
   return <footer className="relative w-full bg-black px-6 border-t">
         <DarkModeButton className='text-center pt-4'/>
 
         <div className="text-yellow-300 container mx-auto max-w-4xl py-6 md:flex flex-wrap md:flex-no-wrap md:justify-between items-center text-sm">
-            <div className='text-center'> &copy;{`${copyrightDate}`} {BLOG.AUTHOR}. All rights reserved.</div>
+            <div className='text-center'> &copy;{`${copyrightDate}`} {siteConfig('AUTHOR')}. All rights reserved.</div>
             <div className="md:p-0 text-center md:text-right text-xs">
                 {/* 右侧链接 */}
                 {/* <a href="#" className="text-black no-underline hover:underline">Privacy Policy</a> */}
-                {BLOG.BEI_AN && (<a href="https://beian.miit.gov.cn/" className="text-black dark:text-gray-200 no-underline hover:underline ml-4">{BLOG.BEI_AN} </a>)}
+                {siteConfig('BEI_AN') && (<a href="https://beian.miit.gov.cn/" className="text-black dark:text-gray-200 no-underline hover:underline ml-4">{siteConfig('BEI_AN')} </a>)}
                 <span className='no-underline ml-4'>
                     Powered by
-                    <a href="https://github.com/tangly1024/NotionNext" className=' hover:underline'> NotionNext {BLOG.VERSION}  </a>
+                    <a href="https://github.com/tangly1024/NotionNext" className=' hover:underline'> NotionNext {siteConfig('VERSION')}  </a>
                 </span>
             </div>
         </div>
diff --git a/themes/simple/components/Header.js b/themes/simple/components/Header.js
index 8d98310d..a5bc8988 100644
--- a/themes/simple/components/Header.js
+++ b/themes/simple/components/Header.js
@@ -1,9 +1,8 @@
-import BLOG from '@/blog.config'
 import LazyImage from '@/components/LazyImage'
 import Link from 'next/link'
 import CONFIG from '../config'
 import SocialButton from './SocialButton'
-// import CONFIG from '../config_simple'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 网站顶部
@@ -11,7 +10,7 @@ import SocialButton from './SocialButton'
  */
 export const Header = (props) => {
   const { siteInfo } = props
-  const avatar = siteInfo?.icon || BLOG.AVATAR
+  const avatar = siteInfo?.icon || siteConfig('AVATAR')
 
   return (
         <header className="text-center justify-between items-center px-6 bg-white h-80 dark:bg-black relative z-10">
@@ -20,12 +19,12 @@ export const Header = (props) => {
                     {/* 可使用一张单图作为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={BLOG.AUTHOR} />
+                            <LazyImage src={avatar} className='rounded-full' width={130} height={130} alt={siteConfig('AUTHOR')} />
                         </div>
 
                         <div className='flex-col flex justify-center'>
-                            <div className='text-2xl font-serif dark:text-white py-2 hover:scale-105 transform duration-200'>{BLOG.AUTHOR}</div>
-                            <div className='font-light dark:text-white py-2 hover:scale-105 transform duration-200 text-center' dangerouslySetInnerHTML={{ __html: CONFIG.LOGO_DESCRIPTION }} />
+                            <div className='text-2xl font-serif dark:text-white py-2 hover:scale-105 transform duration-200'>{siteConfig('AUTHOR')}</div>
+                            <div className='font-light dark:text-white py-2 hover:scale-105 transform duration-200 text-center' dangerouslySetInnerHTML={{ __html: siteConfig('SIMPLE_LOGO_DESCRIPTION', null, CONFIG) }} />
                         </div>
                     </div>
                 </Link>
@@ -33,7 +32,7 @@ export const Header = (props) => {
                 <div className='flex justify-center'>
                 <SocialButton />
                 </div>
-                <div className='text-xs mt-4 text-gray-500 dark:text-gray-300'>{siteInfo?.description}</div>
+                <div className='text-xs mt-4 text-gray-500 dark:text-gray-300'>{siteConfig('DESCRIPTION')}</div>
             </div>
         </header>
   )
diff --git a/themes/simple/components/JumpToTopButton.js b/themes/simple/components/JumpToTopButton.js
index 2ed28ab4..358c9372 100644
--- a/themes/simple/components/JumpToTopButton.js
+++ b/themes/simple/components/JumpToTopButton.js
@@ -1,5 +1,5 @@
 import { useGlobal } from '@/lib/global'
-import React from 'react'
+import { useEffect, useState } from 'react'
 
 /**
  * 跳转到网页顶部
@@ -11,7 +11,7 @@ import React from 'react'
  */
 const JumpToTopButton = () => {
   const { locale } = useGlobal()
-  const [show, switchShow] = React.useState(false)
+  const [show, switchShow] = useState(false)
   const scrollListener = () => {
     const scrollY = window.pageYOffset
     const shouldShow = scrollY > 200
@@ -20,7 +20,7 @@ const JumpToTopButton = () => {
     }
   }
 
-  React.useEffect(() => {
+  useEffect(() => {
     document.addEventListener('scroll', scrollListener)
     return () => document.removeEventListener('scroll', scrollListener)
   }, [show])
diff --git a/themes/simple/components/MenuItemCollapse.js b/themes/simple/components/MenuItemCollapse.js
index 1d3face5..d335d806 100644
--- a/themes/simple/components/MenuItemCollapse.js
+++ b/themes/simple/components/MenuItemCollapse.js
@@ -43,8 +43,8 @@ export const MenuItemCollapse = (props) => {
 
         {/* 折叠子菜单 */}
         {hasSubMenu && <Collapse isOpen={isOpen} onHeightChange={props.onHeightChange}>
-            {link.subMenus.map(sLink => {
-              return <div key={sLink.id} className='font-extralight dark:bg-black text-left px-10 justify-start text-blue-400 bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
+            {link.subMenus.map((sLink, index) => {
+              return <div key={index} className='font-extralight dark:bg-black text-left px-10 justify-start text-blue-400 bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
                         <span className='ml-4 text-xs'>{sLink?.icon && <span className='mr-2 w-4'><i className={sLink.icon}/></span>}{sLink.title}</span>
                     </Link>
diff --git a/themes/simple/components/MenuItemDrop.js b/themes/simple/components/MenuItemDrop.js
index 9f79e609..b4be6381 100644
--- a/themes/simple/components/MenuItemDrop.js
+++ b/themes/simple/components/MenuItemDrop.js
@@ -15,8 +15,8 @@ export const MenuItemDrop = ({ link }) => {
             <Link
                 href={link?.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}
                 className="font-sans menu-link pl-2 pr-4 text-gray-700 dark:text-gray-200 no-underline tracking-widest pb-1">
-                <>{link?.icon && <span className='mr-2'><i className={link.icon} /></span>}{link?.name}
-                    {hasSubMenu && <i className='px-2 fa fa-angle-down'></i>}</>
+                {link?.icon && <span className='mr-2'><i className={link.icon} /></span>}{link?.name}
+                    {hasSubMenu && <i className='px-2 fa fa-angle-down'></i>}
             </Link>}
 
         {hasSubMenu && <>
@@ -28,8 +28,8 @@ export const MenuItemDrop = ({ link }) => {
 
         {/* 子菜单 */}
         {hasSubMenu && <ul className={`${show ? 'visible opacity-100 top-12' : 'invisible opacity-0 top-10'} border-gray-100  bg-white  dark:bg-black dark:border-gray-800 transition-all duration-300 z-20 absolute block drop-shadow-lg `}>
-            {link.subMenus.map(sLink => {
-              return <li key={sLink.id} className='not:last-child:border-b-0 border-b text-blue-500 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 dark:border-gray-800  py-3 pr-6 pl-2'>
+            {link.subMenus.map((sLink, index) => {
+              return <li key={index} className='not:last-child:border-b-0 border-b text-blue-500 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 dark:border-gray-800  py-3 pr-6 pl-2'>
                     <Link href={sLink.to} target={link?.to?.indexOf('http') === 0 ? '_blank' : '_self'}>
                         <span className='text-sm text-nowrap font-extralight'>{sLink?.icon && <i className={sLink?.icon} > &nbsp; </i>}{sLink.title}</span>
                     </Link>
diff --git a/themes/simple/components/MenuList.js b/themes/simple/components/MenuList.js
index ba15befa..13dfe9a5 100644
--- a/themes/simple/components/MenuList.js
+++ b/themes/simple/components/MenuList.js
@@ -1,5 +1,5 @@
-import BLOG from '@/blog.config'
 import Collapse from '@/components/Collapse'
+import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import { useEffect, useRef, useState } from 'react'
@@ -29,10 +29,10 @@ export const MenuList = ({ customNav, customMenu }) => {
   })
 
   let links = [
-    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
-    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE },
-    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('SIMPLE_MENU_SEARCH', null, CONFIG) },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('SIMPLE_MENU_ARCHIVE', null, CONFIG) },
+    { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('SIMPLE_MENU_CATEGORY', null, CONFIG) },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('SIMPLE_MENU_TAG', null, CONFIG) }
   ]
 
   if (customNav) {
@@ -40,7 +40,7 @@ export const MenuList = ({ customNav, customMenu }) => {
   }
 
   // 如果 开启自定义菜单，则覆盖Page生成的菜单
-  if (BLOG.CUSTOM_MENU) {
+  if (siteConfig('CUSTOM_MENU')) {
     links = customMenu
   }
 
diff --git a/themes/simple/components/SocialButton.js b/themes/simple/components/SocialButton.js
index 6a53cd70..0e2b9065 100644
--- a/themes/simple/components/SocialButton.js
+++ b/themes/simple/components/SocialButton.js
@@ -1,5 +1,4 @@
-import BLOG from '@/blog.config'
-import React from 'react'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 社交联系方式按钮组
@@ -9,34 +8,34 @@ import React from 'react'
 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'>
-      {BLOG.CONTACT_GITHUB && <a target='_blank' rel='noreferrer' title={'github'} href={BLOG.CONTACT_GITHUB} >
+      {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>}
-      {BLOG.CONTACT_TWITTER && <a target='_blank' rel='noreferrer' title={'twitter'} href={BLOG.CONTACT_TWITTER} >
+      {siteConfig('CONTACT_TWITTER') && <a target='_blank' rel='noreferrer' title={'twitter'} href={siteConfig('CONTACT_TWITTER')} >
         <i className='fab fa-twitter transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_TELEGRAM && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_TELEGRAM} title={'telegram'} >
+      {siteConfig('CONTACT_TELEGRAM') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_TELEGRAM')} title={'telegram'} >
         <i className='fab fa-telegram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_LINKEDIN && <a target='_blank' rel='noreferrer' href={BLOG.CONTACT_LINKEDIN} title={'linkedIn'} >
+      {siteConfig('CONTACT_LINKEDIN') && <a target='_blank' rel='noreferrer' href={siteConfig('CONTACT_LINKEDIN')} title={'linkedIn'} >
       <i className='fab fa-linkedin transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_WEIBO && <a target='_blank' rel='noreferrer' title={'weibo'} href={BLOG.CONTACT_WEIBO} >
+      {siteConfig('CONTACT_WEIBO') && <a target='_blank' rel='noreferrer' title={'weibo'} href={siteConfig('CONTACT_WEIBO')} >
         <i className='fab fa-weibo transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_INSTAGRAM && <a target='_blank' rel='noreferrer' title={'instagram'} href={BLOG.CONTACT_INSTAGRAM} >
+      {siteConfig('CONTACT_INSTAGRAM') && <a target='_blank' rel='noreferrer' title={'instagram'} href={siteConfig('CONTACT_INSTAGRAM')} >
         <i className='fab fa-instagram transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_EMAIL && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${BLOG.CONTACT_EMAIL}`} >
+      {siteConfig('CONTACT_EMAIL') && <a target='_blank' rel='noreferrer' title={'email'} href={`mailto:${siteConfig('CONTACT_EMAIL')}`} >
         <i className='fas fa-envelope transform hover:scale-125 duration-150'/>
       </a>}
-      {JSON.parse(BLOG.ENABLE_RSS) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
+      {JSON.parse(siteConfig('ENABLE_RSS')) && <a target='_blank' rel='noreferrer' title={'RSS'} href={'/feed'} >
         <i className='fas fa-rss transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_BILIBILI && <a target='_blank' rel='noreferrer' title={'bilibili'} href={BLOG.CONTACT_BILIBILI} >
+      {siteConfig('CONTACT_BILIBILI') && <a target='_blank' rel='noreferrer' title={'bilibili'} href={siteConfig('CONTACT_BILIBILI')} >
         <i className='fab fa-bilibili transform hover:scale-125 duration-150'/>
       </a>}
-      {BLOG.CONTACT_YOUTUBE && <a target='_blank' rel='noreferrer' title={'youtube'} href={BLOG.CONTACT_YOUTUBE} >
+      {siteConfig('CONTACT_YOUTUBE') && <a target='_blank' rel='noreferrer' title={'youtube'} href={siteConfig('CONTACT_YOUTUBE')} >
         <i className='fab fa-youtube transform hover:scale-125 duration-150'/>
       </a>}
     </div>
diff --git a/themes/simple/components/Title.js b/themes/simple/components/Title.js
index e57e2347..151d736e 100644
--- a/themes/simple/components/Title.js
+++ b/themes/simple/components/Title.js
@@ -1,4 +1,4 @@
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 标题栏
@@ -6,9 +6,9 @@ import BLOG from '@/blog.config'
  * @returns
  */
 export const Title = (props) => {
-  const { siteInfo, post } = props
-  const title = post?.title || siteInfo?.description
-  const description = post?.description || BLOG.AUTHOR
+  const { post } = props
+  const title = post?.title || siteConfig('DESCRIPTION')
+  const description = post?.description || siteConfig('AUTHOR')
 
   return <div className="text-center px-6 py-12 mb-6 bg-gray-100 dark:bg-hexo-black-gray dark:border-hexo-black-gray border-b">
         <h1 className=" text-xl md:text-4xl pb-4">{title}</h1>
diff --git a/themes/simple/components/TopBar.js b/themes/simple/components/TopBar.js
index eca11258..05e3cd7b 100644
--- a/themes/simple/components/TopBar.js
+++ b/themes/simple/components/TopBar.js
@@ -1,14 +1,15 @@
 import CONFIG from '../config'
+import { siteConfig } from '@/lib/config'
 
 /**
  * 网站顶部 提示栏
  * @returns
  */
 export const TopBar = (props) => {
-  if (CONFIG.TOP_BAR_CONTENT) {
+  if (siteConfig('SIMPLE_TOP_BAR_CONTENT', null, CONFIG)) {
     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: CONFIG.TOP_BAR_CONTENT }}/>
+       <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>
     </header>
   }
diff --git a/themes/simple/config.js b/themes/simple/config.js
index 4e4804bd..dcaf8c54 100644
--- a/themes/simple/config.js
+++ b/themes/simple/config.js
@@ -1,16 +1,16 @@
 const CONFIG = {
 
-  LOGO_IMG: '/Logo.webp',
-  TOP_BAR: true, // 显示顶栏
-  TOP_BAR_CONTENT: process.env.NEXT_PUBLIC_THEME_SIMPLE_TOP_TIPS || '',
-  LOGO_DESCRIPTION: process.env.NEXT_PUBLIC_THEME_SIMPLE_LOGO_DESCRIPTION || '<div>编程爱好者<br/>/互联网从业者<br/>/知识分享博主</div>',
+  SIMPLE_LOGO_IMG: '/Logo.webp',
+  SIMPLE_TOP_BAR: true, // 显示顶栏
+  SIMPLE_TOP_BAR_CONTENT: process.env.NEXT_PUBLIC_THEME_SIMPLE_TOP_TIPS || '',
+  SIMPLE_LOGO_DESCRIPTION: process.env.NEXT_PUBLIC_THEME_SIMPLE_LOGO_DESCRIPTION || '<div>编程爱好者<br/>/互联网从业者<br/>/知识分享博主</div>',
 
-  AUTHOR_LINK: process.env.NEXT_PUBLIC_AUTHOR_LINK || '#',
+  SIMPLE_AUTHOR_LINK: process.env.NEXT_PUBLIC_AUTHOR_LINK || '#',
 
   // 菜单配置
-  MENU_CATEGORY: true, // 显示分类
-  MENU_TAG: true, // 显示标签
-  MENU_ARCHIVE: true, // 显示归档
-  MENU_SEARCH: true // 显示搜索
+  SIMPLE_MENU_CATEGORY: true, // 显示分类
+  SIMPLE_MENU_TAG: true, // 显示标签
+  SIMPLE_MENU_ARCHIVE: true, // 显示归档
+  SIMPLE_MENU_SEARCH: true // 显示搜索
 }
 export default CONFIG
diff --git a/themes/simple/index.js b/themes/simple/index.js
index 03dd521d..aebb9d21 100644
--- a/themes/simple/index.js
+++ b/themes/simple/index.js
@@ -15,7 +15,7 @@ import Link from 'next/link'
 import { TopBar } from './components/TopBar'
 import { Header } from './components/Header'
 import { NavBar } from './components/NavBar'
-import BLOG from '@/blog.config'
+import { siteConfig } from '@/lib/config'
 import { SideBar } from './components/SideBar'
 import JumpToTopButton from './components/JumpToTopButton'
 import { Footer } from './components/Footer'
@@ -45,7 +45,7 @@ const LayoutBase = props => {
             <CommonHead meta={meta}/>
             <Style/>
 
-            {CONFIG.TOP_BAR && <TopBar {...props} />}
+            {siteConfig('SIMPLE_TOP_BAR', null, CONFIG) && <TopBar {...props} />}
 
             {/* 顶部LOGO */}
             <Header {...props} />
@@ -54,7 +54,7 @@ const LayoutBase = props => {
             <NavBar {...props} />
 
             {/* 主体 */}
-            <div id='container-wrapper' className={(BLOG.LAYOUT_SIDEBAR_REVERSE ? 'flex-row-reverse' : '') + ' w-full flex-1 flex items-start max-w-9/10 mx-auto pt-12'}>
+            <div id='container-wrapper' className={(JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE')) ? 'flex-row-reverse' : '') + ' w-full flex-1 flex items-start max-w-9/10 mx-auto pt-12'}>
                 <div id='container-inner ' className='w-full flex-grow min-h-fit'>
                     <Transition
                         show={!onLoading}
@@ -107,7 +107,7 @@ const LayoutIndex = props => {
 const LayoutPostList = props => {
   return (
         <LayoutBase {...props}>
-            {BLOG.POST_LIST_STYLE === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
+            {siteConfig('POST_LIST_STYLE') === 'page' ? <BlogListPage {...props} /> : <BlogListScroll {...props} />}
         </LayoutBase>
   )
 }
diff --git a/themes/theme.js b/themes/theme.js
index f03f3fe6..360e59a2 100644
--- a/themes/theme.js
+++ b/themes/theme.js
@@ -1,6 +1,6 @@
 import cookie from 'react-cookies'
 import BLOG from '@/blog.config'
-import { getQueryParam, getQueryVariable } from '../lib/utils'
+import { getQueryParam, getQueryVariable, isBrowser } from '../lib/utils'
 import dynamic from 'next/dynamic'
 import getConfig from 'next/config'
 import * as ThemeComponents from '@theme-components'
@@ -12,13 +12,38 @@ export const { THEMES = [] } = getConfig().publicRuntimeConfig
  * @param {*} router
  * @returns
  */
-export const getLayoutByTheme = (router) => {
-  const themeQuery = getQueryParam(router.asPath, 'theme') || BLOG.THEME
-  const layout = getLayoutNameByPath(router.pathname)
+export const getLayoutByTheme = ({ router, theme }) => {
+  const themeQuery = getQueryParam(router.asPath, 'theme') || theme
+  const layoutName = getLayoutNameByPath(router.pathname)
+
   if (themeQuery !== BLOG.THEME) {
-    return dynamic(() => import(`@/themes/${themeQuery}`).then(m => m[layout]), { ssr: true })
+    return dynamic(() => import(`@/themes/${themeQuery}`).then(m => {
+      setTimeout(() => {
+        checkThemeDOM()
+      }, 500);
+      return m[layoutName]
+    }), { ssr: true })
   } else {
-    return ThemeComponents[layout]
+    setTimeout(() => {
+      checkThemeDOM()
+    }, 100);
+    return ThemeComponents[layoutName]
+  }
+}
+
+/**
+ * 切换主题时的特殊处理
+ */
+const checkThemeDOM = () => {
+  if (isBrowser) {
+    const elements = document.querySelectorAll('[id^="theme-"]')
+    if (elements?.length > 1) {
+      elements[elements.length - 1].scrollIntoView()
+      // 删除前面的元素，只保留最后一个元素
+      for (let i = 0; i < elements.length - 1; i++) {
+        elements[i].parentNode.removeChild(elements[i])
+      }
+    }
   }
 }