[改造] 賜予Blogger Template新生命！Tag：Blog、教學

這陣子經過一番"改造"，算是將TonyChou Walker的Blogger Template做個註腳，在此將個人的心得整理一下，希望對有需要的人能有一些幫助。
首先，Blogger最大的優點就是自由、自訂度極高，這是跟一般Blog不同的地方，排版的顯示方式主要分成"<MainPage>主頁"、"<ItemPage>內頁(單篇文章連結)"、"<ArchivePage>月整理"...相信玩過Blogger的人應該都會知道，當然最大令人無奈的是沒有"文章分類"跟"最新留言顯示"這兩大功能，其實我個人以"資料結構"來看，Blogger留言的資料應該是有用完整的一個"資料表"來儲存的，因為每一筆留言都有專屬的ID，所以"最新留言顯示"的功能對於Blogger的架構而言其實應該不難達到，只是要看他們願不願意開放、增加Code罷了，可以類似以標籤的方式加入Template就好了，至於"文章分類"應該是"不太可能"達到，要達到的話我想必須要"至少"在原有的資料庫中建立一個新的資料表來儲存"分類名稱"才可以，那麼原先的文章資料表也"至少"要新增一個欄位(ID)來比對才行，其實真正要做起來也並不會太難，只是一旦要動到資料庫就是會有一點麻煩啦...所以我想Blogger應該是不會去做的。

其實要改善"最新留言顯示"的功能可以用JavaScript達到，像 BloggerHacks、Recent comments in the sidebar 就都有提供Code可以自行加入Template裡面，但是這些重點都是只能抓取"主頁顯示文章數"的留言，所以要"抓取全部"的留言資料除非將"主頁顯示文章數"設到最大(999)，但是如此一來便會"主頁讀取"會變得很慢，畢竟要顯示所有的文章，再加上Blogger本身並沒有將"文章主體"欄位區分成"摘要"及"內文"，就連在主頁讀取文章時都會"完整載入"，如果文章內容中有許多圖片、影片的話就會更...慢...了！

總之，以上"似乎"都不是重點！在我之前介紹過的 好站-水瓶子 所提供的樣版解決了這些問題，直到前陣子才發現他早已經釋出樣版了，我真是後知後覺呀～二話不說把他的樣版"好好研究"一番，基本上這個Template運用了"AJAX"的概念，運用了大量的JavaScript，老實說我對JavaScript並不太熟悉，對於許多函數都不認識，所幸我還有"一點慧根"，可以看出此程式中的變數、function在做些什麼事，他的大致做法是文章顯示數量設成最大(999)，只取每一篇文章中的關鍵欄位(文章ID、留言ID、留言DateTime...)，將"主頁"抽離以<iFrame>載入要顯示的"內頁"，重新組版，甚至在標題欄位做判斷，以類似Tag的方式達到文章分類的功能，搞懂之後我只有"佩服"！我想這除了需要"技術面"以外，過人的"智慧"也是很重要的！至少我還沒有看過"第二個人"可以把Blogger搞成這樣的～讚！

為了修改這個樣版符合我個人的需求算是費了不少心力，主要時間還是都花費在兼容IE、Firefox瀏覽器的除錯上，由於我還是習慣我原先的"展開/收合"內文的方式，所以做了getElementById()的內文判斷，其次就是由於此主頁讀取時會載入內頁，而我本身內頁會載入過多的東西(尤其是過多的Sidebar)，但是卻又不想捨棄掉，所以想了一個方法，將每篇"內頁"載入<iFrame>時以變數的方式來"區隔"處理：範例(Sidebar減少載入)，如此一來主頁的讀取速度便會快上許多，這部份算是比較麻煩(除錯)的，因為IE老兄的莫名怪問題，所以改了很久，最後反而用了一個"最爛"、"最鳥"、"最笨"、"最沒效率"的方式反而成功？

我強力推薦Blogger的使用者去套用這個水瓶子的樣版，我把這個樣版的一些部份稍微說明一下：

var a=2; //顯示閱讀全文連結(1：開/2：關)
var s_MainOrder=2;
var s_DefaultMainNum=10; //主頁顯示的文章標題數
var s_DefaultMainItemPageNum=3; //主頁自動載入的內文數

其中"閱讀全文"的判斷是以文章的"斷行<br>"數量來做處理，修改的地方在下面位置：

for (jj=0; jj<5; jj++)

其中的"5"代表"斷行<br>"數量，可以自行調整，另外有一個小地方我建議修改一下，為了"完全斷絕"<iFrame>在主頁出現破壞美觀的可能，請修改以下部份：

<iframe id=tmp width=0 height=0>
改成
<iframe id=tmp width=0 height=0 SCROLLING=NO FRAMEBORDER=0 MARGINWIDTH=0 MARGINHEIGHT=0 BORDER=0>

水瓶子的樣版對於我而言有"非常高"的研究、參考價值，有興趣的趕快去研究一下吧！相信這個Template會令你對Blogger愛不釋手喔～
(不過，要修改自訂度高的Blogger確實還是會讓一般的使用者感到頭痛...)

延伸閱讀：

1. Blogger分類及最新迴響範本公開(黑底白字版)
2. nextservices(Google Groups)

Technorati Tags: BloggerTemplate

相關文章：