Merge branch 'tangly1024:main' into main

2026-05-18 07:26:48 +00:00 · 2023-05-04 09:31:33 +08:00
parent 6f8bc27b0a 2db7b473dd
commit 890b308194
24 changed files with 677 additions and 151 deletions
--- a/.env.local
+++ b/.env.local
@@ -1,2 +1,2 @@
 # 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables
-NEXT_PUBLIC_VERSION=3.13.4
+NEXT_PUBLIC_VERSION=3.13.5
--- a/README.md
+++ b/README.md
@@ -15,6 +15,11 @@
  </a>
 </p>

+
+中文文档 | [README in English](./README_EN.md)
+
+<hr/>
+
 一个使用 NextJS + Notion API 实现的，部署在 Vercel 上的静态博客系统。为Notion和所有创作者设计。


@@ -35,7 +40,10 @@
 - [个性配置手册 - 如何配置功能插件](https://tangly1024.com/article/notion-next-guide) 

 - [二次开发指引 - 如何进行本地开发](https://tangly1024.com/article/how-to-develop-with-notion-next)
- 
+
+- [更新操作指南 - 获取最新升级补丁](https://tangly1024.com/article/how-to-update-notionnext)
+
+- [历史版本汇总 - 查询版本功能特性](https://tangly1024.com/article/notion-next-changelogs)

 ## 致谢
 感谢Craig Hart发起的Nobelium项目
@@ -155,6 +163,11 @@
  <td align="center">
    <a href="https://github.com/hongzzz" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/25585061" width="64px;"  alt="Hongzzz"/><br/><sub><b>Hongzzz</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=hongzzz" title="hongzzz" >🔧 🐛</a>
  </td>
+
+  <td align="center">
+    <a href="https://github.com/RedhairHambagu" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/129669334" width="64px;"  alt="RedhairHambagu"/><br/><sub><b>RedhairHambagu</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=RedhairHambagu" title="RedhairHambagu" >🔧 🐛</a>
+  </td>
+
 </tr>
 </table>

--- a/README_EN.md
+++ b/README_EN.md
@@ -0,0 +1,187 @@
+# NotionNext
+
+<p>
+  <a aria-label="GitHub commit activity" href="https://github.com/tangly1024/NotionNext/commits/main" title="GitHub commit activity">
+    <img src="https://img.shields.io/github/commit-activity/m/tangly1024/NotionNext?style=for-the-badge"/>
+  </a>
+  <a aria-label="GitHub contributors" href="https://github.com/tangly1024/NotionNext/graphs/contributors" title="GitHub contributors">
+    <img src="https://img.shields.io/github/contributors/tangly1024/NotionNext?color=orange&style=for-the-badge"/>
+  </a>
+  <a aria-label="Build status" href="#" title="Build status">
+    <img src="https://img.shields.io/github/deployments/tangly1024/NotionNext/Production?logo=Vercel&style=for-the-badge"/>
+  </a>
+  <a aria-label="Powered by Vercel" href="https://vercel.com?utm_source=Craigary&utm_campaign=oss" title="Powered by Vercel">
+    <img src="https://www.datocms-assets.com/31049/1618983297-powered-by-vercel.svg" height="28"/>
+  </a>
+</p>
+
+
+[中文文档](./README.md) | README in English
+
+<hr/>
+
+A static blog system built with NextJS and Notion API, deployed on Vercel. Designed for Notion and all creators.
+
+
+## Preview
+
+Live Demo：[https://preview.tangly1024.com/](https://preview.tangly1024.com/) ，Project supports switching between multiple themes. Can't find a theme you like? How about [contributing](/CONTRIBUTING.md) one?~
+
+| Next | Medium | Hexo | Fukasawa |
+|--|--|--|--|
+| <img src='./docs/theme-next.png' width='300'/> [NEXT](https://preview.tangly1024.com/?theme=next)  | <img src='./docs/theme-medium.png' width='300'/> [MEDIUM](https://preview.tangly1024.com/?theme=medium) | <img src='./docs/theme-hexo.png' width='300'/> [HEXO](https://preview.tangly1024.com/?theme=hexo) | <img src='./docs/theme-fukasawa.png' width='300'/> [FUKASAWA](https://preview.tangly1024.com/?theme=fukasawa) |
+
+## Get Start!
+
+It only takes a few minutes to set up your personal site:
+
+- [Quick Deployment Tutorial - Multiple Options Available](https://tangly1024.com/article/notion-next) 
+
+- [Customization Guide - How to Configure Feature Plugins](https://tangly1024.com/article/notion-next-guide) 
+
+- [Development Guide - How to Conduct Local Development](https://tangly1024.com/article/how-to-develop-with-notion-next)
+ 
+- [Update Guide - How to Get the Latest Upgrade Patch](https://tangly1024.com/article/how-to-update-notionnext)
+
+- [Version History - Check Feature Highlights for Each Version](https://tangly1024.com/article/notion-next-changelogs)
+
+## Acknowledgements
+
+Special thanks to Craig Hart for initiating the Nobelium project.
+
+<table><tr align="left">
+  <td align="center"><a href="https://github.com/craigary" title="Craig Hart"><img src="https://avatars.githubusercontent.com/u/10571717" width="64px;"alt="Craig Hart"/></a><br/><a href="https://github.com/craigary" title="Craig Hart">Craig Hart</a></td>
+</tr></table>
+
+## Contributors
+
+<table>
+  <tr align="left">
+  <td align="center">
+  <a href="https://github.com/tangly1024" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/15920488" width="64px;"alt="tangly1024"/><br/><sub><b>tangly1024</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=tangly1024" title="Owner" >🎫 🔧 🐛</a>
+  </td> 
+    
+  <td align="center">
+    <a href="https://github.com/uWayLu"  style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/21689326" width="64px;" alt="uWayLu"/><br/><sub><b>uWayLu</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=uWayLu" title="uWayLu" >🔧 🐛</a>
+  </td>
+    
+  <td align="center">
+    <a href="https://github.com/txs" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/554329" width="64px;" alt="txs"/><br/><sub><b>txs</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=txs" title="txs" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/yuzhanglong" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/56540811" width="64px;" alt="yuzhanglong"/><br/><sub><b>yuzhanglong</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=yuzhanglong" title="yuzhanglong" >🔧 🐛</a>
+  </td> 
+    
+  <td align="center">
+    <a href="https://github.com/Hscpro" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/13926044" width="64px;" alt="Hscpro"/><br/><sub><b>Hscpro</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=Hscpro" title="Hscpro" >🔧 🐛</a>
+  </td> 
+    
+  <td align="center">
+    <a href="https://github.com/JensonMiao" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/46488783" width="64px;" alt="JensonMiao"/><br/><sub><b>JensonMiao</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=JensonMiao" title="JensonMiao" >🔧 🐛</a>
+  </td> 
+  
+  <td align="center">
+    <a href="https://github.com/haixin1225" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/28828438" width="64px;"  alt="haixin1225"/><br/><sub><b>haixin1225</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=haixin1225" title="haixin1225" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/mouyase" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/7844572" width="64px;"  alt="mouyase"/><br/><sub><b>mouyase</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=mouyase" title="mouyase" >🔧 🐛</a>
+  </td>
+  
+  <td align="center">
+    <a href="https://github.com/qfdk" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/2404478" width="64px;"  alt="qfdk"/><br/><sub><b>qfdk</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=qfdk" title="qfdk" >🔧 🐛</a>
+  </td>
+  
+  <td align="center">
+    <a href="https://github.com/ifyz" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/118271360" width="64px;"  alt="ifyz"/><br/><sub><b>ifyz</b></sub></a><br><a href="https://github.com/tangly1024/NotionNext/commits?author=ifyz" title="ifyz" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/liqun98" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/71168966" width="64px;"  alt="Liqun Zhao"/><br/><sub><b>Liqun Zhao</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=liqun98" title="liqun98" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/Ylarod" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/30978685" width="64px;"  alt="Ylarod"/><br/><sub><b>Ylarod</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=Ylarod" title="Ylarod" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/lifeafter619" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/65111206" width="64px;"  alt="Etherrreal."/><br/><sub><b>Etherrreal.</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=lifeafter619" title="Etherrreal." >🔧 🐛</a>
+  </td>
+  
+  <td align="center">
+  <a href="https://github.com/ykxkykx" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/17985993" width="64px;"  alt="Joshua Astray"/><br/><sub><b>Joshua Astray</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=ykxkykx" title="ykxkykx" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/Vixcity" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/57704177" width="64px;"  alt="Vixcity"/><br/><sub><b>Vixcity</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=Vixcity" title="Vixcity" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/ipatpat" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/39089551" width="64px;"  alt="ipatpat"/><br/><sub><b>ipatpat</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=ipatpat" title="ipatpat" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/xloong" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/8479955" width="64px;"  alt="xloong"/><br/><sub><b>xloong</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=xloong" title="xloong" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/expoli" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/31023767" width="64px;"  alt="expoli"/><br/><sub><b>expoli</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=expoli" title="expoli" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/SuperHuangXu" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/14816052" width="64px;"  alt="SuperHuangXu"/><br/><sub><b>bUBBLE</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=SuperHuangXu" title="SuperHuangXu" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/Pylogmon" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/59004461" width="64px;"  alt="Pylogmon"/><br/><sub><b>派了个萌 </b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=Pylogmon" title="Pylogmon" >🔧 🐛</a>
+  </td>
+  
+  <td align="center">
+    <a href="https://github.com/SkysCrystal" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/49473463" width="64px;"  alt="SkysCrystal"/><br/><sub><b>Simon Shi</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=SkysCrystal" title="SkysCrystal" >🔧 🐛</a>
+  </td>
+  
+  <td align="center">
+    <a href="https://github.com/siygle" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/173408" width="64px;"  alt="S.Y. Lee"/><br/><sub><b>S.Y. Lee</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=siygle" title="siygle" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/fighting-bug" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/56441589" width="64px;"  alt="fighting-buf"/><br/><sub><b>fighting-buf</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=fighting-bug" title="fighting-buf" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/cliouo" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/71540889" width="64px;"  alt="cliouo"/><br/><sub><b>cliouo</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=cliouo" title="cliouo" >🔧 🐛</a>
+  </td>
+  
+  <td align="center">
+    <a href="https://github.com/sudeakq" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/102792219" width="64px;"  alt="Sude Akgün"/><br/><sub><b>Sude Akgün</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=sudeakq" title="sudeakq" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/fgprodigal" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/769910" width="64px;"  alt="Ray"/><br/><sub><b>Ray</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=fgprodigal" title="Ray" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/hongzzz" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/25585061" width="64px;"  alt="Hongzzz"/><br/><sub><b>Hongzzz</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=hongzzz" title="hongzzz" >🔧 🐛</a>
+  </td>
+
+  <td align="center">
+    <a href="https://github.com/RedhairHambagu" style="display:inline-block;width:80px"><img src="https://avatars.githubusercontent.com/u/129669334" width="64px;"  alt="RedhairHambagu"/><br/><sub><b>RedhairHambagu</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=RedhairHambagu" title="RedhairHambagu" >🔧 🐛</a>
+  </td>
+
+</tr>
+</table>
+
+
+## Technologies Used
+
+- **Technical Framework**: [Next.js](https://nextjs.org)
+- **Styles**: [Tailwind CSS](https://www.tailwindcss.cn/)
+- **Rendering Tool**: [React-notion-x](https://github.com/NotionX/react-notion-x)
+- **COMMENT**: [Twikoo](https://github.com/imaegoo/twikoo), [Giscus](https://giscus.app/zh-CN), [Gitalk](https://gitalk.github.io), [Cusdis](https://cusdis.com), [Utterances](https://utteranc.es)
+- **ICON**: [Fontawesome](https://fontawesome.com/v6/icons/)
+
+
+## License
+
+The MIT License.
--- a/blog.config.js
+++ b/blog.config.js
@@ -65,7 +65,7 @@ const BLOG = {
    '"Segoe UI Symbol"',
    '"Apple Color Emoji"'
  ],
-  FONT_AWESOME: '/css/all.min.css', // font-awesome 字体图标地址
+  FONT_AWESOME: process.env.NEXT_PUBLIC_FONT_AWESOME_PATH || '/css/all.min.css', // font-awesome 字体图标地址、默认读取本地; 可选 https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/font-awesome/6.0.0/css/all.min.css

  // 自定义外部脚本，外部样式
  CUSTOM_EXTERNAL_JS: [''], // e.g. ['http://xx.com/script.js','http://xx.com/script.js']
@@ -95,6 +95,10 @@ const BLOG = {
  BACKGROUND_DARK: '#000000', // use hex value, don't forget '#'
  SUB_PATH: '', // leave this empty unless you want to deploy in a folder

+  POST_SHARE_BAR_ENABLE: process.env.NEXT_PUBLIC_POST_SHARE_BAR || 'true', // 文章分享功能 ，将在底部显示一个分享条
+  POSTS_SHARE_SERVICES: process.env.NEXT_PUBLIC_POST_SHARE_SERVICES || 'link,wechat,qq,weibo,email,facebook,twitter,telegram,messenger,line,reddit,whatsapp,linkedin', // 分享的服務，按顺序显示,逗号隔开
+  // 所有支持的分享服务：link(复制链接),wechat(微信),qq,weibo(微博),email(邮件),facebook,twitter,telegram,messenger,line,reddit,whatsapp,linkedin,vkshare,okshare,tumblr,livejournal,mailru,viber,workplace,pocket,instapaper,hatena
+
  POST_URL_PREFIX: process.env.NEXT_PUBLIC_POST_URL_PREFIX || 'article',
  // POST类型文章的默认路径前缀，例如默认POST类型的路径是  /article/[slug]
  // 如果此项配置为 '' 空， 则文章将没有前缀路径，使用场景： 希望文章前缀路径为 /post 的情况 支持多级
--- a/components/ShareBar.js
+++ b/components/ShareBar.js
@@ -0,0 +1,29 @@
+import BLOG from '@/blog.config'
+import { useRouter } from 'next/router'
+import React from 'react'
+import ShareButtons from './ShareButtons'
+
+const ShareBar = ({ post }) => {
+  const router = useRouter()
+
+  if (!JSON.parse(BLOG.POST_SHARE_BAR_ENABLE) || !post || post?.type !== 'Post') {
+    return <></>
+  }
+
+  const shareUrl = BLOG.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 +
+            ' ' +
+            shareUrl +
+            ' ' +
+            post.summary
+        } />
+        </div>
+    </div>
+}
+export default ShareBar
--- a/components/ShareButtons.js
+++ b/components/ShareButtons.js
@@ -0,0 +1,372 @@
+import BLOG from '@/blog.config'
+import { useGlobal } from '@/lib/global'
+import copy from 'copy-to-clipboard'
+import QRCode from 'qrcode.react'
+import { useState } from 'react'
+
+import {
+  FacebookShareButton,
+  FacebookIcon,
+  FacebookMessengerShareButton,
+  FacebookMessengerIcon,
+  RedditShareButton,
+  RedditIcon,
+  LineShareButton,
+  LineIcon,
+  EmailShareButton,
+  EmailIcon,
+  TwitterShareButton,
+  TwitterIcon,
+  TelegramShareButton,
+  TelegramIcon,
+  WhatsappShareButton,
+  WhatsappIcon,
+  LinkedinShareButton,
+  LinkedinIcon,
+  PinterestShareButton,
+  PinterestIcon,
+  VKIcon,
+  VKShareButton,
+  OKShareButton,
+  OKIcon,
+  TumblrShareButton,
+  TumblrIcon,
+  LivejournalIcon,
+  LivejournalShareButton,
+  MailruShareButton,
+  MailruIcon,
+  ViberIcon,
+  ViberShareButton,
+  WorkplaceShareButton,
+  WorkplaceIcon,
+  WeiboShareButton,
+  WeiboIcon,
+  PocketShareButton,
+  PocketIcon,
+  InstapaperShareButton,
+  InstapaperIcon,
+  HatenaShareButton,
+  HatenaIcon
+} from 'react-share'
+
+/**
+ * @author https://github.com/txs
+ * @param {*} param0
+ * @returns
+ */
+const ShareButtons = ({ shareUrl, title, body, image }) => {
+  const services = BLOG.POSTS_SHARE_SERVICES.split(',')
+  const titleWithSiteInfo = title + ' | ' + BLOG.TITLE
+  const { locale } = useGlobal()
+  const [qrCodeShow, setQrCodeShow] = useState(false)
+
+  const copyUrl = () => {
+    copy(shareUrl)
+    alert(locale.COMMON.URL_COPIED)
+  }
+
+  const openPopover = () => {
+    setQrCodeShow(true)
+  }
+  const closePopover = () => {
+    setQrCodeShow(false)
+  }
+
+  return (
+        <>
+            {services.map(singleService => {
+              if (singleService === 'facebook') {
+                return (
+                        <FacebookShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            className="mx-1"
+                        >
+                            <FacebookIcon size={32} round />
+                        </FacebookShareButton>
+                )
+              }
+              if (singleService === 'messenger') {
+                return (
+                        <FacebookMessengerShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            appId={BLOG.FACEBOOK_APP_ID}
+                            className="mx-1"
+                        >
+                            <FacebookMessengerIcon size={32} round />
+                        </FacebookMessengerShareButton>
+                )
+              }
+              if (singleService === 'line') {
+                return (
+                        <LineShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            className="mx-1"
+                        >
+                            <LineIcon size={32} round />
+                        </LineShareButton>
+                )
+              }
+              if (singleService === 'reddit') {
+                return (
+                        <RedditShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            windowWidth={660}
+                            windowHeight={460}
+                            className="mx-1"
+                        >
+                            <RedditIcon size={32} round />
+                        </RedditShareButton>
+                )
+              }
+              if (singleService === 'email') {
+                return (
+                        <EmailShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            subject={titleWithSiteInfo}
+                            body={body}
+                            className="mx-1"
+                        >
+                            <EmailIcon size={32} round />
+                        </EmailShareButton>
+                )
+              }
+              if (singleService === 'twitter') {
+                return (
+                        <TwitterShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <TwitterIcon size={32} round />
+                        </TwitterShareButton>
+                )
+              }
+              if (singleService === 'telegram') {
+                return (
+                        <TelegramShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <TelegramIcon size={32} round />
+                        </TelegramShareButton>
+                )
+              }
+              if (singleService === 'whatsapp') {
+                return (
+                        <WhatsappShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            separator=":: "
+                            className="mx-1"
+                        >
+                            <WhatsappIcon size={32} round />
+                        </WhatsappShareButton>
+                )
+              }
+              if (singleService === 'linkedin') {
+                return (
+                        <LinkedinShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            className="mx-1"
+                        >
+                            <LinkedinIcon size={32} round />
+                        </LinkedinShareButton>
+                )
+              }
+              if (singleService === 'pinterest') {
+                return (
+                        <PinterestShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            media={image}
+                            className="mx-1"
+                        >
+                            <PinterestIcon size={32} round />
+                        </PinterestShareButton>
+                )
+              }
+              if (singleService === 'vkshare') {
+                return (
+                        <VKShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            image={image}
+                            className="mx-1"
+                        >
+                            <VKIcon size={32} round />
+                        </VKShareButton>
+                )
+              }
+              if (singleService === 'okshare') {
+                return (
+                        <OKShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            image={image}
+                            className="mx-1"
+                        >
+                            <OKIcon size={32} round />
+                        </OKShareButton>
+                )
+              }
+              if (singleService === 'tumblr') {
+                return (
+                        <TumblrShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <TumblrIcon size={32} round />
+                        </TumblrShareButton>
+                )
+              }
+              if (singleService === 'livejournal') {
+                return (
+                        <LivejournalShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            description={shareUrl}
+                            className="mx-1"
+                        >
+                            <LivejournalIcon size={32} round />
+                        </LivejournalShareButton>
+                )
+              }
+              if (singleService === 'mailru') {
+                return (
+                        <MailruShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <MailruIcon size={32} round />
+                        </MailruShareButton>
+                )
+              }
+              if (singleService === 'viber') {
+                return (
+                        <ViberShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <ViberIcon size={32} round />
+                        </ViberShareButton>
+                )
+              }
+              if (singleService === 'workplace') {
+                return (
+                        <WorkplaceShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            quote={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <WorkplaceIcon size={32} round />
+                        </WorkplaceShareButton>
+                )
+              }
+              if (singleService === 'weibo') {
+                return (
+                        <WeiboShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            image={image}
+                            className="mx-1"
+                        >
+                            <WeiboIcon size={32} round />
+                        </WeiboShareButton>
+                )
+              }
+              if (singleService === 'pocket') {
+                return (
+                        <PocketShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <PocketIcon size={32} round />
+                        </PocketShareButton>
+                )
+              }
+              if (singleService === 'instapaper') {
+                return (
+                        <InstapaperShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            className="mx-1"
+                        >
+                            <InstapaperIcon size={32} round />
+                        </InstapaperShareButton>
+                )
+              }
+              if (singleService === 'hatena') {
+                return (
+                        <HatenaShareButton
+                            key={singleService}
+                            url={shareUrl}
+                            title={titleWithSiteInfo}
+                            windowWidth={660}
+                            windowHeight={460}
+                            className="mx-1"
+                        >
+                            <HatenaIcon size={32} round />
+                        </HatenaShareButton>
+                )
+              }
+              if (singleService === 'qq') {
+                return <button key={singleService} className='cursor-pointer bg-blue-600 text-white rounded-full mx-1'>
+                        <div target='_blank' rel='noreferrer' href={`http://connect.qq.com/widget/shareqq/index.html?url=${shareUrl}&sharesource=qzone&title=${title}&desc=${body}`} >
+                            <i className='fab fa-qq w-8' />
+                        </div>
+                    </button>
+              }
+              if (singleService === 'wechat') {
+                return <button onMouseEnter={openPopover} onMouseLeave={closePopover} aria-label={singleService} key={singleService} className='cursor-pointer bg-green-600 text-white rounded-full mx-1'>
+                        <div id='wechat-button'>
+                            <i className='fab fa-weixin w-8' />
+                        </div>
+                        <div className='absolute'>
+                        <div id='pop' className={(qrCodeShow ? 'opacity-100 ' : ' invisible opacity-0') + ' z-40 absolute bottom-10 -left-10 bg-white shadow-xl transition-all duration-200 text-center'}>
+                                <div className='p-2 mt-1'>
+                                    <QRCode value={shareUrl} fgColor='#000000' />
+                                </div>
+                                <span className='text-black font-semibold p-1 rounded-t-lg text-sm mx-auto mb-1'>
+                                    {locale.COMMON.SCAN_QR_CODE}
+                                </span>
+                        </div>
+                        </div>
+                    </button>
+              }
+              if (singleService === 'link') {
+                return <button aria-label={singleService} key={singleService} className='cursor-pointer bg-yellow-500 text-white rounded-full mx-1'>
+                        <div alt={locale.COMMON.URL_COPIED} onClick={copyUrl} >
+                            <i className='fas fa-link w-8' />
+                        </div>
+                    </button>
+              }
+              return <></>
+            })}
+        </>
+  )
+}
+
+export default ShareButtons
--- a/lib/lang/zh-CN.js
+++ b/lib/lang/zh-CN.js
@@ -17,7 +17,7 @@ export default {
    NO_TAG: 'NoTag',
    CATEGORY: '分类',
    SHARE: '分享',
-    SCAN_QR_CODE: '扫一扫二维码',
+    SCAN_QR_CODE: '微信扫码分享',
    URL_COPIED: '链接已复制！',
    TABLE_OF_CONTENTS: '目录',
    RELATE_POSTS: '相关文章',
--- a/lib/notion/getNotionData.js
+++ b/lib/notion/getNotionData.js
@@ -65,10 +65,10 @@ export async function getNotionPageData({ pageId, from }) {
  const cacheKey = 'page_block_' + pageId
  const data = await getDataFromCache(cacheKey)
  if (data && data.pageIds?.length > 0) {
-    console.log('[命中缓存]:', `from:${from}`, `root-page-id:${pageId}`)
+    console.log('[缓存]:', `from:${from}`, `root-page-id:${pageId}`)
    return data
  }
-  const pageRecordMap = await getPageRecordMapByNotionAPI({ pageId, from })
+  const pageRecordMap = await getDataBaseInfoByNotionAPI({ pageId, from })
  // 存入缓存
  if (pageRecordMap) {
    await setDataToCache(cacheKey, pageRecordMap)
@@ -177,24 +177,44 @@ async function getNotice(post) {
 * 调用NotionAPI获取Page数据
 * @returns {Promise<JSX.Element|null|*>}
 */
-async function getPageRecordMapByNotionAPI({ pageId, from }) {
+async function getDataBaseInfoByNotionAPI({ pageId, from }) {
  const pageRecordMap = await getPostBlocks(pageId, from)
  if (!pageRecordMap) {
-    return []
+    console.error('can`t get Notion Data ; Which id is: ', pageId)
+    return {}
  }
  pageId = idToUuid(pageId)
-  const block = pageRecordMap.block
+  const block = pageRecordMap.block || {}
  const rawMetadata = block[pageId]?.value
  // Check Type Page-Database和Inline-Database
  if (
-    rawMetadata?.type !== 'collection_view_page' &&
-        rawMetadata?.type !== 'collection_view'
+    rawMetadata?.type !== 'collection_view_page' && rawMetadata?.type !== 'collection_view'
  ) {
-    console.warn(`pageId "${pageId}" is not a database`)
-    return null
+    console.error(`pageId "${pageId}" is not a database`)
+    return {
+      notice: null,
+      siteInfo: getBlogInfo({}),
+      allPages: [{ id: 1, title: `无法获取Notion数据，请检查Notion_ID： \n 当前 ${pageId}`, summary: '访问文档获取帮助→ https://tangly1024.com/article/vercel-deploy-notion-next', status: 'Published', type: 'Post', slug: '13a171332816461db29d50e9f575b00d', date: { start_date: '2023-04-24', lastEditedTime: '2023-04-24', tagItems: [] } }],
+      collection: [],
+      collectionQuery: {},
+      collectionId: null,
+      collectionView: {},
+      viewIds: [],
+      block: {},
+      schema: {},
+      tagOptions: [],
+      categoryOptions: [],
+      rawMetadata: {},
+      customNav: [],
+      customMenu: [],
+      postCount: 1,
+      pageIds: [],
+      latestPosts: []
+    }
  }

-  const collection = Object.values(pageRecordMap.collection)[0]?.value
+  const collection = Object.values(pageRecordMap.collection)[0]?.value || {}
+  const siteInfo = getBlogInfo({ collection, block })
  const collectionId = rawMetadata?.collection_id
  const collectionQuery = pageRecordMap.collection_query
  const collectionView = pageRecordMap.collection_view
@@ -222,7 +242,7 @@ async function getPageRecordMapByNotionAPI({ pageId, from }) {
  let postCount = 0
  // 查找所有的Post和Page
  const allPages = collectionData.filter(post => {
-    if (post.type === BLOG.NOTION_PROPERTY_NAME.type_post && post.status === BLOG.NOTION_PROPERTY_NAME.status_publish) {
+    if (post.type === 'Post' && post.status === 'Published') {
      postCount++
    }
    return post && post?.slug &&
@@ -242,7 +262,6 @@ async function getPageRecordMapByNotionAPI({ pageId, from }) {
  const notice = await getNotice(collectionData.filter(post => { return post && post?.type && post?.type === 'Notice' && post.status === 'Published' })?.[0])
  const categoryOptions = getAllCategories({ allPages, categoryOptions: getCategoryOptions(schema) })
  const tagOptions = getAllTags({ allPages, tagOptions: getTagOptions(schema) })
-  const siteInfo = getBlogInfo({ collection, block })
  const customNav = getCustomNav({ allPages: collectionData.filter(post => post.type === 'Page' && post.status === 'Published') })
  // 新的菜单
  const customMenu = await getCustomMenu({ collectionData })
--- a/lib/notion/getPostBlocks.js
+++ b/lib/notion/getPostBlocks.js
@@ -14,7 +14,7 @@ export async function getPostBlocks(id, from, slice) {
  const cacheKey = 'page_block_' + id
  let pageBlock = await getDataFromCache(cacheKey)
  if (pageBlock) {
-    console.log('[命中缓存]:', `from:${from}`, cacheKey)
+    console.log('[缓存]:', `from:${from}`, cacheKey)
    return filterPostBlocks(id, pageBlock, slice)
  }

--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "notion-next",
-  "version": "3.13.4",
+  "version": "3.13.5",
  "homepage": "https://github.com/tangly1024/NotionNext.git",
  "license": "MIT",
  "repository": {
@@ -22,7 +22,6 @@
  "dependencies": {
    "@giscus/react": "^2.2.6",
    "@next/bundle-analyzer": "^12.1.1",
-    "@popperjs/core": "^2.9.3",
    "@vercel/analytics": "^1.0.0",
    "animate.css": "^4.1.1",
    "animejs": "^3.2.1",
@@ -39,7 +38,7 @@
    "memory-cache": "^0.2.0",
    "mermaid": "9.2.2",
    "mongodb": "^4.6.0",
-    "next": "^13.1.1",
+    "next": "13.3.1",
    "notion-client": "6.15.6",
    "notion-utils": "6.15.6",
    "nprogress": "^0.2.0",
@@ -53,7 +52,7 @@
    "react-facebook": "^8.1.4",
    "react-messenger-customer-chat": "^0.8.0",
    "react-notion-x": "6.16.0",
-    "react-share": "^4.4.0",
+    "react-share": "^4.4.1",
    "react-tweet-embed": "~2.0.0",
    "smoothscroll-polyfill": "^0.4.4",
    "twikoo": "^1.6.16",
--- a/pages/[...slug].js
+++ b/pages/[...slug].js
@@ -31,7 +31,7 @@ const Slug = props => {
      setLock(true)
    } else {
      if (!lock && post?.blockMap?.block) {
-        post.content = Object.keys(post.blockMap.block)
+        post.content = Object.keys(post.blockMap.block).filter(key => post.blockMap.block[key]?.value.parent_id === post.id)
        post.toc = getPageTableOfContents(post, post.blockMap)
      }

--- a/themes/example/LayoutSlug.js
+++ b/themes/example/LayoutSlug.js
@@ -3,6 +3,7 @@ import { ArticleLock } from './components/ArticleLock'
 import NotionPage from '@/components/NotionPage'
 import { ArticleInfo } from './components/ArticleInfo'
 import Comment from '@/components/Comment'
+import ShareBar from '@/components/ShareBar'

 export const LayoutSlug = props => {
  const { post, lock, validPassword } = props
@@ -17,10 +18,10 @@ export const LayoutSlug = props => {
                {lock && <ArticleLock validPassword={validPassword} />}

                {!lock && <div id="notion-article" className="px-2">
-
                    {post && <>
                        <ArticleInfo post={post} />
                        <NotionPage post={post} />
+                        <ShareBar post={post} />
                        <Comment frontMatter={post}/>
                    </>}
                </div>}
--- a/themes/fukasawa/components/ArticleDetail.js
+++ b/themes/fukasawa/components/ArticleDetail.js
@@ -1,5 +1,6 @@
 import Comment from '@/components/Comment'
 import NotionPage from '@/components/NotionPage'
+import ShareBar from '@/components/ShareBar'
 import formatDate from '@/lib/formatDate'
 import { useGlobal } from '@/lib/global'
 import Link from 'next/link'
@@ -84,6 +85,11 @@ export default function ArticleDetail(props) {
          {post && <NotionPage post={post} />}
        </section>

+        <section>
+           {/* 分享 */}
+           <ShareBar post={post} />
+        </section>
+
        <section className="px-1 py-2 my-1 text-sm font-light overflow-auto text-gray-600  dark:text-gray-400">
          {/* 文章内嵌广告 */}
          <ins className="adsbygoogle"
--- a/themes/hexo/LayoutSlug.js
+++ b/themes/hexo/LayoutSlug.js
@@ -11,6 +11,7 @@ import ArticleAdjacent from './components/ArticleAdjacent'
 import ArticleCopyright from './components/ArticleCopyright'
 import ArticleRecommend from './components/ArticleRecommend'
 import { isBrowser } from '@/lib/utils'
+import ShareBar from '@/components/ShareBar'

 export const LayoutSlug = props => {
  const { post, lock, validPassword } = props
@@ -68,6 +69,8 @@ export const LayoutSlug = props => {
                data-ad-slot="3806269138" />
            </section>

+            {/* 分享 */}
+            <ShareBar post={post} />
            {post.type === 'Post' && <ArticleCopyright {...props} /> }
            {post.type === 'Post' && <ArticleRecommend {...props} /> }
            {post.type === 'Post' && <ArticleAdjacent {...props} /> }
--- a/themes/hexo/components/BlogPostCardInfo.js
+++ b/themes/hexo/components/BlogPostCardInfo.js
@@ -78,7 +78,7 @@ export const BlogPostCardInfo = ({ post, showPreview, showPageCover, showSummary
            <div className="md:flex-nowrap flex-wrap md:justify-start inline-block">
                <div>
                    {' '}
-                    {post.tagItems.map(tag => (
+                    {post.tagItems?.map(tag => (
                        <TagItemMini key={tag.name} tag={tag} />
                    ))}
                </div>
--- a/themes/matery/LayoutSlug.js
+++ b/themes/matery/LayoutSlug.js
@@ -10,6 +10,7 @@ import { ArticleInfo } from './components/ArticleInfo'
 import Catalog from './components/Catalog'
 import JumpToCommentButton from './components/JumpToCommentButton'
 import throttle from 'lodash.throttle'
+import ShareBar from '@/components/ShareBar'

 export const LayoutSlug = props => {
  const { post, lock, validPassword } = props
@@ -80,7 +81,8 @@ export const LayoutSlug = props => {
                                        data-ad-client="ca-pub-2708419466378217"
                                        data-ad-slot="3806269138" />
                                </section>
-
+                                {/* 分享 */}
+                                <ShareBar post={post} />
                                {/* 文章版权说明 */}
                                {post.type === 'Post' && <ArticleCopyright {...props} />}

--- a/themes/medium/LayoutSlug.js
+++ b/themes/medium/LayoutSlug.js
@@ -13,6 +13,7 @@ import ArticleAround from './components/ArticleAround'
 import TocDrawer from './components/TocDrawer'
 import CategoryItem from './components/CategoryItem'
 import TagItemMini from './components/TagItemMini'
+import ShareBar from '@/components/ShareBar'

 export const LayoutSlug = props => {
  const { post, prev, next, siteInfo, lock, validPassword } = props
@@ -85,12 +86,17 @@ export const LayoutSlug = props => {
                </section>

                <section>
+
+                    {/* 分享 */}
+                    <ShareBar post={post} />
+                    {/* 文章分类和标签信息 */}
                    <div className='flex justify-between'>
                        {CONFIG_MEDIUM.POST_DETAIL_CATEGORY && post.category && <CategoryItem category={post.category} />}
                        <div>
                            {CONFIG_MEDIUM.POST_DETAIL_TAG && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
                        </div>
                    </div>
+
                    {post.type === 'Post' && <ArticleAround prev={prev} next={next} />}
                    <Comment frontMatter={post} />
                </section>
--- a/themes/next/components/ArticleDetail.js
+++ b/themes/next/components/ArticleDetail.js
@@ -2,7 +2,7 @@ import BLOG from '@/blog.config'
 import BlogAround from './BlogAround'
 import Comment from '@/components/Comment'
 import RecommendPosts from './RecommendPosts'
-import ShareBar from './ShareBar'
+import ShareBar from '@/components/ShareBar'
 import TagItem from './TagItem'
 import formatDate from '@/lib/formatDate'
 import { useGlobal } from '@/lib/global'
@@ -94,6 +94,10 @@ export default function ArticleDetail(props) {
                </section>

                {showArticleInfo && <>
+
+                    {/* 分享 */}
+                    <ShareBar post={post} />
+
                    {/* 版权声明 */}
                    {post.type === 'Post' && <ArticleCopyright author={BLOG.AUTHOR} url={url} />}

@@ -124,7 +128,6 @@ export default function ArticleDetail(props) {
                                        ))}
                                    </div>
                                )}
-                                <ShareBar post={post} />
                            </>
                        )}
                    </section>
--- a/themes/next/components/BlogPostCard.js
+++ b/themes/next/components/BlogPostCard.js
@@ -60,7 +60,7 @@ const BlogPostCard = ({ post, showSummary }) => {
            <div className="md:flex-nowrap flex-wrap md:justify-start inline-block">
              <div>
                {' '}
-                {post.tagItems.map(tag => (
+                {post.tagItems?.map(tag => (
                  <TagItemMini key={tag.name} tag={tag} />
                ))}
              </div>
--- a/themes/next/components/ShareBar.js
+++ b/themes/next/components/ShareBar.js
@@ -1,88 +0,0 @@
-import BLOG from '@/blog.config'
-import { useRouter } from 'next/router'
-import React from 'react'
-import { createPopper } from '@popperjs/core'
-import copy from 'copy-to-clipboard'
-import QRCode from 'qrcode.react'
-import { useGlobal } from '@/lib/global'
-import CONFIG_NEXT from '../config_next'
-
-const ShareBar = ({ post }) => {
-  const router = useRouter()
-  const [qrCodeShow, setQrCodeShow] = React.useState(false)
-  const { locale } = useGlobal()
-  if (!CONFIG_NEXT.ARTICLE_SHARE) {
-    return <></>
-  }
-  const shareUrl = BLOG.LINK + router.asPath
-
-  // 二维码悬浮
-  const btnRef = React.createRef()
-  const popoverRef = React.createRef()
-
-  const openPopover = () => {
-    createPopper(btnRef.current, popoverRef.current, {
-      placement: 'top'
-    })
-    setQrCodeShow(true)
-  }
-  const closePopover = () => {
-    setQrCodeShow(false)
-  }
-
-  const copyUrl = () => {
-    copy(shareUrl)
-    alert(locale.COMMON.URL_COPIED)
-  }
-
-  return <>
-    <div
-      className='py-2 text-gray-500 text-center space-x-2 flex my-1 dark:text-gray-200 overflow-visible'>
-      <div className='hidden md:block text-gray-800 dark:text-gray-300 mr-2 my-2 whitespace-nowrap'>{locale.COMMON.SHARE}:</div>
-      <div className='text-3xl cursor-pointer'>
-        <a className='text-blue-700' href={`https://www.facebook.com/sharer.php?u=${shareUrl}`} >
-          <i className='fab fa-facebook-square'/>
-        </a>
-      </div>
-      <div className='text-3xl cursor-pointer'>
-        <a className='text-blue-400' target='_blank' rel='noreferrer' href={`https://twitter.com/intent/tweet?title=${post.title}&url${shareUrl}`} >
-          <i className='fab fa-twitter-square'/>
-        </a>
-      </div>
-      <div className='text-3xl cursor-pointer'>
-        <a className='text-blue-500' href={`https://telegram.me/share/url?url=${shareUrl}&text=${post.title}`} >
-        <i className='fab fa-telegram'/>
-        </a>
-      </div>
-      <div className='cursor-pointer text-2xl'>
-        <a className='text-green-600' ref={btnRef} onMouseEnter={openPopover} onMouseLeave={closePopover}>
-          <i className='fab fa-weixin'/>
-          <div ref={popoverRef} className={(qrCodeShow ? 'opacity-100 ' : 'invisible opacity-0') + ' transition-all duration-200 text-center py-2'}>
-            <div className='p-2 bg-white border-0 duration-200 transform block z-40 font-normal shadow-xl mr-10'>
-              <QRCode value={shareUrl} fgColor='#000000' />
-            </div>
-            <span className='bg-white text-black font-semibold p-1 mb-0 rounded-t-lg text-sm mx-auto mr-10'>
-            {locale.COMMON.SCAN_QR_CODE}
-            </span>
-          </div>
-        </a>
-      </div>
-      <div className='cursor-pointer text-2xl'>
-        <a className='text-red-600' target='_blank' rel='noreferrer' href={`https://service.weibo.com/share/share.php?url=${shareUrl}&title=${post.title}`} >
-          <i className='fab fa-weibo'/>
-        </a>
-      </div>
-      <div className='cursor-pointer text-2xl'>
-        <a className='text-blue-400' target='_blank' rel='noreferrer' href={`http://connect.qq.com/widget/shareqq/index.html?url=${shareUrl}&sharesource=qzone&title=${post.title}&desc=${post.summary}`} >
-          <i className='fab fa-qq'/>
-        </a>
-      </div>
-      <div className='cursor-pointer text-2xl'>
-        <a className='text-yellow-600' onClick={copyUrl} >
-          <i className='fas fa-link'/>
-        </a>
-      </div>
-    </div>
-  </>
-}
-export default ShareBar
--- a/themes/next/components/ShareButton.js
+++ b/themes/next/components/ShareButton.js
@@ -1,34 +0,0 @@
-import React from 'react'
-import ShareBar from './ShareBar'
-
-/**
- * 悬浮在屏幕右下角,分享按钮
- * @returns {JSX.Element}
- * @constructor
- */
-const ShareButton = ({ post }) => {
-  const [popoverShow, setPopoverShow] = React.useState(false)
-  const btnRef = React.createRef()
-
-  const openPopover = () => {
-    setPopoverShow(true)
-  }
-  const closePopover = () => {
-    setPopoverShow(false)
-  }
-  return (
-    <div className='my-2'
-         onMouseEnter={() => { openPopover() }}
-         onMouseLeave={() => { closePopover() }}>
-        <div className={(popoverShow ? 'opacity-100' : 'opacity-0') + ' duration-200 ease-in-out font-normal'}>
-          <ShareBar post={post}/>
-        </div>
-        <div ref={btnRef}
-          className='z-20 border dark:border-gray-500 dark:bg-gray-600 bg-white cursor-pointer text-md hover:shadow-2xl shadow-lg'>
-          <i className='fas fa-share-alt-square transform duration-200 hover:scale-150 dark:text-gray-200 p-4' title='share' />
-        </div>
-    </div>
-  )
-}
-
-export default ShareButton
--- a/themes/next/config_next.js
+++ b/themes/next/config_next.js
@@ -30,7 +30,6 @@ const CONFIG_NEXT = {
  WIDGET_DARK_MODE: false, // 显示日间/夜间模式切换
  WIDGET_TOC: true, // 移动端显示悬浮目录

-  ARTICLE_SHARE: process.env.NEXT_PUBLIC_ARTICLE_SHARE || false, // 文章分享功能
  ARTICLE_RELATE_POSTS: true, // 相关文章推荐
  ARTICLE_COPYRIGHT: true // 文章版权声明

--- a/themes/nobelium/LayoutSlug.js
+++ b/themes/nobelium/LayoutSlug.js
@@ -4,6 +4,7 @@ import NotionPage from '@/components/NotionPage'
 import { ArticleInfo } from './components/ArticleInfo'
 import Comment from '@/components/Comment'
 import { ArticleFooter } from './components/ArticleFooter'
+import ShareBar from '@/components/ShareBar'

 export const LayoutSlug = props => {
  const { post, lock, validPassword } = props
@@ -21,6 +22,7 @@ export const LayoutSlug = props => {
                    {post && <>
                        <ArticleInfo post={post} />
                        <NotionPage post={post} />
+                        <ShareBar post={post} />
                        <Comment frontMatter={post}/>
                        <ArticleFooter />
                    </>}
--- a/themes/simple/LayoutSlug.js
+++ b/themes/simple/LayoutSlug.js
@@ -4,6 +4,7 @@ import NotionPage from '@/components/NotionPage'
 import { ArticleInfo } from './components/ArticleInfo'
 import Comment from '@/components/Comment'
 import ArticleAround from './components/ArticleAround'
+import ShareBar from '@/components/ShareBar'

 export const LayoutSlug = props => {
  const { post, lock, validPassword, prev, next } = props
@@ -22,6 +23,8 @@ export const LayoutSlug = props => {
                    {post && <>
                        <ArticleInfo post={post} />
                        <NotionPage post={post} />
+                        {/* 分享 */}
+                        <ShareBar post={post} />
                        {post.type === 'Post' && <ArticleAround prev={prev} next={next} />}
                        <Comment frontMatter={post}/>
                    </>}