Twenty Twelve アイキャッチ画像のサイズと表示位置を変える

sponsored link

前述した抜粋表示での表示は、トップページ(アーカイブページ)の抜粋内部に画像を表示させ、記事(シングルページ)内にはアイキャッチは表示していません。

アイキャッチ画像に記事内の画像を使うようにしている場合は、わざわざ記事内にアイキャッチ画像を表示させる必要もないのと、トップページやアーカイブページのデザイン装飾のために、記事に関連する画像やカテゴリごとの画像を適当に用意している場合は、わざわざそれを記事内に表示させるほどでもないかな?とは思っています。

ニュースサイトなんかでは、ペタペタ画像は貼らずに小さな画像を左上に表示させたりしているかもしれませんが。

個人的にやりたいことは実現できたのですけれど、一応もう1つのパターンの説明。

表示場所の変更(全文表示)

<div class="entry-content"><?php the_post_thumbnail('thumbnail'); ?>

抜粋表示の時に挿入した場所のちょっと下にentry-contentとあるので、その次に同じようにアイキャッチのコードを挿入するだけ。

レイアウトの設定

.entry-content .attachment-thumbnail {
  float: left;
  margin-right: 15px;
  margin-bottom: 10px;
}

CSSにレイアウト設定のコードを追加。画像の横に文章を回り込ませます。

こちらのパターンの場合、抜粋表示にしているとアイキャッチは表示されません。また、記事内(シングルページ)にもアイキャッチが表示されます。

sponsored link

コメントを残す

メールアドレスが公開されることはありません。