原文鏈接：基于 Hexo 鍵入分享功能

創(chuàng)新互聯(lián)公司是一家專業(yè)提供雙陽(yáng)企業(yè)網(wǎng)站建設(shè),專注與成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作、H5頁(yè)面制作、小程序制作等業(yè)務(wù)。10年已為雙陽(yáng)眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)的建站公司優(yōu)惠進(jìn)行中。

前言

本站基于Hexo搭建，用的 ???? hexo-theme-butterfly 主題 v3.7.1，請(qǐng)注意最新的???? hexo-theme-butterfly 版本已經(jīng)更新到 v4.2.2 。

如果你是 v3.7.1 之外的版本，可能有些地方會(huì)有出入，請(qǐng)留意。

注意：我的博客根目錄路徑為 【G:/hexo-blog/blog-demo】，下文所說(shuō)的根目錄都是此路徑，將用[BlogRoot]代替。如果不清楚根目錄路徑，請(qǐng)回到教程 基于 Hexo 從零開(kāi)始搭建個(gè)人博客（二），查看你執(zhí)行hexo init xxx這條命令時(shí)所選擇的路徑，例如我選擇的路徑是【G:/hexo-blog】，我的博客根目錄即為【G:/hexo-blog/xxx】。

修改站點(diǎn)配置文件_config.yml，路徑為【BlogRoot/_config.yml】。

修改主題配置文件_config.butterfly.yml，路徑為【BlogRoot/_config.butterfly.yml】。

推薦閱讀

• 基于 Hexo 從零開(kāi)始搭建個(gè)人博客（一）
• 基于 Hexo 從零開(kāi)始搭建個(gè)人博客（二）
• 基于 Hexo 從零開(kāi)始搭建個(gè)人博客（三）
• 基于 Hexo 從零開(kāi)始搭建個(gè)人博客（四）
• 基于 Hexo 從零開(kāi)始搭建個(gè)人博客（五）
• 基于 Hexo 從零開(kāi)始搭建個(gè)人博客（六）
• 基于 Hexo 鍵入搜索功能
• 基于 Hexo 鍵入在線聊天功能
• Hexo + Butterfly 自定義右鍵菜單

注意：主題集成了三種分享功能，分別是AddThis、Sharejs、Addtoany，只能從其中選擇一個(gè)分享服務(wù)商。

AddThis

1. 前往AddThis 官網(wǎng)注冊(cè)賬號(hào)，輸入下圖中信息即可。
   

2. 配置 WEBSITE TOOLS。
   首先首先選擇Share Buttons。
   
   其次選擇分享模型：Floating、Inline、Expanding、Image Sharing、Popup、Banner、Slider。每種模型的效果如下：
   Floating
   
   Inline
   
   Expanding
   
   Image Sharing
   
   Popup
   
   Banner
   
   Slider
   
   點(diǎn)擊【Continue】然后對(duì)不同的模型做一些定制化的設(shè)置。例如，選擇分享平臺(tái)的個(gè)數(shù)、設(shè)置按鈕的大小，顏色，設(shè)置圖標(biāo)的顏色、模型出現(xiàn)的位置等。這里只對(duì) Floating 做出舉例，具體效果請(qǐng)看下圖：
   
   最后點(diǎn)擊 【Activate Tool】 按鈕即可。

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

4. 修改主題配置文件_config.butterfly.yml。

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

5. 重新編譯運(yùn)行，即可看到效果。
   
   

Sharejs

如果你不了解 sharejs ，可以看看它的文檔。

修改主題配置文件_config.butterfly.yml

sharejs:
  enable: true
  sites: facebook,twitter,wechat,weibo,qq  #想要顯示的內(nèi)容

Addtoany

如果你不了解 Addtoany ，可以看看它的文檔。

修改主題配置文件_config.butterfly.yml

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

效果如下：