部落格新增日曆

早在剛開始使用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;

以上。
改這些東西真的很有成就感~❤

3 Replies to “部落格新增日曆”

  1. 小云真厲害!會自己修改程式碼來符合需求。曾經很想要用blogger,但是覺得功能並不多,多半需要自己"創造",而我完全沒有創造能力,加上學習能力不強(哈)只好放棄,還是選擇已將該有的功能都建置完成的部落格來使用囉。話說,部落格的變化性就會不大^^

  2. 沒有啦,我都是看別人的教學來改的,真正厲害的是那些寫程式寫教學的「前人」,我只是負責乘涼的「後人」啦 XD

    我剛開始用blogger時也很害怕,一堆功能沒有內建,光是找教學就耗了一大把時間!慢慢才玩出興味,雖然很辛苦,但成果出來時真的很有成就感 😛
    有時看到新功能也會忍不住想裝來玩看看,不過功能雖然強大,玩過頭裝太多東西的下場就是整個部落格讀取速度變很慢(抱頭)

    其實,如果沒特別想要裝的功能的話,一般的部落格就很夠用了,簡單又輕鬆,省時又省力,幾個動作就可以設定完成(這也是我碎碎念那邊之所以會放在痞客邦的重大原因,笑),blogger這邊一方面是玩上癮了(咦),另一方面則是已經跳進這個太深的坑了,就懶得搬家啦~XD

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料