『相關文章』-- 靈感啟發篇

雖然下面要介紹的『相關文章』功能, 我沒有直接使用, 但卻是很重要的起點, ....

• 『相關文章』-- Abin's Tech Note 的啟發

之前 (2007-11) 研究過一陣子『相關文章』的做法 (加入相關文章功能, Abin's Tech Note 2007-03-05), 雖然後來沒有直接採用, 但確實從中得到不少啟發。ABIN 的做法如下 :

• 集合A = 目前文章的標籤 * (每個標籤取出10 篇最新的文章, 並且不包含目前文章)
• 集合B = 集合A 的 不重複文章
• 相關文章 = 從 集合B 隨機取出 5 篇文章

其中, 重要的概念有 :

• http://網站名稱/feeds/posts/default/-/標籤名稱?alt=rss&max-results=傳回數量=> 代表包含特定標籤的 RSS, (default 也可以改為 full 或 summary), 請參考原文 (Blogger 資料來源用法與整理, ABIN)
• 利用 expr: 來將 標籤名稱(data:label.name) 的 RSS 傳給『收集相關文章的函式』, 請參考原文 (加入相關文章功能, ABIN)
• 利用模版中 顯示文章標籤的段落 來收集相關文章, 以下是原模版的內容 :

<span class='post-labels'> <b:if cond='data:post.labels'> <data:postLabelsLabel/> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if> </b:loop> </b:if> </span>

* 判斷文章是否有標籤 * 顯示『標籤：』 * 依次處理每一個標籤 * 顯示 標籤名稱(data:label.name)及 超連結('data:label.url' ) * 在標籤之間加上 逗號, 但最後一個標籤不加逗號

就像這個樣子!!..

• 『相關文章』-- Google Ajax Search

用了好一陣子, 差不多把它當成『隨機文章』, 因為不知道該如何『餵』關鍵字給它, 所以只指定了『Eucaly61』, 看起來就像這樣 :最近試出『餵』關鍵字的方法, 不過因為 Google AJAX Search API 的『Blog Bar』搜尋的是 RSS 裡的關鍵字, 所以如果 標籤名稱 沒有出現在本文裡, 還是不會被找到。(例如: 標籤名稱 是『程式設計』, 但文章本文卻不一定會出現『程式設計』...)雖然這樣, 還是分享一下程式碼, 說不定你用得上

<script type='text/javascript'> var myTotalLabel = new Array(); </script> </head>	把這幾行放在 </head> 之前, 這樣會定義一個空的全域變數
<p class='post-footer-line post-footer-line-2'> <span class='post-labels'> </p> [A] <p class='post-footer-line post-footer-line-3'/> ... </div> </div> ... [B] </b:includable>	再找到適當地方, 放下面的程式, [A] post-footer-line-2 整個段落之後, 如上圖, 會出現在 標籤 之後 [B] post-footer-line-3 之後的 </b:includable> 之前, 會出現在 FeedFlare 之後, 意見 之前 如果你的 標籤 到 意見 之間, 並沒有 Add to funP 等 FeedFlare, 兩者的差別並不大
<b:if cond='data:blog.pageType == "item"'> <div id='blogBar-bar'> <span style='color:#676767;font-size:11px;margin:10px;padding:4px;'>Loading...</span> </div> </b:if>	我將這一段放在 [A] , 也可以選擇 [B] <b:if ...> 只有單篇文章會顯示 <div id='blogBar-bar'> ... </div> 讓 Google AJAX Search API 放置 BlogBar 的地方,
<b:if cond='data:blog.pageType == "item"'> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <script type='text/javascript'> myTotalLabel.length += 1; myTotalLabel[myTotalLabel.length - 1] = &#39;<data:label.name/>&#39;; </script> </b:loop> <b:else/> <script type='text/javascript'> myTotalLabel.length += 1; myTotalLabel[myTotalLabel.length - 1] = &quot;Eucaly61&quot;; </script> </b:if> </b:if>	可以和 [A] 放在一起 或獨立放在 [B] 這邊是重點, 將 myTotalLabel 陣列擴充, 並一次加入一個 標籤名稱 沒有標籤時, 預設的內容

.再來是安裝 Google AJAX Search API, 請教 Google 大神就有一堆介紹了.找到你安裝 Google AJAX Search API 的地方, 重新指定 executeList,另外, 你可能也會想設定 largeResultSet, orderBy, siteRestriction 等參數, 或更多設定

autoExecuteList : { executeList : ["eucaly61"] }	原來的設定
autoExecuteList : { executeList : myTotalLabel }	重新指定 executeList

p.s. 或許 Use JavaScript Urls to drive the Blog Bar 也可以, 不過還沒試.

• 下集預告

成功應用到『相關文章』的 Grazr『格中格』:

• 『相關文章』『格中格』 -- Grazr
• Grazr『格中格』簡介 -- 操作與安裝

計劃要使用的 Google AJAX Feed API :

• 在部落格顯示其他部落格的最新文章標題 (Meme -- 教學與反省, 2006-06-14)
• 用Google工具實作部落格聯播 (.阿欣部落., 2008-06-16)

.