●月送りリアルタイムカレンダーに休日表示追加
小粋空間さんの休日表示付リアルタイムカレンダー（Movable Type）を読み早速挑戦。
実は昨日から何度も挑戦してみるものの、一向にうまくいかない。
月送りリアルタイムカレンダーで、PHP化しているのだけど、
7項の意味がよくわからない。。。
ステータスバーにエラー表示が出ているから
どこか間違っているのは間違いないのだけど。
今朝、もう一度と思い、コメント欄をよく読みなおしてみた。
すると24日の午前1:01、私があきらめて寝た後のharryさん宛のyujiroさんの書き込みを見てやっと理解し解決!!!
忘れるといけないので、手順どおりに残しておこう。。
１．休日表示用カレンダースクリプトのダウンロード
２．スクリプトの文字コードを「EUC-JP」へ変更
３．スクリプトのアップロード
４．カレンダーアーカイブテンプレートの変更
下記を<head>のすぐ後に追加
<script type="text/javascript" src="<$MTBlogURL$>dayChecker.js"></script>
次に
<table summary="Monthly calendar with links to each day's posts">
を
<table summary="<$MTArchiveDate format="%Y/%m"$>">
に変更。
そして下記を</body>の直前に追加した。
<script type="text/javascript">
function setWeekendAndHoliday(y,m) {
var elements = document.getElementsByTagName("table");
for (j = 0; j < elements.length; j++) {
var element = elements[j].getAttribute("summary");
var year = element.split("/")[0];
var month = element.split("/")[1];
if(!(year == y && month == m)){
continue;
}
var spans = elements[j].getElementsByTagName("span");
var day;
for (i = 0; i < spans.length; i++) {
if (spans[i].parentNode.nodeName == "TD") {
if(spans[i].innerHTML.indexOf("href") != -1){
day = spans[i].getElementsByTagName("a")[0].innerHTML;
} else {
day = spans[i].innerHTML;
}
if (isHoliday(year, month, day)) {
spans[i].setAttribute('class', 'holiday');
spans[i].setAttribute('className', 'holiday');
} else if(isSaturday(year, month, day)) {
spans[i].setAttribute('class', 'saturday');
spans[i].setAttribute('className', 'saturday');
}
if (isToday(year, month, day)) {
spans[i].parentNode.setAttribute('class', 'today');
spans[i].parentNode.setAttribute('className', 'today');
}
}
}
}
}
setCurrentDate();
setWeekendAndHoliday('<$MTArchiveDate format="%Y"$>','<$MTArchiveDate format="%m"$>');
</script>
５．カレンダー用スタイルシートに追加
最後にcalendar.cssの最後の
.today {
border : 1px solid #FF9900 /* 枠線をつける設定 */
}
を下記に変え
.today {
display: block;
border : 1px solid #FF9900 /* 枠線をつける設定 */
}
さらにその下に下記を追加
.holiday {そして再構築して完了!!!
color: #e50003;
}
.saturday {
color: #0000ff;
}
できたぁ！
一時はあきらめかけていただけにうれしい。 ≪ 続きを隠す
コメントをどうぞ