WordPressテーマの「STINGER3」を利用して、色々とカスタマイズしています。
今回は、記事のトップにアイキャッチ画像を表示する方法について書きたいと思います。
アイキャッチ画像について
アイキャッチ画像とは
「ブログ記事の顔」となる画像のことです。
大抵のブログで使われているので分かるかと思いますが、ブログの訪問者などに「この記事が読みたい！」と思わせるために、記事ごとに設定する画像のことです。
記事の内容をイメージできるような画像がよく使われます。
訪問者の”目を惹きつける”ということで、”アイキャッチ”画像というわけです。
「STINGER3」におけるアイキャッチ画像の役割
WordPressテーマ「STINGER3」において、アイキャッチ画像の役割は大きいものです。
STINGER3では、アイキャッチ画像を表示する領域があらかじめ確保されており、設定していないと「NO IMAGE」というつまらない画像が表示されます。
このような「NO IMAGE」がたくさん並んだブログ、なんだか味気ない気がします。
そのため、STINGER3を利用する方は「アイキャッチ画像を設定する」ように気を付けているのではないでしょうか？
アイキャッチ画像を記事トップに表示する
テーマを編集する
WordPressの「外観」－「テーマ編集」から、「単一記事の投稿(single.php)」を編集します。
<?php the_content(); ?>と書かれている部分（記事本文が表示されるところ）を探して、その上に次のようなコードを追加します。
<p>
<?php the_post_thumbnail('medium'); ?>
</p>
「medium」という部分は、ミディアム。
つまり、「中サイズ(300px)」ということを示しています。
画像サイズを変更する
「medium」の部分を変更することで、サイズを変えることができます。
the_post_thumbnail(); // パラメータなし -> サムネイル
the_post_thumbnail('thumbnail'); // サムネイル
the_post_thumbnail('medium'); // 中サイズ
the_post_thumbnail('large'); // 大サイズ
the_post_thumbnail( array(100,100) ); // 他のサイズ
コメント