Image may be NSFW.
Clik here to view.
這個工具使用了「相關文章」的版本號，但其實跟「相關文章 V2」的市場、用途並不相同。V2 版的文章會顯示縮圖，而 V3 版完全只有文字，難不成這個工具退化了嗎？
其實他比較偏向「系列文功能」的風格，只列出建議閱讀清單的文章標題。但篩選方式又不同，系列文是利用 "關鍵字" 來篩選，而這個 V3 版則是用 "標籤" 來篩選，與相關文章的篩選方式雷同，因此歸類於「相關文章」。
雖說只顯示文字，但功能與效果十分強大，請見後續的說明。
(圖片出處: lifeofpix.com)
請注意，此篇為加值文章，需先加入會員，並累積足夠點數才能兌換。
1. 舊文章不必設定
使用「系列文功能」功能時，必須每篇文章手動設定關鍵字，才能產生推薦給讀者的系列相關文章列表。當部落格有上百篇舊文章時，一篇篇設定就是一件大工程了。
這個 V3 版本針對此點，可讓舊文章不必手動設定，也能自動產生相關文章列表，這就幫我們節省了可觀的時間。
而相關文章列表篩選的依據為，自動抓取該篇文章的所有標籤，從這些標籤的所有文章，隨機抽出指定數量的文章，自動於文末列出。
2. 手動與自動設定並存
舊文章可自動設定，那麼新文章能不能手動設定呢？
可以的，如果你想指定列出特定標籤的相關文章，可單獨在該篇文章手動設定，那麼該篇文章就不會從所有標籤來抽樣，只會從特定標籤來抽樣，達到更精確的「相關文章」列表。
3. 支援多重標籤
這算是特殊用途，有的讀者可能想在某篇文章做出多個標籤的文章列表，那麼無論你設定幾個標籤，就能顯示幾個「相關文章」的列表。
4. 適用場合
為了縮短網頁載入時間，行動裝置不適合載入太多圖片，因此「相關文章 V2」的縮圖模式盡量不要用在行動版。取而代之的，這個 V3 版本的文字模式，就很適合用在 Blogger 行動範本。
如果要細分適用的文章性質，像是旅遊、美食類的文章，文末最好列出含相似字串文章標題，例如一系列的 "墾丁" 遊記，而這些遊記使用的標籤可能會是 "南部旅遊" 之類，這樣情況的情況使用「系列文功能」比較恰當，可以篩選出網站所有含 "墾丁" 標題的文章。
如果不需要篩選特定字串，那麼「相關文章 V3」基本上適用所有類型的網站，可篩選特定標籤、也可篩選該篇文章所有標籤的文章。
在修改範本之前，如果第一次安裝本站工具的讀者，建議先閱讀「備份範本的訣竅」系列文章。
1. 請到後台「範本」→「編輯 HTML」，游標點進範本區塊，按 Ctrl-F 搜尋</head> 這個字串，找到後在此字串的前一行，插入以下程式碼：
第一行綠字可參考「如何使用jQuery版本」，檢查範本是否已安裝過 jquery，以免重複安裝。
其餘的部分，如果對 CSS 熟悉可自行修改參數。
接著請搜尋</body> 這個字串，找到後在此字串的前一行，插入以下程式碼：
以下參數修改請參照以上程式碼行號：
F：紅色數字請改為相關文章想顯示的數量
G：藍色字串可改為自訂標題。此字串只有在該篇文章未指定篩選的標籤時，才會出現。
H：如果使用官方範本的話，這一行基本上不必動。此參數代表「相關文章」會出現在文章結束處。
J：由於過去發生「Google Drive(js檔)流量限速」的情形，為了避免將來某天這個小工具無預警罷工，建議讀者有空的時候，參考以上文章連結，自行將綠色字串的 js 檔分流。
1. 基本使用方式
基本上，程式碼安裝完、儲存範本後，網站的每篇文章結束處，就會自動產生相關文章了。
如前所述，這個工具會自動從該篇文章的所有標籤，隨機抽選相關的文章出來。
2. 手動設定篩選標籤
如果想要讓某篇文章的推薦文章更精確，可以手動設定標題與標籤名稱。
以「Blogger 多層下拉選單實作」為例，這篇文章使用了三個標籤 " 導覽列"、"CSS"、"HTML"，而 WFU 認為會看這篇文章的讀者，可能對 Blogger "導覽列" 的相關技巧會更有興趣，那麼就可設定只篩選出 "導覽列" 的相關文章出來，效果會比混合標籤抽樣更佳。
操作流程如下：
A. 編輯該篇文章，切換到 HTML 模式。
B. 在想要顯示的地方(通常是最下方)，插入這行字串：
C. 以上紅色字串請置換為指定標籤名稱；藍色字串改為自訂的標題名稱。
3. 多重標籤顯示
如果一篇文章想顯示多個「相關文章」清單，那麼只要填入多行的參數字串即可，例如文章中插入以下兩行字串：
<div class="rltPost3" data-label="導覽列">Blogger 導覽列相關技巧：</div>
<div class="rltPost3" data-label="CSS">更多 CSS 相關技巧：</div>
想先看一下多重標籤的效果，可前往以下網頁：
加值文章關閉留言板功能，使用上有任何問題請用下面的表單與我聯繫：
日後若有常見問題，會持續補充在此。
Q1: 請問v2跟V3能否並存? 設定成V3只有在手機板執行V2電腦版執行?
Ans: 因為 V3 使用了部分 V2 的演算法，同時使用了相同的變數名稱，兩個程式若在同一個頁面同時執行的話，怕會引起錯誤。
不過若是一個在手機版、一個在電腦版執行，那就不會有任何影響了，例如使用以下的 Blogger 判斷式：
更多實用工具：
Image may be NSFW.
Clik here to view.![]()
Clik here to view.
這個工具使用了「相關文章」的版本號，但其實跟「相關文章 V2」的市場、用途並不相同。V2 版的文章會顯示縮圖，而 V3 版完全只有文字，難不成這個工具退化了嗎？其實他比較偏向「系列文功能」的風格，只列出建議閱讀清單的文章標題。但篩選方式又不同，系列文是利用 "關鍵字" 來篩選，而這個 V3 版則是用 "標籤" 來篩選，與相關文章的篩選方式雷同，因此歸類於「相關文章」。
雖說只顯示文字，但功能與效果十分強大，請見後續的說明。
(圖片出處: lifeofpix.com)
一、功能介紹
請注意，此篇為加值文章，需先加入會員，並累積足夠點數才能兌換。
1. 舊文章不必設定
使用「系列文功能」功能時，必須每篇文章手動設定關鍵字，才能產生推薦給讀者的系列相關文章列表。當部落格有上百篇舊文章時，一篇篇設定就是一件大工程了。
這個 V3 版本針對此點，可讓舊文章不必手動設定，也能自動產生相關文章列表，這就幫我們節省了可觀的時間。
而相關文章列表篩選的依據為，自動抓取該篇文章的所有標籤，從這些標籤的所有文章，隨機抽出指定數量的文章，自動於文末列出。
2. 手動與自動設定並存
舊文章可自動設定，那麼新文章能不能手動設定呢？
可以的，如果你想指定列出特定標籤的相關文章，可單獨在該篇文章手動設定，那麼該篇文章就不會從所有標籤來抽樣，只會從特定標籤來抽樣，達到更精確的「相關文章」列表。
3. 支援多重標籤
這算是特殊用途，有的讀者可能想在某篇文章做出多個標籤的文章列表，那麼無論你設定幾個標籤，就能顯示幾個「相關文章」的列表。
4. 適用場合
為了縮短網頁載入時間，行動裝置不適合載入太多圖片，因此「相關文章 V2」的縮圖模式盡量不要用在行動版。取而代之的，這個 V3 版本的文字模式，就很適合用在 Blogger 行動範本。
如果要細分適用的文章性質，像是旅遊、美食類的文章，文末最好列出含相似字串文章標題，例如一系列的 "墾丁" 遊記，而這些遊記使用的標籤可能會是 "南部旅遊" 之類，這樣情況的情況使用「系列文功能」比較恰當，可以篩選出網站所有含 "墾丁" 標題的文章。
如果不需要篩選特定字串，那麼「相關文章 V3」基本上適用所有類型的網站，可篩選特定標籤、也可篩選該篇文章所有標籤的文章。
Image may be NSFW.
Clik here to view.
Clik here to view.
二、準備動作
在修改範本之前，如果第一次安裝本站工具的讀者，建議先閱讀「備份範本的訣竅」系列文章。
1. 請到後台「範本」→「編輯 HTML」，游標點進範本區塊，按 Ctrl-F 搜尋
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'></script>
<style>
/* 相關文章 V3 start */
.rltPost3 { /* 整個區塊 */
margin: 20px 0;
font-size: 14px;
}
.rltPost3_title { /* 標題 */
text-decoration: none!important;
font-weight: bold;
color: #666!important;
}
/* 相關文章 V3 end */
</style>第一行綠字可參考「如何使用jQuery版本」，檢查範本是否已安裝過 jquery，以免重複安裝。
其餘的部分，如果對 CSS 熟悉可自行修改參數。
三、安裝程式碼
接著請搜尋
以下參數修改請參照以上程式碼行號：
F：紅色數字請改為相關文章想顯示的數量
G：藍色字串可改為自訂標題。此字串只有在該篇文章未指定篩選的標籤時，才會出現。
H：如果使用官方範本的話，這一行基本上不必動。此參數代表「相關文章」會出現在文章結束處。
J：由於過去發生「Google Drive(js檔)流量限速」的情形，為了避免將來某天這個小工具無預警罷工，建議讀者有空的時候，參考以上文章連結，自行將綠色字串的 js 檔分流。
四、使用說明
1. 基本使用方式
基本上，程式碼安裝完、儲存範本後，網站的每篇文章結束處，就會自動產生相關文章了。
如前所述，這個工具會自動從該篇文章的所有標籤，隨機抽選相關的文章出來。
2. 手動設定篩選標籤
如果想要讓某篇文章的推薦文章更精確，可以手動設定標題與標籤名稱。
以「Blogger 多層下拉選單實作」為例，這篇文章使用了三個標籤 " 導覽列"、"CSS"、"HTML"，而 WFU 認為會看這篇文章的讀者，可能對 Blogger "導覽列" 的相關技巧會更有興趣，那麼就可設定只篩選出 "導覽列" 的相關文章出來，效果會比混合標籤抽樣更佳。
操作流程如下：
A. 編輯該篇文章，切換到 HTML 模式。
B. 在想要顯示的地方(通常是最下方)，插入這行字串：
<div class="rltPost3" data-label="導覽列">Blogger 導覽列相關技巧：</div>C. 以上紅色字串請置換為指定標籤名稱；藍色字串改為自訂的標題名稱。
3. 多重標籤顯示
如果一篇文章想顯示多個「相關文章」清單，那麼只要填入多行的參數字串即可，例如文章中插入以下兩行字串：
<div class="rltPost3" data-label="導覽列">Blogger 導覽列相關技巧：</div>
<div class="rltPost3" data-label="CSS">更多 CSS 相關技巧：</div>
想先看一下多重標籤的效果，可前往以下網頁：
五、聯絡表單
加值文章關閉留言板功能，使用上有任何問題請用下面的表單與我聯繫：
六、常見 FAQ
日後若有常見問題，會持續補充在此。
Q1: 請問v2跟V3能否並存? 設定成V3只有在手機板執行V2電腦版執行?
Ans: 因為 V3 使用了部分 V2 的演算法，同時使用了相同的變數名稱，兩個程式若在同一個頁面同時執行的話，怕會引起錯誤。
不過若是一個在手機版、一個在電腦版執行，那就不會有任何影響了，例如使用以下的 Blogger 判斷式：
<b:if cond='data:blog.isMobile'>
這裡填入行動版要執行的程式碼，例如 V3
<b:else/>
這裡填入電腦版要執行的程式碼，例如 V2
</b:if>更多實用工具：
Image may be NSFW.
Clik here to view.