Twenty Tenテーマは「アイキャッチ画像」というのに対応しているので、管理画面から簡単にそのページごとにヘッダーの画像を変える事が出来ます。

今回は、ページで作ったABOUTのページに違う画像を適用してみようと思います。

アイキャッチ画像のアップロード

アイキャッチ画像を使いたいページの編集画面を開きます。右下に「アイキャッチ画像」というメニューがあります。そこの「アイキャッチ画像を設定」というリンクをクリックします。

そうすると、画像のアップロードの画面が開きますので、使いたい画像を選んで普通にアップロードします。

アイキャッチ画像として設定する

アップロードしたら、一番下の方に、「投稿に挿入」ボタンの隣に、「アイキャッチ画像として使用」という項目があります。そこを選ぶと．．．

このように管理画面にアイキャッチ画像として選んだ画像が表示されます。

実際にABOUTのページを見にいってみましょう。

このように表示されました。ページや投稿ごとに、細かくアイキャッチ画像を設定できますので、デザインにも幅が広がりますね。今回は、カスタマイズ、というより標準の使い方の解説になってしまったので、ひとつヒント、というか参考に書いておきます。

テーマファイルの中でのアイキャッチ画像の設定

Twenty tenでは、「header.phpの中で、『もし「アイキャッチ画像が設定」されていればそちらを、設定されていなければ「外観＞ヘッダー」で選んでいるイメージを表示するように』という命令文が書かれている訳です。68行目当たりからのこの部分ですね。
この辺にこんな風に設定されているんだな〜〜と何となく覚えておくとよいのではないかと思います。

<?php
					// Check if this is a post or page, if it has a thumbnail, and if it's a big one
					if ( is_singular() &&
							has_post_thumbnail( $post->ID ) &&
							( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'post-thumbnail' ) ) &&
							$image[1] >= HEADER_IMAGE_WIDTH ) :
						// Houston, we have a new header image!
						echo get_the_post_thumbnail( $post->ID, 'post-thumbnail' );
					else : ?>
						<img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />
					<?php endif; ?>