ブログのカレンダーで見かけるのは7×4、5のマスになったタイプ。
たまに見かけるカレンダータイプで横型や縦型がWordPressのプラグインでないか探して見ました。
それが見つかればサイドバーの節約にもなるし。
デザイン的に合うならそれを使いたいと・・・。
っで、ありました。
しかも日本製。
「横型カレンダープラグイン for WordPress」でHorizontal Calendarと言うプラグイン名になります。
ダウンロードは
横型カレンダープラグイン for WordPress(WP2.3/2.5対応版) – The blog of H.Fujimoto
から
HorizontalCalendar_1_01.zip
を、ダウンロードです。
インストール、有効といつもの工程を済ませたら設置の作業に移ります。
<?php get_calendar_horizontal(); ?>をどこかに追加するわけですが
本家サイトではデフォルトテーマの設置紹介をしています。
AfroはWPTP-Chocolateテーマを使用しているので少々変わります。
header.phpファイルで設置する場合
しっくりきそうな場所は、header.phpファイルの下の方にある
<div class="page-navigator">
直後に
<?php get_calendar_horizontal(); ?>
を追加するのがよさそうです。
header.phpに追加してみた場合
左サイドバーに頭が突っ込んでますが、スタイルシートとかで位置は修正できるかもです。
index.phpファイルで設置する場合
<div id="main-content">
と
<div id="post-entry">
の間に
<?php get_calendar_horizontal(); ?>
を追加です。
index.phpに追加してみた場合
index.phpファイルしか追加してない場合だと、単体ページやアーカイブなどでページを切り替えるとカレンダーは見えなくなることに。
なので、各ページにもカレンダー表示させたい場合は、single.phpファイルやcomments.phpファイル、archive.phpファイル等も編集することになります。
設置が済んだらスタイルシートです。
Afroはstyle.cssファイルの最後の行から以下を追加しました。
#wp-calendar-horizontal {
font-size: 12px;
background-color : #ffffdd;
text-align : center;
}
#wp-calendar-horizontal a:hover {
color : #ffffff;
text-decoration : underline;
background-color : #8b4513;
}
#wp-calendar-horizontal .saturday,
#wp-calendar-horizontal .saturday a {
color : #0000ff;
}
#wp-calendar-horizontal .sunday,
#wp-calendar-horizontal .sunday a {
color : #ff0000;
}
#today {
background-color : #debb87;
border : 1px solid #ff9900;
}
とりあえずこれで完了。
引用、参考サイトは以下
横型カレンダープラグイン for WordPress(WP2.3/2.5対応版) – The blog of H.Fujimoto
横型のカレンダーを表示してくれるプラグイン | Tips Community