Blogger 提供讓你塞入 Sidebar 的文章匯總功能有三種介面，有階層（樹狀）、Flat 清單和下拉式選單，也可以調整排序和顯示的格式，不過，這樣總還是不夠。很多 BSP 提供的 Blog 都會有類似日曆的模組，除了會有類似萬年曆的功能，讓你知道「今夕是何夕」外，也可以透過這個日曆知道哪一天你發表過文章，透過點擊日期去知道當天你寫過什麼，所以這樣功能的日曆也叫做 "Archive Calendar"，提供另外一種文章依日期分類匯總的檢視方法。
只是塞一個日曆並不困難，到處都可以找到 Javascript 程式複製貼上，但是要整合 Blogger 的 Archive 功能就麻煩了，以下分幾個步驟來進行。首先，在你的 Sidebar 上面要至少有一個 "Blog 存檔" (Archive) 的網頁元素 (Element)，接下來去修改它的屬性，存檔頻率改成「每日」，勾選「先顯示最舊的文章」，樣式設成「Flat 清單」。因為 "Blog 存檔" 這個 Element 「看起來」只允許你存在一個，如果你想要有日曆而且原有的 Archive 也想保留，那就要去修改 HTML（不要展開小裝置範本），把下面這行複製一份，然後改一下 id（不重複就行），你就可以有兩個 "Blog 存檔"，把新增的那個 Element 改成日曆就行了。不過如果你不需要那麼多 Archive 模組，這個動作就不要做了。
<b:widget id='BlogArchive1' locked='false' title='ARCHIVED POSTS' type='BlogArchive'/>
第二個步驟，塞入定義給 Calendar 用的 CSS （放在 <head> 標籤內就行，就是定義樣版的區段裡，請依照個人樣版修改，這次修改算是大變動，記得先完整備份你的 Template，這次要展開整個範本進行修改）：
/* Archive Calendar Styles */
#Calendar {
margin: 0px;
}
#CalendarTable table {
border-collapse: collapse;
padding: 0px;
border: 0px;
}
#CalendarTable table th {
padding: 1px;
color: #777;
margin: 0;
}
#CalendarTable table td {
height: 25px;
color: #999;
text-align: center;
padding: 1px;
margin: 0;
}
#CalendarTable table td a {
display: block;
}
#CalendarTable .Today {
color: #fff;
background: #777;
}
#CalendarTable .Today a {
color: #fff;
}
#CalendarTable .Weekend {
color: #997777;
}
#Calendar .act {
color: #fff;
padding: 4px;
}
第三個步驟，也是是重頭戲：要貼入一堆 Javascript 函示。（一樣是貼在 <head> 標籤裡，如果你之前也有 Hack 放過 Javascript，放在一起就好）
<script type='text/javascript'>
//<![CDATA[
<!-- Script functions for generating Archive Calendar: ArchiveCalendar(), archiveurl(), YearMonth(), Calendar(), PrevMonth(), NextMonth(), function GoToday(), refreshTable() -->
function ArchiveCalendar() {
this.PrevMonth = PrevMonth;
this.NextMonth = NextMonth;
this.GoToday = GoToday;
this.refreshTable = refreshTable;
this.YearMonth = YearMonth;
this.Calendar = Calendar;
this.archiveurl = archiveurl;
this.week_label = new Array("一","二","三","四","五","六","日");
this.month_label = new Array("01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12");
this.month_days = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
this.today = new Date();
this.cur_day = new Date();
this.blogarchivename = new Array ();
this.thisarchive = 0;
this.base = '';
}
function archiveurl(idx) {
url = this.base;
url += this.blogarchivename[idx].slice(0, 4) + '_' + this.blogarchivename[idx].slice(4, 6) + '_' + this.blogarchivename[idx].slice(6) + '_archive.html';
return url;
}
function YearMonth(date_obj) {
year = date_obj.getFullYear();
thisMonth = this.month_label[date_obj.getMonth()];
out = year+'-'+thisMonth;
return out;
}
function Calendar(date_obj)
{
year = date_obj.getFullYear();
thisDay = this.today.getDate();
thisMonth = this.month_label[date_obj.getMonth()];
nDays = this.month_days[date_obj.getMonth()];
if (date_obj.getMonth() == 1 &&(((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)))
nDays = 29;
IsitNow = date_obj;
IsitNow.setDate(1);
startDay = IsitNow.getDay() - 1;
if (startDay < 0) startDay = 6;
var out='';
out+='<table>';
out+='<tr>';
for (var index=0;index<7;index++)
out+='<th style="width:25px;">'+ this.week_label[index]+'</th>';
out+='</tr>';
thisarchive=0;
while (thisarchive <= this.blogarchivename.length -1)
{
if(this.blogarchivename[thisarchive].slice(0,4) == year && this.blogarchivename[thisarchive].slice(4,6) == thisMonth)
break;
else
thisarchive++;
}
var tab_col=0;
for (index=0;index<startDay;index++) {
if (tab_col==0)
out+='<tr>';
out+='<td> </td>';
tab_col++;
}
var archiveday;
for (index=1;index<=nDays;index++) {
if (index<10) {
index_day = new Date(year+'/'+thisMonth+'/0'+index+' 00:01');
archiveday = '0' + index;
}
else {
index_day = new Date(year+'/'+thisMonth+'/'+index+' 00:01');
archiveday = index;
}
if (tab_col==0)
out+='<tr>';
if (index==thisDay && this.today.getMonth()==date_obj.getMonth() && this.today.getFullYear()==date_obj.getFullYear()) {
out+='<td class="Today">';
if (thisarchive < this.blogarchivename.length && this.blogarchivename[thisarchive].slice(4,6)==thisMonth && this.blogarchivename[thisarchive].slice(6,8)==archiveday) {
out+='<a href="'+this.archiveurl(thisarchive)+'" target="_top">'+index+'</a>';
thisarchive++;
}
else
out+=index;
out+='</td>';
}
else {
if (tab_col < 5)
out+='<td>';
else
out+='<td class="Weekend">';
if (thisarchive < this.blogarchivename.length && this.blogarchivename[thisarchive].slice(4,6)==thisMonth && this.blogarchivename[thisarchive].slice(6,8)==archiveday) {
out+='<a href="'+this.archiveurl(thisarchive)+'" target="_top">'+index+'</a>';
thisarchive++;
}
else
out+=index;
out+='</td>';
}
if (tab_col==6) {
out+='</tr>';
tab_col=0;
}
else
tab_col++;
}
if (tab_col>0) {
for (var si=0;si<(7-tab_col);si++) {
out+='<td> </td>';
}
out+='</tr>';
}
out+='</table>';
return out;
}
function PrevMonth() {
thisMonth = this.cur_day.getMonth()-1;
year = this.cur_day.getFullYear();
if (thisMonth<0) {
thisMonth = 11;
year = year-1;
}
thisMonth = this.month_label[thisMonth];
this.cur_day = new Date(year+'/'+thisMonth+'/1 00:01');
this.refreshTable();
}
function NextMonth() {
thisMonth = this.cur_day.getMonth()+1;
year = this.cur_day.getFullYear();
if (thisMonth>11) {
thisMonth = 0;
year = year+1;
}
thisMonth = this.month_label[thisMonth];
this.cur_day = new Date(year+'/'+thisMonth+'/1 00:01');
this.refreshTable();
}
function GoToday() {
this.cur_day = new Date();
this.refreshTable();
}
function refreshTable() {
document.getElementById('CalendarMonth').innerHTML = this.YearMonth(this.cur_day);
document.getElementById('CalendarTable').innerHTML = this.Calendar(this.cur_day);
}
//]]>
</script>
最後一個步驟，要修改範本顯示的版面囉！找到下面這一段：（如果你有兩個 Archive，要確認你找到的是要改的那一個）
<b:includable id='flat' var='data'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</b:includable>
然後整個取代改成下面這一段：
<b:includable id='flat' var='data'>
<!-- Generate Archive Calendar -->
<center>
<table border='0' cellpadding='0' cellspacing='0' id='Calendar'>
<caption>
<a href='javascript:;' onclick='Calendar.PrevMonth();' title='Previous Month'><< </a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href='javascript:;' onclick='Calendar.GoToday();' title='Back to Today'> <span id='CalendarMonth'/> </a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href='javascript:;' onclick='Calendar.NextMonth();' title='Next Month'> >></a>
</caption>
<tr>
<td class='act' id='CalendarTable'> </td>
</tr>
</table>
<script type='text/javascript'>
Calendar = new ArchiveCalendar();
Calendar.base = '你的 Blog 網址';
var offset = Calendar.base.length;
<b:loop values='data:data' var='i'>
archUrl = '<data:i.url/>'.slice(offset);
Calendar.blogarchivename.push(archUrl.slice(0,4) + archUrl.slice(5,7) + archUrl.slice(8,10));
</b:loop>
Calendar.refreshTable();
</script>
</center>
</b:includable>
其中，紅色的網址記得要改成自己的喔！範本存檔，然後預覽看看，如果日曆有出來，就可以存檔收工囉！其實原理和標籤雲 (Label Cloud) 類似，利用 Javascript 搭配 Template 提供的資料（Daily Archive），將 Element 的樣式動態改變，變成想要的樣子，就是這個多功能的日曆囉！再嚴謹一點，最後一段可以加入 <noscript> 的判斷，套用原來那一段，如果使用者的瀏覽器不支援 Javascript （或是關掉），那麼Archive 的功能也還是存在能夠使用～（這裡懶得改了）
參考文章：
為 Blogger Beta 加上日曆
備註：
實際掛上這個模組，又看了原始碼以後，發現如果 Blog 的文章很多，搞 Daily Archive 文章會很多很慢，尤其當 Blog 成立越久，為了依照日期填入日曆的「每一天」的存檔，會增加首頁載入的時間，發表天數越長越嚴重！我還蠻喜歡這個日曆的，看看要不要改個 Monthly Archive 的版本，效能應該會比較好才是～
修改：
根據網友意見，我把日曆的第一天從原來的禮拜天改成禮拜一，也比較符合自己的習慣，另外日曆週末的部分也稍稍改變顏色(class: weekend)，用來標示，也可以自行修改樣式。
(2007/04/02) 修正 bug，如果有其他 style 的問題，請看看下面的意見和回覆的內容能不能解決。
回應: 89
想請教您，可否用同樣的月曆（版型）與Google Calendar結合在一起？意思是說，我在GCalendar輸入的公開行程，可以與您設計的這個樣式結合嗎？謝謝。
應該可以吧，只要用 Javascript 去 parse Google Calendar 提供的 XML 資料(Google Calendar 設定要改成分享給所有人)，依日期逐項塞入，就有同樣的效果。不過門檻就在改動從外部抓取資料來源。
我印象中，你如果想把 Google Calendar 加入 Blogger 首頁，其實不用那麼麻煩用什麼 Hack，Google Calendar 有提供插入網頁用的程式碼，在設定->日曆，先點選日曆分享給所有人，然後在日曆詳細資料那邊點選日曆的 HTML 網址，他會跳出另外一個視窗讓你更改樣式，並且在下面產生 iframe 的程式碼。
接下來在 Blogger 裡面網頁元素新增一個 HTML/Javascript 模組，把 iframe 的程式碼貼進去，儲存，這樣在你的 Blogger 首頁就嵌入了一個功能完整的 Google Calendar 了！不用改動 Blogger 樣版範本，就有你要的效果囉！只不過，外觀樣式上還是有一些限制，這一點除非自己寫程式，不然很難克服。
看起來超複雜，實在不適合我這個電腦呆子。還是謝謝你的回覆。（我知道Google Calendar原本的那個功能，不美觀就是了...）
Hello It watches east text I have translated it by means of google. The question is that of Javascript and the calendar does not begin per Sunday and where I live begins per Monday. You would know like modifying script?
So do I, srwolfman. Ok, I fixed the Javascript and made the calendar first day started from Monday. You just have to modify two places:
1. The sequence of week_label, the line is like "this.week_label = new Array(...)" (There are chinese in it)
2. Startday minus 1, the line is "startDay = IsitNow.getDay();", you have to fix to "startDay = IsitNow.getDay() - 1;"
By the way, I also hightlighted the color of weekend, add an additional style named "Weekend", and all codes also updated in the post. You could also help me to test it. :)
Hi
Perfect, thanks you.
雖然不错，但美中不足的是當鼠標指向日曆中有文章的那一天時，沒有浮現文章名稱
我想把第一天設成禮拜天，
請問要怎麼改？
謝謝！
我上面的回應有提到修改的地方（不過是英文的），原本第一天是禮拜天我改成了禮拜一。要更改日曆回第一天是禮天，有兩個地方要改：
1. 更改 week_label，這是顯示禮拜一、二、三...的標籤，這一行像是："this.week_label = new Array(...)"，把 "日" 移到第一個。(在 function ArchiveCalendar() 裡面)
2. 更改啟始日期，原來範例裡是 "StartDay = IsitNow.getDay() - 1;"，把 "- 1" 拿掉就可以了。(在 function Calendar() 裡面)
謝謝！我改好了
如果想要當鼠標停在日曆上有文章的日期上，就顯現出該文章名稱，就像 wordpress 那樣，請問應該如何實現呢？
Archive Calendar 是修改 Blogger 「每日存檔」功能得來的，所以日曆上「每一天」的文章顯示，都是以 Archive 的模式顯示，這樣也才應付「一天有多篇文章」的狀況。
它並沒有辦法像 Wordpress 的 Plugin 一樣，能夠直接存取資料庫，查詢所有日期的文章標題再塞入日曆裡面，我查過這個 Hack 能夠提供的資料，只能提示「一天有幾篇文章」，並沒有辦法提示「每篇文章的標題」，既然取不出標題的資料，自然就沒辦法顯示當日文章的標題了。
Blogger 的 Hack 只能針對 Blogger 提供的資料來做調配，不可能讓你直接讀取資料庫為所欲為地表現需要的功能，所以也才叫做 Hack，和 Wordpress 套用的 Plugin 方式是完全不一樣的。
我已成功的將日曆加入我新的Blog，謝謝您!!
但是日期與星期無法對應，例如今天是4月2日(星期一)，應放在星期一的位置，但它是擺在星期二的位置,我看您的網頁的日曆也是放在星期二，請問要如何修改才會是正確的對應。
另有二個問題請教您：
1.如何將"六"與"日"這二個字的顏色變更為紅色。
2.我照您的方式將"日"改在第一列，其"六"與"日"的對應日期顏色應為紅色，但是紅色的日期還是維持在最後二列，我應如何修改?
謝謝您!!
謝謝回報，日曆錯誤的問題已經修正。一併回答你的問題：
1. 如果要修改"六"、"日"兩個字的顏色，六日兩列也是在最後兩列的話，請找到下面這一行：
out+='<th style="width:25px;">'+ this.week_label[index]+'</th>';
把上面這行用下面六行取代：
{
if (index < 5)
out+='<th style="width:25px;">'+ this.week_label[index]+'</th>';
else
out+='<th style="width:25px;" class="Weekend">'+ this.week_label[index]+'</th>';
}
如果第一列是禮拜日，則把 if (index < 5) 改成 if (index > 0 && index < 6)
2. 如果第一列是禮拜日，請找到這一行：if (tab_col < 5)，改成 if (tab_col > 0 && tab_col < 6) 就可以把第一和最後一列的日期變色了。
謝謝您迅速的回覆我的問題，依據您教的方式，我已經變更成功了。
再次感謝您的協助 !!
Have a good day !!
hi,如果不介意, 此文是否可以借轉? 謝謝~
Maggieblack, 歡迎引用文章的內容..
你好，我有一个问题想请教您。按照你的办法，我同样整合了日历在自己的版面上。但是我发现，日历上数字的大小是不一样的。比如说，0 1 2这三个数字比较小，从3到9数字偏大。这是为什么呢？
To Z: 您日曆上數字大小不一樣，問題是你整個 Blog 選定的預設字型搞的鬼。你可以試試看，如果你的 Blog 文章裡也有 0, 1, 2, 3 ..一樣是 0, 1, 2 會比較小，不只是日曆裡會這樣，是你整個站都一樣。關鍵是因為你選用了 Georgia 這個字型。解決辦法，尋找你的樣版，不要用 Georgia 字體。
如果你只想改你日曆裡套用的字型，也可以加入類似下面這一段 CSS 到你的樣版裡：
#CalendarTable {
font:normal normal 100% Arial,Verdana,Sans-serif;
}
強迫日曆裡用 Arial 這個字型，一樣可以解決您的問題。
万分感谢ABIN的回答！
abin大大,請問:
我在blogger setting的存檔方面，選了（每日計）之後，兩個archives就同樣變了(每日計)
可不可以用兩個archives:
一個是日曆方式(每日計),
另一個是以月份(每月)的?
謝謝~
To anders: 你的問題我驗證過了，沒辦法在一個頁面放入兩個 Archives 喔，因為有些存檔處裡的參數並不是保留在樣版上面，而是系統參數保留在 Blogger 那邊，所以即使你搞出兩個 Archives，這兩個還是共用同一份參數，所以你只能用 Daily 或是 Monthly。
這一點也困擾我一陣子了。
謝謝abin~
超快的回覆啊~
多多指教
在此先感謝你的教學!!找了許久!!終於讓我找到了
= =~~~
在忙了一個夜晚!!
依樣畫葫蘆，改這個改那個!
到早上終於成功了
只過我有以下幾個問題希望不會為你帶來麻煩!!
如果覺得麻煩不回覆的話可以請給我一個方向嗎??
謝謝!!我很感動你的教學先!!
第1：原本的Archive(為a)
用程式碼新增出來的Archive(為b)
照理說日曆顯示成功的話應該是在b-Archive才對吧!!為什麼我的跑到a-Archive呢?
第2：我是ff瀏覽器，完成後我點日曆上的日期卻無法連結我的文章!我在懷疑是不是因為我的ff沒有裝java的plug in或是我程式碼的地方有錯誤!!
以上就這些問題!!希望不會為你帶來麻煩!!謝謝!!
abin大大!!
第2個問題我解決了!!
我想應該是在我修改程式碼的時候有問題!
於是我又重新改一次就ok了!!
只是問題1的狀況是正常的嗎??
To Cool GEN's BABA, 之前我有提到喔，Blogger 的 Archive 雖然可以用程式的方式增加多個，但原則上系統只允許你用一個，而有部分設定其實是在 Blogger 伺服器上，並不是在樣版裡。
因此，即使你有兩個 Archive (A & B)，日曆顯示依舊只會用其中一個，而且，是系統認得的那一個（應該是第一個: A）。
因此，你的問題一狀況是正常的，保險起見，您還是只用一個 Archive 比較好。
您真是太厲害啦.
謝謝您啊,謝謝.
我終於有日曆了.
真是太感激您了,我試過好多方法了.
我的網誌 http://zeki-621.blogspot.com/
為什麼日曆的顏色變的好怪
"日" "六"的顏色有變
但是下面數字的顏色變成不太對了
可以幫我看看哪裡沒改好嗎?
To 小日本，請把你自己的樣版程式碼這一行：
if (tab_col > 5)
改成
if (tab_col > 6 && tab_col < 0)
就可以了。
結果我自己修好了
因為我一直找不到你說的
if (tab_col > 5)
不過還是謝謝啦~
不好意思....想請教一下....我照個這些步驟去做以後日曆出來了、也把星期日改成第一列了(六日的顏色也改到正確的位置了)...但是我突然發現一個問題，就是我看到別人的BLOG裡面在他有PO的文章的日期處有連結可以按...但是我的部分卻沒辦法...請醒問一下我是哪個步驟出了問題...
我的BLOG是http://suroan.blogspot.com/
感恩...
照您的說明作了
結果卻出現亂碼
我的blog
http://xwasos.blogspot.com/
是不是還要注意什麼呢?
還有 我的日期上也沒有link
有link了 原來是
先顯示最舊的文章
這選項沒有勾
不過網頁上方的亂碼
還有日期號碼沒有顏色要怎麼處理呢?
To roan:
你的問題可能和 monster 一開始碰到一樣，請注意我文章第二段寫的，檢查一下：修改它的屬性，存檔頻率改成「每日」，勾選「先顯示最舊的文章」，樣式設成「Flat 清單」。
To monster: 你上面的「亂碼」，是 CSS 的樣式定義，你貼錯地方了：「在 <head> 標籤內，定義樣版的區段裡」，你有貼到 head 的標籤內，但沒有在樣版區段裡，樣版區段指的是 <style> 標籤裡面，定義 CSS 的部分，所以只要把你說的「亂碼」，剪貼到 <style .. > 標籤後面，就可以同時解決顏色和亂碼的問題。
網頁外觀中的無效變數聲明： 您可以使用變數，但不能定義它。 輸入： sidebarcolor
@@我找不到style這標籤
只好貼到我的標籤雲的上方
結果出現上述的訊息。
已改好
原來是每個樣板使用的css變數不同
感謝您的指導
有個問題 雖然日曆顯現了但是點日期卻沒有任何文章聯結 我BLOG已經有五六篇文章了且紅字部分我有改成自己BLOG位置了 想請問是哪裡出錯了
啊~找到問題癥結了XD,以為網址有改,沒想到漏掉了
反正問題已解決^^"
此文章已被作者刪除。
謝謝你，我引用了此功能到我文章中^__^
我按照指示裝了archive calendar,但是archive calendar卻無法連結到其他月份及其他文章,請問如何修改?
share-is-happy.blogspot.com
我好像弄錯了,sorry
不好意思，我無法加上日曆耶...
照著教學做後，按預覽時，只在bloog最上方出現第二個步驟的程式碼...
二、三步驟的程式碼，我是貼在＜head＞的下方。
有看到您的回應中，第三步驟是貼在＜style＞中，但是我按搜尋找不到＜style＞ ...囧
To Idle:
第二個步驟裡的東西都是 CSS 的 style 定義碼，我的意思是請新增到 <head> 後面、原有 Style 定義區段的裡面。我看了你的程式碼，你也有套用樣版，而且有 ID，所以當然你搜尋不到 <style>，請搜尋 <style （沒有右邊的括號，因為裡面還有定義其他參數），放到類似的 CSS 定義區段裡面。
ya!!!
終於成功了!
試著找＜style也找不到
後來我是在觀察一下第二步驟的程式碼
然後在找類似的，丟在一起，就ok了^^
謝謝大大了 ~~
不好意思，又有問題了 囧!
那個日曆不會顯示我以前發過的文章耶
就是沒有變成有連結的藍字....
是我有什麼地方沒設到嗎??
還是說弄好日曆後，文章都要重發一次?!
To Idle:
很遺憾，是的。因為該日曆是用「Daily Archive」，如果你之前是用每月匯總，那麼那個日曆用的連結，應該只會有當月的一號，不會有每一天的。
不過是不是要「每一篇」都重發我不確定，或許，當你改成 Daily Archive 之後，該月份只要有一篇文章重發，每篇文章的 Archive 連結就會被做出來，這可能要實際試試看才知道。（也就是當月重發一次就好了，不用每篇文章都重發）
不過我一加入dialy archive後，就直接設成跟這篇文章的設定一樣耶...
加入這個之前是有一些文章啦...
但後來有在發一些文章。但沒連結
還有，重發文章，是指把文章內容copy後重新發佈，然後刪掉原本的。
還是只要按「編輯文章」後，在按發佈呢?
如果是後者的話，我到是有試過，但一樣沒連結 囧"
不好意思，問題多了點 >"<
我後來有在開一個新的blog
直接加入日曆後，發佈文章，有正常出現連結，後來我在新增一些blogger hack後，弄的還滿滿意的，打算把原blog的文章轉過去，才轉第一篇，日曆文章又沒連結了...
新的blog>http://idlelifer.blogspot.com/
請問會是有什麼衝突到嗎><
以下是我有新增的blogger hack
http://windclara.googlepages.com/test.htm
麻煩大大抽空看一下><"
或是，我加入大大為共同作者，有空時幫我注意一下是不是範本有什麼地方有錯，這樣ok嗎??
如果這樣會防礙到大大太多時間的話，那就回應告訴我沒時間幫忙...
，至少讓我每天回家時，不會有期待落空的感覺 囧"
實在是很喜歡這個日曆的說....><
To idle:
才轉第一篇，日曆文章又沒連結了... -> 我看你新的 Blog，看起來是正常的啊？是問題解決了，還是哪裡還不正常？
咦
當時轉移時沒有的呀
怎麼後來出現了@@"
難道會比較慢顯現嗎...0.0
不過至少有了
不管了 ~~
總之，謝謝大大了 ^^
您提供標籤雲的作法 我成功了！ 可是要作日曆時，卻出現「網頁外觀中的無效變數聲明： 您可以使用變數，但不能定義它。 輸入： sidebarcolor」，是哪裡發生問題呢？
To ducklynn:
變數 sidebarcolor，是 Blogger 內建、用來定義樣式的預設變數之一，我的樣板有些顏色為求一致，顏色代碼不一定都用像 #660000 這樣的數字，而是一開始定義該變數的值，要用到那個顏色就直接引用變數。
我的樣板裡有宣告，因此樣式會引用，您會發生錯誤主要是您的樣版並沒有「宣告」該預設變數，因此要引用的時候發生錯誤。
解決這個問題很簡單，你就把那個變數值改成你要的樣式顏色代碼（像是 color: #660000），或是在樣式前面定義宣告，問題就解決了。
請問Abin:我完全都照你的教學弄了一個月曆，我的問題：在月曆第一排應該是有顯示一二三四五六日，但是我的只有六日，其他的都不見了，我不知道該怎麼修改，請你幫幫忙？！！（感激不盡）
我的部落格：
http://megmagicworld.blogspot.com/
To megan:
完全都照我的教學弄，但你要知道其所以然啊，不是光貼我的範例到你的範本裡，就一定會照你想像那樣顯示。我的每個 Hack 都有個但書，就是有的會依照每個人的樣板和樣式不同而有不同效果。首先，你的日曆是正常的，第一排之所以「看不到」，那是因為你模板用的顏色所致（你的模板第一行是「黑色」，去選擇反白，就看得到了）。
請看你原始碼：#CalendarTable table th { 這一段裡面的定義，根據範例你應該指到的顏色是 color: $sidebarcolor; ，$sidebarcolor 是模板顏色變數，在我的樣板裡是白色，但你樣板裡定義的卻是黑色，字的顏色和背景一樣，所以看不到。
解決辦法很簡單，你自己定義那個顏色（例如白色，你就改成 color: #ffffff; ），這樣就看得見了。
謝謝Abin，經過你清楚的解釋，我完全瞭解了！謝謝你不嫌棄我的問題；因為當時我弄好了月曆時，看到出了點小問題，我就慌了手腳了不知道該怎麼辦，所以沒有經過思考就先請教你了！不管怎麼樣，真的非常謝謝你！
abin站長您好，不好意思又來叨擾...QQ
之前照著這篇文章的指示還有一些回應的解說在自己的blog做好了月曆，一切完好，不過後來我陸續改了其他的部分後，今天突然發現日曆的顏色配置都消失了，甚至第一行星期數字跟下面的日期的對齊也有點跑掉了，但是我完全沒有修改日曆的css語法...用我另一個blog的沒有問題日曆語法來貼，問題還是存在，不知道是不是我在安裝其他功能的時候，不小心改錯了什麼...印象中沒有在碰觸任何跟日曆有關的語法...因為完全不到該從和處理，所以只好向站長求救了，也許abin站長會知道可能哪裡出了問題？QQ
因為我自己改了一大堆有的沒的，實在不敢奢望站長可以從我那堆亂七八糟的東西看出點端倪，如果可以給予任何建議的話，都非常感激不盡！
我的blog:
http://ffrxd.blogspot.com/
這是我自己瞎子摸象改出來的範本...如果有需要的話...=////////=
http://clumsy.fumiko.googlepages.com/template-2344932346576001252.xml
再次謝謝您！
To fumiko:
這種狀況是因為 CSS 樣式宣告重複，導致後來宣告的 CSS （可能是你其他裝的模組需要用的）去覆蓋掉原來日曆內關於顏色和對齊的樣式定義，影響的只有外觀，和功能無關。
你自己也清楚是因為套用太多模組和功能所致，我不可能一個個幫你 debug（我看了一下，實在太複雜啦），根本的方法是找出那個你最後加裝的功能（難搞是因為有些加裝的功能樣式還是外掛的 CSS 檔，很難追），用其他宣告方式去改那些模組內像是 table, td 這些個標籤的樣式，以後比較不會出現類似的問題（難度比較高，這也是我愛用自己寫的 hack，不愛去外連別人模組的原因）。
救急的辦法呢，強制在日曆標籤前更改樣式（這樣就不受後來定義的影響），舉個例子，像對齊的問題你可以把 out+='<table>'; 這一行，改成 out+='<table style="text-align:center;">'; 日曆的日期就可以解決了，但是顏色，你可能要一個一個地找出來改了（一樣手動指定顏色樣式）。
玩 Hack 就要有類似的覺悟，很多功能的寫法很不負責，像是無用的垃圾程式碼一堆、沒事用連結的方式外掛樣或宣告函式，套用後可能會影響別人的樣式、拖慢速度，嚴重一點還不能修復（所以要勤做備份），所以在使用這些模組前都要三思。
謝謝abin站長快速的回應，我想我真的是弄的一團混亂，最後乾脆全部從頭來過了，幸好我想要的「視覺效果」都有出現...像我這種程式小白果然是太貪心又太懶惰了...^^|||不知道藏了多少亂七八糟的語法在範本裡，也不太清楚怎麼刪減...QQ
總之真的非常感謝abin站長的教學，收穫良多！^^
此外參照abin的「在版面格式中放入小圖示」以及「調整 Post footer 的回應連結」的修改步驟，改成我想要的外觀，不過不知道為什麼用IE開啟的時候，「回應：」跟「張貼意見」前面的圖片沒有對齊...不知道問題出在哪裡，我兩個圖片的css定義明明是一樣的啊QQ不知道有沒有解決的辦法？還是說IE真的太爛了...= =|||
To fumiko:
對齊的問題在 IE 一直讓人很頭痛，有時候不管怎麼調看起來就是差一個 pixel。除了一直轉換語法、換別的 CSS，看能不能找出讓了個瀏覽器看起來「差不多」一樣，目前也沒有根絕的辦法了。
不好意思，想請教一下，
實在試不出第二步驟的CSS要放哪，
可不可以麻煩版主幫我看一下，感謝。
我的Blogger
我的模板
To clare:
第二個步驟放的 CSS 代碼，是關於樣式的宣告，只要是放在 <head> </head> 兩個標籤的中間就可以了，只要是放在這裡面，位置就是正確的。再者，CSS 只決定了「外觀樣式」，和「功能」沒關係，我不知道也看不出來，你所謂「試不出來」是外觀不對還是功能沒出來。
另外，你模板的連結不能使用，Blog 原始碼裡也沒有套用日曆功能的「痕跡」，要人家幫忙看好歹也要有「屍體」吧？
感謝版主超快速的回應^^
不好意思，小弟再放一次我的模板，
另外網也改成錯誤的狀態了，
因為看到前面有大大說網頁上方出現亂碼，
我想我的情況也是類似，我也找不到<style> 標籤，所以第2,3步驟我都是放在</head>前，感謝版主解答了^^
模板
To clare:
我知道原因了，之前的回應中我也有提到，這還是樣板不同導致的問題。我回應 megan 的留言中有講到，CSS 樣板裡有用到變數 $sidebarcolor 之類的，「並不是每種樣板都有這個變數」（像您樣板裡就沒有），所以如果你只是剪貼沒有修改，存檔時就會發生錯誤。這個問題在樣板不同又沒修正時就會碰到，好吧，我順手修改我文章的「範例」、把這種變數換掉（$sidebarcolor; 變成 #777;），讀者們「照貼」時就比較不會有這個狀況了。
另外，我看你的樣板，你那段 CSS 不只是應該放在 <head> 標籤中間，而還要是在 <b:skin> 裡面（這樣才不用找 style 標籤），你可以再試試看。
謝謝版大耐心的幫我解答，
但是小弟還是修改不成功^^"，
放在<b:skin>跟放在body{ 裡面都試過，
"Blog 存檔"的樣式還是沒有變成日曆，
如果版大有空，不嫌棄的話麻煩幫我看看^^
感謝了。
To clare:
我在第一次回應時就說到：CSS 只決定了「外觀樣式」，和「功能」沒關係。"Blog 存檔"的沒有變成日曆，不是樣式的問題，是功能根本沒有被觸發。
我看了你的 Blog，我覺得是你沒有去調整"Blog 存檔"所致。請仔細看我文章的第二段：
「首先，在你的 Sidebar 上面要至少有一個 "Blog 存檔" (Archive) 的網頁元素 (Element)，接下來去修改它的屬性，存檔頻率改成「每日」，勾選「先顯示最舊的文章」，樣式設成「Flat 清單」。」
你的 Blog 存檔屬性顯示的是「階層」，你並沒有去改成「Flat 清單」吧！請到「版面配置」、「網頁元素」裡，選擇你 ARCHIVED POSTS 這個元素旁的「編輯」，先去改你的屬性吧！
太感謝版大的解答了，
真是不好意思，一切都是小弟自己眼拙，
在版大的熱心指導下終於弄出日曆啦^^
再次感謝版大!!
謝謝你的文章！！成功修改了！^^
abin大你好,請問你說的”Sidebar 上面要至少有一個 "Blog 存檔" (Archive) 的網頁元素”該怎麼做呢?我不是很懂,我是blogger新手,可以向你請教嗎?感謝^^
To puppy:
登入 Blogger 的管理介面，版面配置->網頁元素裡面，在你想要放日曆、或是其他模組的區域（通常是左邊或右邊的區段、試樣板不同位置也不一樣，這就是 Sidebar），要至少新增一個「網頁存檔」網頁元素。
在搞 Blog Hack 之前，請先熟悉 Blogger 本身就提供的設定和管理介面，比較聽得懂別人在說什麼、也才能找出自己需要得畫面和功能。
abin大大你好,謝謝你的指導,我想我是知道那些功能,但是卻還不熟悉名稱,大大的指教讓我學到了東西,還請見諒我的打擾^^
Abin您好
載我樣化葫蘆calendar的時候，找不到b: includable 這一段，所以我貼在body的前面, 然而， 這樣預覽的時候會出現:
解譯網誌範本時發生錯誤
Unknown runtime binding: includable in widget
---------
請問是什麼問題? 我的網誌是http://shulammite-diaries.blogspot.com/
請不吝指教，謝謝您。
To shulammite:
「找不到 b:includable 這一段」？那你就不應該進行接下來的動作，因為這個 Hack 就是在修改「Blogger」專用的標籤和語法，亂貼在 Body 後面當然是錯的。
請先確定兩件事情，第一，你有加入「網站存檔」的網頁元素，第二，確定你在編輯的時候，有打開原始碼、而且有展開完整的範本（展開小裝置範本），以上一定就會有那一段、或類似的程式碼。
Dear Abin,
原來我的問題是沒有展開小範本，雖然我還不清楚為什麼有沒有小範本的原始碼會不一樣，不過總算是試成功了。謝謝您的指教，我會慢慢的學習的。 謝謝您
To shulammite:
「展開小裝置範本」意謂要一併修改那些 Blogger 內建的模組，在範本檔案裡才會一併顯示那些模組的設定程式碼。
這個日曆模組是透過修改 Blogger 內建的「網頁存檔」模組，將顯示的方式改成日曆模式，所以一定要展開小裝置的範本，才能看到要修改的程式區段。
請問如果要改變有文章的那天在日曆上的顏色，要怎麼改呢?
我試改了ccs 程式碼裡面所有的顏色
，怎麼動show出來都還是白色有底線..
To plumpbear:
「白色有底線」？那是因為有文章的日期，有「連結」的關係，你單純改字 CSS 顏色是不會有效果的。
因此你要改的是，另外去定義「連結」的樣式，像是這樣：
a:link {
color: #99aadd;
text-decoration: none;
}
「連結」才會沒有底線、不會是白色。
成功了!謝謝您的說明 :)
hi Abin, 我參考了你這個hack，做了一些修改，現在已不需要任何的 archive element，是利用 google 的 JSON feed
http://lvchen.blogspot.com/2008/07/blog-post_11.html
感謝您這篇文章給我一個好的開始。
To LVCHEN:
太強了！我剛剛試用了一下，您的作法正是我以前做這個 Hack 想達到的效果，可以不要用靜態的 archive、動態隨月抓取切換，有機會我也要來研究改版一下～
感謝您提供的資訊。
版主您好,我是剛入門blogger的新手,由於你的文章對我很受用,所以我在文章中有連到這篇教學,希望你能讓我做個連結,讓更多網友能看到這篇教學,感謝~~
To EATING:
連結轉載歡迎，記得標明引用的出處就好了～
版主請問一下,日曆上方<<2008-09>>,如果我想把他跟日期放在同一行而不是下一行才顯示日期,應該在那個部份做修改呢?還有"<<"這個部份想改掉應該在那裡修改呢?!我找好久啊 >< , 謝謝~~~
To 小筑:
我看了你的 Blog，你是想調整成 Timeline 形式的日曆，所以才會那個年月切換的部份移到同一行。樣式的問題很複雜，因為我是 Table 標籤來做，因此用了 Caption 和 TR 來做每行的分隔，只要有這幾個標籤，標題和日期就沒辦法在同一行。除非完全捨棄 Table 的格式、也沒有 BR, P 等換行分段標籤，才有可能在同一行（就是、要大改樣式和程式碼）。
至於第二個問題比較好解決，那個向左向右的雙箭頭，在程式碼裡用的是代碼（因為那個符號是保留字元），那兩個符號是在 title='Previous Month' 和 title='Next Month'這兩句的後面，你可以改成圖片或其他文字。
本來以為取消換行就可以了,原來如此啊,還是謝謝您的幫忙,哈^^",我會再試看看的,謝謝哩..
Abin版主可否幫我看一下我的blog的月曆為何無法顯示出超連結
只有單純的月曆而已，因為之前使用您的BlackCat2.5有改成功
但現在這個只能當月曆，沒有archive的功能
請您幫忙一下，感謝
To Miles2fly:
我看的時候你的月曆都有超連結啊 (Daily Archive)，不大懂你的意思。另外，我沒有寫過什麼「BlackCat2.5」，你應該是有地方搞錯了。
你好
不好意思想請教一下如何讓游標到有文章的日期上會顯示出標題呢?
我的是都會出現 日期:(沒有結果)
可是看你的好像都會出現文章的標題
是我哪裡弄錯了嗎??
張貼意見
歡迎留言或發表意見，不過要理性、不做人身攻擊。匿名的朋友得到回應的速度會比較慢喔～
發問相關的禮貌和規矩請先參考這篇文章，不當留言、和本文無關的回應可能會被直接刪除或無視喔！