寫在前面
本文主要描述瞭如何實現hexo文章置頂功能，講述了通過修改源碼和通過更改插件兩種方式實現，以及如何添加置頂顯示。文章可能還有很多不足，請大家諒解，歡迎大佬提意見。
本文使用的東西
- win10電腦
- hexo 4.0.0
文章目錄
1.使用到的插件簡述
1.1hexo-generator-index插件
hexo-generator-index是官方默認的博客文章排序插件，在我們安裝hexo時就存在該插件了，hexo博客正常運行離不開該插件。該插件實現了按文章發表時間倒序排序，沒有實現文件置頂功能。
1.2hexo-generator-index-pin-top插件
hexo-generator-index-pin-top是一個文章置頂功能插件，在置頂之外實現文章按發表時間倒序功能，該插件用於替換hexo-generator-index插件
1.3原理
本文講述的兩種方式：
- 通過修改hexo-generator-index插件源碼的方式來實現置頂功能；
- 使用hexo-generator-index-pin-top插件直接替換hexo-generator-index插件實現置頂功能。
2.修改源碼方式
2.1優缺點
功能靈活，自己想怎麼排序就怎麼排序，但是實現稍微會麻煩一點點。
2.2功能實現
1.打開博客目錄，打開博客目錄下的“node_modules\hexo-generator-index\lib”目錄，其中的“generator.js”文件就是我們所要修改的文件。
實現該功能需要在const posts = locals.posts.sort(config.index_generator.order_by);
代碼下添加一下內容：
posts.data = posts.data.sort(function(a, b) {
if(a.top && b.top) { // 兩篇文章都有top，top大的在前
if(a.top == b.top)
return b.date - a.date; // 若top值一樣，最新的文章在前面
else
return b.top - a.top; // top大的在前面
}
else if(a.top && !b.top) { // 以下是隻有一篇文章top有定義，那麼將有top的排在前面
return -1;
}
else if(!a.top && b.top) {
return 1;
}
else return b.date - a.date; //都沒有top標籤，最新的文章在前面
});
修改後的代碼如下圖：
2.3使用
使用時只需要在文章中加入top屬性即可，top越大文章越靠前。
3. 更改插件方式
3.1優缺點
實現簡單，但是不夠靈活，如果想再自定義一點排序方式還是要去改源碼
3.2功能實現
卸載系統自帶的排序插件
npm uninstall hexo-generator-index
添加替代插件
npm install hexo-generator-index-pin-top --save
添加插件
3.3使用
使用時只需要在文章中加入top屬性即可，top越大文章越靠前。
4.添加置頂標誌
不同的主題，添加置頂方式方法各不一樣，我這裏以icarus主題爲例，添加置頂標誌，你們只要參考思路就可以了。
4.1找到需要修改的文件
1.打來博客目錄的“themes”目錄，選擇自己正在使用的主題，我這裏用的是icarus主題。
2.打開主題中的“layout”目錄，根據裏面文件的字面意思選擇一個文件打開，看看是不是我們需要修改的文件。在icarus主題中要修改的文件爲“layout\common\article.ejs”文件
4.2驗證找的文件有沒有正確
我們找到了可能是我們需要修改的文件，然後打開它。
如果你懂這個文件的語法就很容易可以判斷是不是你要修改的文件。
如果你不懂語法也沒關係，打開瀏覽器，訪問博客首頁，按“F12”打開html源代碼，找到你要修改的位置。比如我要修改的源代碼位置如下。
在我們認爲是需要修改的文件裏認真看有沒有我們需要改位置的代碼（我相信博客都搭起來了，你至少也能看懂一點點語法含義），如果找到了，那就證明這個文件就是我們要找的文件了。
4.3修改代碼
既然位置找到了，我們就可以修改代碼了。
1.首先我們要判斷打開的鏈接是不是首頁，置頂標誌只在首頁顯示，而文章詳情界面不僅會在首頁顯示還會在查看文章界面顯示（至少大部分主題是這樣），如果在查看文章界面也要顯示置頂標記，那就忽略這一條。
2.判斷top參數是否存在。存在就添加標記。
我添加的代碼如下
<% if (index && post.top){ %>
置頂
<% } %>
顯示效果如下：
我只是簡單實現了一下功能，沒有進行樣式控制，樣式控制都是html+css很簡單，不演示。
<% if (index && post.top){ %>
樣式控制的代碼
<% } %>
注意：這個代碼是icarus主題的，其他主題的不一定相同哦，不能隨便原文抄。知道原理，參考一下代碼上下文格式，就一個if語句，很容易就可以寫出來了。
5.總結
本文到此結束，添加文章置頂功能還是比較容易的，如果有不清楚的地方歡迎評論留言（特別是添加置頂標誌這一塊，不同的主題都有一點不一樣），看到的留言我都會回覆的。本文到此結束，有什麼不足的地方請大家不吝指正。
