WordPressのイベントカレンダープラグイン
WordPressでイベント管理をしたい時、カレンダーが表示されて、該当の日付をクリックすると、イベントの詳細記事ページへ飛ぶプラグインです。
カスタム投稿にはなりません。
Event Calendar 3 について
このカレンダープラグインはphpのバージョンによって2種類あるので注意。
両方とも使っていますが、今のところ問題なく使えています。
バージョンとは関係なく、利用サンプルをご覧いただくと、
ライフサポート ワーカーズ・コレクティブ樹(アーブレ)さん。フッターの「講座スケジュール」で利用しています。
いたばし総合ボランティアセンターさん。トップページの「イベントカレンダー」で利用しています。
このいたばし総合ボランティアセンターさんの土日の色付けはCSS3を使いました。
E:nth-child(n) n番目の子となるE要素
E:nth-last-of-type(n) 後ろから数えてn番目のその種類の要素
cssソースは参考までに。template-functions.phpファイルのtableとtbodyにはクラスをつける必要があります。
#wp-calendar table.schemon tbody.anoc td {
padding:5px 0;
border:none;
}
#wp-calendar table.schemon tbody.anoc td {
border-top:1px #bad966 solid;
border-left:1px #bbeae8 solid;
}
#wp-calendar tbody.anoc tr:nth-child(1) td {
border-top:none;
}
#wp-calendar td:nth-child(7) {
background-color:#f8c1d4;
}
#wp-calendar td:nth-child(6) {
background-color:#bdeafd;
}
#wp-calendar tbody.anoc tr:nth-child(1) td:nth-last-of-type(3) {
background-color:#bdeafd\9;
}
#wp-calendar tbody.anoc tr:nth-child(1) td:nth-last-of-type(3):not(:target){
background-color:#ffffff\9; /* IE9 */
}
#wp-calendar tbody.anoc tr:nth-child(1) td:nth-last-of-type(2) {
background-color:#bdeafd;
background-color:#f8c1d4\9;
}
#wp-calendar tbody.anoc tr:nth-child(1) td:nth-last-of-type(2):not(:target){
background-color:#bdeafd\9; /* IE9 */
}
#wp-calendar tbody.anoc tr:nth-child(1) td:nth-last-of-type(1) {
border-left:1px #fff solid;
background-color:#f8c1d4;
}
#wp-calendar tbody.anoc tr:nth-child(2) td:nth-last-of-type(1) {
border-left:1px #fff solid;
background-color:#f8c1d4;
}
#wp-calendar tbody.anoc tr:nth-child(3) td:nth-last-of-type(1) {
border-left:1px #fff solid;
background-color:#f8c1d4;
}
#wp-calendar tbody.anoc tr:nth-child(4) td:nth-last-of-type(1) {
border-left:1px #fff solid;
background-color:#f8c1d4;
}
#wp-calendar tbody.anoc tr:nth-child(5) td:nth-last-of-type(1) {
border-left:1px #fff solid;
background-color:#f8c1d4;
}
#wp-calendar tbody.anoc tr:nth-child(1) td:nth-child(1) {
border-left:none;
}
#wp-calendar tbody.anoc tr:nth-child(2) td:nth-child(1) {
border-left:none;
}
#wp-calendar tbody.anoc tr:nth-child(3) td:nth-child(1) {
border-left:none;
}
#wp-calendar tbody.anoc tr:nth-child(4) td:nth-child(1) {
border-left:none;
}
#wp-calendar tbody.anoc tr:nth-child(5) td:nth-child(1) {
border-left:none;
}
#wp-calendar table.schemon tbody.anoc td.pad {
background-color:none;
background-color:#fff !important;
}

