AfroNamiHeiの箱

スタイルシートで

• wp-calendar-horizontal（カレンダー全体を囲むp要素）
• cal-month（今月の月名の部分のspan要素）
• cal-prev-month（前月の月名の部分のspan要素）
• cal-next-month（次月の月名の部分のspan要素）
• today（今日の日付の部分のspan要素）

また、要素によっては以下のクラスを割り当てます。

• saturday（土曜日の日付のspan要素）
• sunday（日曜日の日付のspan要素）

を使用し編集できるようになってます。

horizontal_calendar.phpファイルを修正

WPTP-Chocolateテーマ用とし修正ですが、他のテーマと合わないのは位置修正部分ぐらいなので

ほとんどのソースはそのまま使えると思います。

各曜日のソースは既存のソース一部を利用して表示させ

カレンダーの位置はテーブルを使って修正。

76行から最後までがカレンダー表示部分になるのでこの範囲に手を加えます。
以下が76行からの全ソース

	echo "<div id=\"wp-calendar-horizontal\">";
echo '<table align="right"><tr><td class="month" colspan="15">';
	if ($previous) {
		echo "\t<span id=\"cal-prev-month\"><a href=\"" .
		get_month_link($previous->year, $previous->month) . '" title="' . sprintf(__('View posts for %1$s %2$s'), $wp_locale->get_month($previous->month),
			date('Y', mktime(0, 0 , 0, $previous->month, 1, $previous->year))) . '">&laquo; ' . $wp_locale->get_month_abbrev($wp_locale->get_month($previous->month)) . "</a></span>\n";
	}

	echo "\t<span id=\"cal-month\">" . date('Y', $unixmonth) . ' ' . $wp_locale->get_month($thismonth) . "</span>\n";

	// Get days with posts
	$dayswithposts = $wpdb->get_results("SELECT DISTINCT DAYOFMONTH(post_date)
		FROM $wpdb->posts WHERE MONTH(post_date) = '$thismonth'
		AND YEAR(post_date) = '$thisyear'
		AND post_type = 'post' AND post_status = 'publish'
		AND post_date < '" . current_time('mysql') . '\'', ARRAY_N);
	if ( $dayswithposts ) {
		foreach ( $dayswithposts as $daywith ) {
			$daywithpost[] = $daywith[0];
		}
	} else {
		$daywithpost = array();
	}

	if ( strstr($_SERVER['HTTP_USER_AGENT'], 'MSIE') || strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'camino') || strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'safari') )
		$ak_title_separator = "\n";
	else
		$ak_title_separator = ', ';

	$ak_titles_for_day = array();
	$ak_post_titles = $wpdb->get_results("SELECT post_title, DAYOFMONTH(post_date) as dom "
		."FROM $wpdb->posts "
		."WHERE YEAR(post_date) = '$thisyear' "
		."AND MONTH(post_date) = '$thismonth' "
		."AND post_date < '".current_time('mysql')."' "
		."AND post_type = 'post' AND post_status = 'publish'"
	);
	if ( $ak_post_titles ) {
		foreach ( $ak_post_titles as $ak_post_title ) {
				if ( empty($ak_titles_for_day['day_'.$ak_post_title->dom]) )
					$ak_titles_for_day['day_'.$ak_post_title->dom] = '';
				if ( empty($ak_titles_for_day["$ak_post_title->dom"]) ) // first one
					$ak_titles_for_day["$ak_post_title->dom"] = str_replace('"', '&quot;', wptexturize($ak_post_title->post_title));
				else
					$ak_titles_for_day["$ak_post_title->dom"] .= $ak_title_separator . str_replace('"', '&quot;', wptexturize($ak_post_title->post_title));
		}
	}

echo "</td>\n";

echo '<td colspan="20" align="right">';
	if ($next) {
		echo "\t<span id=\"cal-next-month\"><a href=\"" .
		get_month_link($next->year, $next->month) . '" title="' . sprintf(__('View posts for %1$s %2$s'), $wp_locale->get_month($next->month),
			date('Y', mktime(0, 0 , 0, $next->month, 1, $next->year))) . '">' . $wp_locale->get_month_abbrev($wp_locale->get_month($next->month)) . ' &raquo;</a></span>' ."\n";
	}
echo "</td>";
echo '<td width="10%"></td>';
echo "</tr><tr>\n";

	$daysinmonth = intval(date('t', $unixmonth));
	for ( $day = 1; $day <= $daysinmonth; ++$day ) {
echo "<td>";
		if ( 0 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">月';
		}
		else if ( 1 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">火';
		}
		else if ( 2 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">水';
		}
		else if ( 3 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">木';
		}
		else if ( 4 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">金';
		}
		else if ( 5 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "w-saturday">土';
		}
		else if ( 6 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "w-sunday">日';
		}
		echo "</span></td>\n";

	}

