原文連結：http://www.cnblogs.com/fengxiongZz/p/7707568.html
主題的配置：這裡以NexT主題作為題材
1、安裝NexT，在其檔案夾中滑鼠右鍵，點選Git Base Here。輸入指令：git clone https://github.com/iissnan/hexo-theme-next themes/next
2、啟用主題，在站點目錄中（blog），打開配置檔案_config.yml，修改theme：next
3、驗證主題，端口号被占用還是得先修改端口号，然後啟動服務
如果看到如下界面，說明成功安裝了NexT主題
4、主題設定，在next主題目錄下的_config.yml檔案中将scheme設定為Pisces
5、語言設定，在站點根目錄下修改配置檔案_cofig.yml中的language為zh-Hans（簡體中文）
6、修改菜單項，在主題目錄下修改配置檔案_cofig.yml中的menu，增添一個something（注：千萬不要在這設定中文，後面的值那是查找檔案的地方！若你的站點運作在子目錄中，請将連結字首的
/
去掉）
這些配置都要與你主題目錄下的languages檔案中對應的yml文檔裡配置相關聯。比如你在站點根目錄中的配置檔案設定language為zh-Hans，那麼就要進入到主題目錄下的languages檔案中修改zh-Hans.yml，這樣才能顯示出菜單項新增的中文内容（以something為例子）
7、設定菜單項圖示，對應的字段是menu_icons。格式為item name：icon name，其中item name與所配置的菜單名字對應，icon name是Font Awesome圖示的名字。而 enable 可用于控制是否顯示圖示，你可以設定成 false 來去掉圖示。（本機出問題，無法顯示icon，還未解決，求指導）
8、設定側欄位置，修改主題目錄下sidebar的position值
9、設定頭像，在站點根目錄下載下傳配置檔案中新增avatar，值設定為頭像的連結位址。位址可以是網絡位址，也可以是本地位址（放置在source/images/ 目錄下）
10、設定文章代碼主題，在主題目錄下修改配置檔案highlight_theme，預設值為nomal。可以設定為night
11、添加标簽頁面，前面通過修改next主題下的
_config.yml
檔案中的menu選項，可以在首頁面的菜單欄添加标簽選項，但是此時點選标簽，跳轉的頁面會顯示page not found。此時我們要建立一個頁面
在建立的index.md檔案中添加type: "tags"
當要為某一篇文章添加标簽，隻需在b
log/source/_post
目錄下的具體文章的tags中添加标簽即可，如：
成功後的頁面為
11、添加關于我頁面，步驟和以上差不多
在建立的index.md檔案中添加如下内容
12、在首頁添加github導覽列，點選這裡選擇需要的樣式，然後将代碼複制到themes/next/layout/_layout.swig
并将href改為你的github位址，最終界面如圖
13、實作點選出現桃心效果，點選這裡将代碼copy到/themes/next/source/js/src裡面建立的love.js中，然後打開\themes\next\layout\_layout.swig檔案,在末尾（在前面引用會出現找不到的bug） ，引用love.js
14、修改作者頭像并旋轉，打開\themes\next\source\css\_common\components\sidebar\sidebar-author.styl，在裡面添加如下代碼：
.site-author-image {
display: block;
margin: 0 auto;
padding: $site-author-image-padding;
max-width: $site-author-image-width;
height: $site-author-image-height;
border: $site-author-image-border-width solid $site-author-image-border-color;
/* 頭像圓形 */
border-radius: 80px;
-webkit-border-radius: 80px;
-moz-border-radius: 80px;
box-shadow: inset 0 -1px 0 #333sf;
/* 設定循環動畫 [animation: (play)動畫名稱 (2s)動畫播放時長機關秒或微秒 (ase-out)動畫播放的速度曲線為以低速結束
(1s)等待1秒然後開始動畫 (1)動畫播放次數(infinite為循環播放) ]*/
/* 滑鼠經過頭像旋轉360度 */
-webkit-transition: -webkit-transform 1.0s ease-out;
-moz-transition: -moz-transform 1.0s ease-out;
transition: transform 1.0s ease-out;
}
img:hover {
/* 滑鼠經過停止頭像旋轉
-webkit-animation-play-state:paused;
animation-play-state:paused;*/
/* 滑鼠經過頭像旋轉360度 */
-webkit-transform: rotateZ(360deg);
-moz-transform: rotateZ(360deg);
transform: rotateZ(360deg);
}
/* Z 軸旋轉動畫 */
@-webkit-keyframes play {
0% {
-webkit-transform: rotateZ(0deg);
}
100% {
-webkit-transform: rotateZ(-360deg);
}
}
@-moz-keyframes play {
0% {
-moz-transform: rotateZ(0deg);
}
100% {
-moz-transform: rotateZ(-360deg);
}
}
@keyframes play {
0% {
transform: rotateZ(0deg);
}
100% {
transform: rotateZ(-360deg);
}
} 15、在網站底部加上通路量，打開\themes\next\layout\_partials\footer.swig檔案,在類copyright前加上畫紅線這話：
代碼：<script async src="https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>
然後在合适的位置添加顯示統計的代碼(位置還是上述這個檔案)，如圖：
代碼：
<div class="powered-by">
<i class="fa fa-user-md"></i><span id="busuanzi_container_site_uv">
本站訪客數:<span id="busuanzi_value_site_uv"></span>
</span>
</div> 16、修改底部的官方logo，找到
\themes\next\layout\_partials\
下面的
footer.swig
檔案，打開會發現，如下圖的語句：
第一個框 是下面側欄的“日期❤ XXX”
如果想像我一樣加東西，一定要在雙大括号外面寫。如：xxx{{config.author}},當然你要是想改徹底可以變量都删掉，看個人意願。
第二個，是圖一當中 “由Hexo驅動” 的Hexo連結，先給删掉防止跳轉，如果想跳轉當然也可以自己寫位址，至于中文一會處理。注意删除的時候格式不能錯，隻把
<a>...</a>
标簽這部分删除即可，留着兩個單引号'',否則會出錯哦。
第三個框也是最後一個了，這個就是更改圖一後半部分“主題-Next.XX”,這個比較爽直接将
<a>..</a>
都删掉，同樣中文“主題”一會處理，删掉之後在上一行 ‘-’後面可以随意加上你想顯示的東西，不要顯示敏感資訊喲，請自重。
接下來，處理剩餘的中文資訊。找到這個地方
\themes\next\languages\
下面的語言檔案zh-Hans.yml（這裡以中文為例，有的習慣用英文的配置檔案，道理一樣，找對應位置即可）
看到了吧，這個就是傳值傳過去的，你想顯示什麼就在這裡面大肆的去改動吧。其實在第二個框中，就可以把值都改掉，不用接受傳值的方式，完全自己可以重寫。不過我不建議那樣做，因為傳值這樣隻要是後續頁面需要這幾個值那麼就都會通過取值去傳過去，要是在剛才footer檔案中直接寫死，後續不一定哪個頁面需要傳值，但是值為空了或者還是原來的，可就尴尬了。是以還是這樣改動吧。