部落格新增日曆

早在剛開始使用blogger之時，我就想用日曆了，但一直沒能找到簡單好用、功能外觀都能合我意的外掛。前陣子在LVCHEN 的美國生活指南裡看到在blogger裡使用日曆的教學（嘗試一個新的外掛－日曆文章列表），當時就覺得很不錯、很心動，想馬上拿來用，但是因為該程式還在測試期中，也尚有一些問題待修正，也就這麼延宕了下來。後來，在Abin's Tech Note看到了另一個日曆外掛（結合發表文章的日曆模組），輕薄短小，外觀又頗合我意，思考了幾天如何調整版面配置後，就趕快試用看看了。

結果請見右側，GOOGLE SEARCH下面那欄就是日曆了。目前試用Firefox3.0和IE7，狀況都還不錯，也不會太過拖累部落格讀取的速度；不過只有我自己測當然有所不足啦，有在看本部落的各位，如果有明顯覺得讀取變慢，或者發現什麼問題，還請不吝留言告知。

因為這個模組是從星期一作為每週的起始，而我自己的習慣是以星期日作為每週的第一天，所以針對這個部份做了修改，並配合將六、日都改成暗紅色顯示，底下是修改的筆記。（※參考這篇文章底下的回應教學，只需要更改「Javascript程式碼」的部份。）

1.修改顯示順序，把「日」移到「一」的前面，
兩者中間記得加上半形逗號間隔。
var baseURL = '';
var currentDay = new Date();
var today = new Date();
var monthLabels = new Array('01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12');
var monthDays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var weekLabels = new Array('一','二','三','四','五','六','日');
2.刪除「-1」。
var IsitNow = currentDay;
IsitNow.setDate(1);
var startDay = IsitNow.getDay() - 1;
3.將「nTableCol < 5」改成「nTableCol > 0 && nTableCol < 6」。 if (nTableCol < 5)
sCalendarCode+='<td id="Day'+index+'">';
else
sCalendarCode+='<td id="Day'+index+'" class="Weekend">';
如果不希望點日曆上的日期時另開新視窗，只要找到底下的程式碼，將其中的「target="blank_"」刪除，就可以輕鬆達到要求。
for (i=0;i<nActual;i++) {
posts[i][1] = posts[i][1].replace('\"', '"').replace('\'', ''');
document.getElementById('Day'+posts[i][0]).innerHTML = '<a title="'+posts[i][1]+'" href="'+posts[i][2]+'" target="blank_">'+posts[i][0]+'</a>';
另外，原始的配色用在本部落格裡還不錯，但是當我用到逆轉讀書會時，卻發現週末的紅色很不顯眼，所以稍微調整了顏色。
找到「CSS樣式定義」裡的Weekend項目，把「#997777」改成自己喜歡的顏色，例如紅色（#FF0000）或綠色（#008800）。
#CalendarTable .Weekend {
color: #997777;
以上。
改這些東西真的很有成就感～❤