echo "</tr><tr>\n";

	$daysinmonth = intval(date('t', $unixmonth));
	for ( $day = 1; $day <= $daysinmonth; ++$day ) {
echo "<td>";
		if ( 5 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
			$span_class = ' class="saturday"';
		}
		else if ( 6 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
			$span_class = ' class="sunday"';
		}
		else {
			$span_class = '';
		}
		if ( $day == gmdate('j', (time() + (get_option('gmt_offset') * 3600))) && $thismonth == gmdate('m', time()+(get_option('gmt_offset') * 3600)) && $thisyear == gmdate('Y', time()+(get_option('gmt_offset') * 3600)) )
			echo "\t" . '<span id="today">';
		else
			echo "\t<span${span_class}>";
		if ( in_array($day, $daywithpost) ) // any posts today?
				echo '<a href="' . get_day_link($thisyear, $thismonth, $day) . "\" title=\"$ak_titles_for_day[$day]\">$day</a>";
		else
			echo $day;
		echo "</span></td>\n";

	}

echo "</td></tr></table>\n";
	echo "</div>\n";

	$output = ob_get_contents();
	ob_end_clean();
	echo $output;
	$cache[ $key ] = $output;
	wp_cache_set( 'get_calendar_horizontal', $cache, 'calendar' );
}
?>

青が変更箇所で赤が追加または移動です。

簡単に説明

青のdivタグはもともとpタグでした。その後tableタグで表示部分を囲っています。

カレンダーの横位置はテーブルタグ内にあるダミーで設置しているセルの大きさで決めるようにしています。

echo '<td colspan="20" align="right">';
	if ($next) {
		echo "\t<span id=\"cal-next-month\"><a href=\"" .

数値20を大きくすると左へ行くと思います。

テーブルの1行目を月の表示にするため

前月や今月の表示部分の後に次月表示部分

	if ($next) {
		echo "\t<span id=\"cal-next-month\"><a href=\"" .
		get_month_link($next->year, $next->month) . '" title="' . sprintf(__('View posts for %1$s %2$s'), $wp_locale->get_month($next->month),
			date('Y', mktime(0, 0 , 0, $next->month, 1, $next->year))) . '">' . $wp_locale->get_month_abbrev($wp_locale->get_month($next->month)) . ' &raquo;</a></span>' ."\n";
	}
	echo "</p>\n";

を移動させtdタブで囲んでいる。

テーブルの2行目は曜日を並べるために日付を表示しているソースを利用し

	$daysinmonth = intval(date('t', $unixmonth));
	for ( $day = 1; $day <= $daysinmonth; ++$day ) {
echo "<td>";
		if ( 0 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">月';
		}
		else if ( 1 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">火';
		}
		else if ( 2 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">水';
		}
		else if ( 3 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">木';
		}
		else if ( 4 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "weekday">金';
		}
		else if ( 5 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "w-saturday">土';
		}
		else if ( 6 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
		echo '<span class = "w-sunday">日';
		}
		echo "</span></td>\n";

	}

を作成しtrタグで囲んでいます。

以上のソースや以下のソース

	$daysinmonth = intval(date('t', $unixmonth));
	for ( $day = 1; $day <= $daysinmonth; ++$day ) {
		if ( 5 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
			$span_class = ' class="saturday"';
		}
		else if ( 6 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) {
			$span_class = ' class="sunday"';
		}
		else {
			$span_class = '';
		}
		if ( $day == gmdate('j', (time() + (get_option('gmt_offset') * 3600))) && $thismonth == gmdate('m', time()+(get_option('gmt_offset') * 3600)) && $thisyear == gmdate('Y', time()+(get_option('gmt_offset') * 3600)) )
			echo "\t" . '<span id="today">';
		else
			echo "\t<span${span_class}>";
		if ( in_array($day, $daywithpost) ) // any posts today?
				echo '<a href="' . get_day_link($thisyear, $thismonth, $day) . "\" title=\"$ak_titles_for_day[$day]\">$day</a>";
		else
			echo $day;
		echo "</span>\n";

	}

が日付を表示するソースなどとわかれば後は位置関係と

スタートする曜日の収得方法だけです。

style.cssファイルの修正

スタイルシートも修正し以下のようにしてます。

#wp-calendar-horizontal {
	font-family: 'Georgia', sans-serif, Verdana, "Times New Roman", Times, serif;
	float: left;
	width: 922px;
	background: url(images/content.jpg) repeat-y;
	position: relative;
	margin : 0;
	padding : 3px 0;
	font-size: 14px;
}
#wp-calendar-horizontal .weekday {
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Meiryo,Verdana,'ＭＳ Ｐゴシック',sans-serif;
	color : #333333;
}
#wp-calendar-horizontal .w-saturday {
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Meiryo,Verdana,'ＭＳ Ｐゴシック',sans-serif;
	color : #0000ff;
}
#wp-calendar-horizontal .w-sunday {
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Meiryo,Verdana,'ＭＳ Ｐゴシック',sans-serif;
	color : #ff0000;
}
#wp-calendar-horizontal a {
	color : #393328;
	background : #eeeeee;
}
#wp-calendar-horizontal a:hover {
	color : #ffffff;
	background : #393328;
}
#wp-calendar-horizontal .saturday {
	color : #bbbbff;
}
#wp-calendar-horizontal .saturday a:link,
#wp-calendar-horizontal .saturday a {
	color : #0000ff;
}
#wp-calendar-horizontal .sunday {
	color : #ffbbbb;
}
#wp-calendar-horizontal .sunday a:link,
#wp-calendar-horizontal .sunday a {
	color : #ff0000;
}
#today {
	border : 2px solid #0000aa;
}
td.month {
color: #222222;
}

赤が独自に付け加えた要素です。

あまり美しいソースにはなってないかもですが。