【Twenty Twelve】タイトル文の下にヘッダー画像を表示する方法

Twenty Twelveのヘッダーは、上からタイトルのテキスト文と説明文、次にナビゲーション、最後にヘッダー画像の順に表示され、header.phpファイルにも、この順番で記述されています。

ヘッダーの表示を変更したときは、コードを編集しないで、この順番を入れ替えたり削除することで実現できます。

ナビゲーションの上にヘッダー画像表示

タイトルを表示するテキスト文は、hgroupタグの中に書かれているのでhgroup閉じタグの下に、以下のヘッダー画像表示用のコードを移動されることで、上からタイトル文、ヘッダー画像、ナビゲーションに順に表示することが出来ます。

<?php $header_image = get_header_image();
		if ( ! empty( $header_image ) ) : ?>
			<a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
		<?php endif; ?>

上から、タイトル文、ヘッダー画像、ナビゲーション（メニュー）に表示される画像例です。