STEP2-6 (p105)
「アイキャッチ画像を利用し、記事ごとの画像を表示させる」
…という内容まで進みました。
アイキャッチ画像の機能を使うには、function.phpにおまじないを書いてあげないといけない。
おまじない
add_theme_support('post-thumbnails');
「function.php」
管理画面→投稿画面にアイキャッチ画像の追加欄が登場。
// アイキャッチ画像を利用できるようにします。
add_theme_support('post-thumbnails');
// アイキャッチ画像サイズ設定
set_post_thumbnail_size(90, 90 ,true);
// サイドバー用画像サイズ設定
add_image_size('small_thumbnail', 61, 61, true);
// アーカイブ用画像サイズ設定
add_image_size('large_thumbnail', 120, 120, true);
// サブページヘッダー用画像サイズ設定
add_image_size('category_image', 658, 113, true);
// モールイメージ用画像サイズ設定add_image_size('pickup_thumbnail', 302, 123, true);
アイキャッチ画像の諸々の設定をして、保存。
管理画面→投稿画面にアイキャッチ画像の追加欄が登場。
こんなことまで設定しないといけないのか( ﾟдﾟ )
いや、きっと公開されてるテンプレートには最初から備わっているはず…たぶん。
更に「投稿一覧ページに表示」させるために下記のタグを追加。
content-archive.php
<article <?php post_class(); ?>>
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('large_thumbnail', array('alt' =>
the_title_attribute('echo=0'), 'title' => the_title_attribute('echo=0'))); ?>
</a>
以後省略
なんだこれ…。
アイキャッチ画像のimgタグを出力する。ループ内限定。
上記リンク先より引用して整理すると、こう。
つまり、今回追加した内容は、
the_post_thumbnailの…
'large_thumbnail', までが第一引数。
「function.php」で設定した内容が引っ張られる。
// アーカイブ用画像サイズ設定add_image_size('large_thumbnail', 120, 120, true);
array('alt' => the_title_attribute('echo=0'), 'title' => the_title_attribute('echo=0'))までが第二引数。
第二引数を省略すると、alt属性・title属性は記事のタイトルを流用するみたい。
配列のarray()がサラッと登場して、やる気ダウン。
今日はここまで。
0 件のコメント:
コメントを投稿