本站設計與 Hack 總覽

使用的 Hack 一覽表

• 消除 navbar
• 加密文章內容（感謝 Mytaro 提供資訊）。
• 將發表者的名稱加上 e-mail連結
• 縮短文章長度之「繼續閱讀」功能（尚不完善，標籤頁下會沒作用）
• 標籤雲的 Hack。
• 摺合右側邊欄的區塊（最下面的Archive 有時會沒有作用）。
• 側邊欄區塊專用小圖示。
• 顯示最新五筆回應（可惜沒有標題）。
• 顯示最新五筆 「美國留學生活 」相關文章。
• 「you are here」，在文章上顯示瀏覽位置的小連結。
• 變換字體大小。
• 在文章的最後顯示相關文章（標籤還需要重新分類）。

側邊欄的部分：

• 部落格標題與首頁連結：LVCHEN 的美國生活指南。
• Google Co-op 的全站搜尋(100% 不完整..XD)。
• Fast online users 線上人氣計數器。
• StatCounter 網站流量計數器(unique visitor type counter)。
• 按日期排的RSS Feed。
• 改變字型大小的按鈕。
• CBOX 之快樂留學生活留言版。
• 最新回應列表（5篇）。
• 留學相關連結（增加中）。
• 「美國留學生活 」最新文章列表（5篇）
• 一朵朵的標籤飄啊飄的。
• 將會放上一堆貼紙再折疊起來
• 按月歸類的文章總覽

日曆的功能我做不出不來，後來我有想到原因，應該是「>」或「<」這個符號的關係，在 Template 的 body區要改成 &gt; 與 &lt;，不過即使做出來效能也不好，會費去很多Loading Page 的時間，所以決定放棄，有興趣的人可以參考試做: http://abintech.azhai.org/2007/02/blogger-archive-calendar.html http://bartstalk.blogspot.com/2006/07/blogger-calendar-ie.html 關於「繼續閱讀」，這真是一個非常困擾人的問題，我現在是用 Josh's 的「超級無腦安裝Blogger外掛功能版」，這個版本的安裝方式非常犀利，什麼程式碼都不需要知道，也不用改範本，就這樣給它裝進去了，可惜的是，雖然在首頁下按「較舊的文章」連結可以顯示 Javascript 的效果，但是按下其它標籤的連結，居然就失效了，另外還有兩個版本，一個是 JavaScript 版的，可以解決這個問題，但是在首頁下按「較舊的文章」連結就會失效，我知道這是因為 XHR Response 的問題，但我功力不夠，沒有辦法自己解決 ，只好等阿土伯修正這個Bug囉。 其實有用 CSS 直接改版型的方法，這個方法倒是蠻有用的，不管怎麼按都有效，可惜的是如果文章沒有想要隱藏的部份，還是會秀出「繼續閱讀...」的字樣。其實問題不難理解， 因為他沒有用 JS CODE 去檢查文章內的>div&glt;語法下的ID，只是單純的利用 Template 內建的條件判斷去改版型，所以無論你是不是要隱藏版面，都會出現「繼續閱讀...」。 話說有一個終極的解決方案，是為「繼續閱讀懶人加強版 」，是繼續閱讀懶人版（類似無名的方式）的 AJAX 終極自動安裝版。它利用了阿土伯設計的擴充Blogger核心，用外掛方式安裝在 blogger 上。 這個外掛解決了上述的全部問題，但是因為它的核心原理是直接偵測文章開頭的行數，自動的將文章隱藏起來，但是我想要的是能夠隱藏任何我想要的隱藏部分的功能，所以我還是沒有使用它。 可能就是因為這個功能太像無名的繼續閱讀功能了，所以我才會下意識的抵制吧。:)

3/16 補充： Blogger 預設的 RSS Feed 有沒有辦法按照發文日期排列的問題，終於在今天獲得解決，可以在我側邊欄的 RSS LOGO 找到修正過的連結。 我是看了 http://myshare.url.com.tw/index.php?func=url&node=86801 這篇的文章才發現這個修正的方法，解決的方法是： http://BLOGNAME.blogspot.com/feeds/posts/default?orderby=published 可是有個問題，因為 Blogger 預設使用 Atom Feed，如果閱讀器不支援 Atom 就會出現錯誤。 解決的方法也很簡單，就多加一個指令 alt=rss，具體的作法為： http://BLOGNAME.blogspot.com/feeds/posts/default?alt=rss&orderby=published　這樣就可以囉！

4/02 補充： 阿土伯真是太帥了，就在昨天，我剛剛提到的問題全部都解決囉。 http://racklin.blogspot.com/2007/04/bloggerext2js-062.html 現在所有的功能都可以在標籤 / 查詢 / 封存 等三個模式下運作，天啊，阿土伯你真是天才啊。

預定新增功能：

• 最新文章的加強版：其他的最新文章: (Other Recent Posts)　http://abintech.azhai.org/2007/03/other-recent-posts.html
• 讓側邊列 (Sidebar) 的元件只在首頁顯示/不顯示:　http://abintech.azhai.org/2007/02/sidebar.html
• Navigation Icon: http://ibenjamin.blogspot.com/2007/02/bloggernavigation-icon.html Adding Label Feeds: http://purplemoggy.blogspot.com/2006/09/adding-label-feeds-to-your-template.html，and http://ggpi.blogspot.com/2006/12/blogger-30rss.html

參考教學：

• Abin's Tech Note: http://abintech.azhai.org/index.html
• 羊男實驗の咖啡館: http://metamuse.blogspot.com/
• Ben's 部落不及格: http://ibenjamin.blogspot.com/
• 老男人的部落格: http://www.qna-blog.com/search/label/blog小工具
• 色彩斑斓: http://sunr.blogspot.com/
• Racklin's 阿土伯程式大觀園: http://racklin.blogspot.com
• 堯@部落格: http://jinyaolin.blogspot.com/
• GC 派: http://ggpi.blogspot.com
• Kaie's Blog: http://chenkaie.blogspot.com
• BlogU: http://bloggeruniversity.blogspot.com/search/label/Blogger
• Hackosphere: http://hackosphere.blogspot.com/
• Freshblog: http://blogfresh.blogspot.com/
• 博客hack擴展大全 wiki: http://groups.google.com/group/ggpi/web/hack

CSS 設定教學資料

• http://www.sinica.edu.tw/~ctchang/slidemaker/css-course/all.htm
• http://www.htmlhelp.org/reference/css/properties.html
• http://www.hsiu28.net/style/style_1.php

其它輔助工具：

線上人數計數器
• http://www.muryo-counter.net/
• http://www.histats.com/

超方便網頁配色選擇器：
• http://myweb.hinet.net/home2/rhinejo/home/color/csrf.html

AJAX 的動態GIF generator
• http://www.ajaxload.info/

參考範本(Template)
• 雙側欄的樣版: http://metamuse.blogspot.com/2007/02/gadget.html
• 三欄的樣版: http://metamuse.blogspot.com/2007/01/blogger-3-columns-template-layout-evo.html
• 三欄的樣版: http://hoctro.blogspot.com/
• 其它樣板:
  http://web-messengers.blogspot.com/index.html http://www.bloggertemplates.org/?pg=2