原文連結：基于 Hexo 鍵入分享功能 | 唐志遠の部落格

前言

本站基于Hexo搭建，用的 hexo-theme-butterfly 主題 v3.7.1，請注意最新的 hexo-theme-butterfly 版本已經更新到 v4.2.2 。如果你是 v3.7.1 之外的版本，可能有些地方會有出入，請留意。

注意：我的部落格根目錄路徑為【G:/hexo-blog/blog-demo】，下文所說的根目錄都是此路徑，将用[BlogRoot]代替。如果不清楚根目錄路徑，請回到教程基于 Hexo 從零開始搭建個人部落格（二），檢視你執行hexo init xxx這條指令時所選擇的路徑，例如我選擇的路徑是【G:/hexo-blog】，我的部落格根目錄即為【G:/hexo-blog/xxx】。修改站點配置檔案_config.yml，路徑為【BlogRoot/_config.yml】。修改主題配置檔案_config.butterfly.yml，路徑為【BlogRoot/_config.butterfly.yml】。

AddThis

前往AddThis 官網新增賬號，輸入下圖中資訊即可。

配置 WEBSITE TOOLS。首先首先選擇Share Buttons。

其次選擇分享模型：Floating、Inline、Expanding、Image Sharing、Popup、Banner、Slider。每種模型的效果如下：

Floating

Inline

Expanding

Image Sharing

Popup

Banner

Slider

點選【Continue】然後對不同的模型做一些定制化的設定。例如，選擇分享平台的個數、設定按鈕的大小，顔色，設定圖示的顔色、模型出現的位置等。這裡隻對 Floating 做出舉例，具體效果請看下圖：

最後點選【Activate Tool】按鈕即可。

找到【Get The Code】-> 【Just Copy】，可以看到你的 pub-id

修改主題配置檔案_config.butterfly.yml。

addThis:
  enable: true # or false
  pubid: 你的pub-id

重新編譯運作，即可看到效果。

Sharejs

如果你不了解 sharejs(https://github.com/overtrue/share.js/) ，可以看看它的文檔。

修改主題配置檔案_config.butterfly.yml

sharejs:
  enable: true
  sites: facebook,twitter,wechat,weibo,qq  #想要顯示的内容

Addtoany

如果你不了解 AddToAny: Share Buttons by the Universal Sharing Platform，可以看看它的文檔。

修改主題配置檔案_config.butterfly.yml

addtoany:
  enable: true
  item: facebook,twitter,wechat,sina_weibo,facebook_messenger,email,copy_link

效果如下：