アイキャッチ画像の表示がとても特徴的なWordPressテーマTwenty Fourteenですが、このアイキャッチ画像表示が必要ない方もいらっしゃると思います。
今回は、Twenty Fourteenのアイキャッチ画像表示を削除するカスタマイズを紹介します。
content.phpを編集
アイキャッチ画像表示をやめるのは1行の削除で可能です。子テーマでのカスタマイズの場合には、Twenty Fourteenのテーマディレクトリからcontent.phpを子テーマディレクトリにコピーをして修正を加えてください。
Twenty Fourteenを直接編集する場合には、twentyfourteenディレクトリ内のcontent.phpを直接編集してください。
下記の行を削除するだけでアイキャッチ画像の表示は削除されます。
<?php twentyfourteen_post_thumbnail(); ?> |

このままでも特に問題はないのですが、左の画像のタイトル上部やカレンダー上部の余白が広すぎるような気がします。
せっかくなので、この余白も調節したいと思います。
style.cssを編集
余分な余白の調節にはstyle.cssを編集します。子テーマディレクトリ内にあるstyle.cssに下記コードを加えます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | /* コンテンツ部分の上部余白を補正 */ .content-area { padding-top: 10px; } .site-content .has-post-thumbnail .entry-header { margin-top: 0; } /* サイドバー部分の上部余白を補正 */ .content-sidebar { padding-top: 10px; } /* スマホページの上部余白を補正 */ .singular .site-content .hentry.has-post-thumbnail { margin-top: 0; } |
Twenty Fourteenを直接編集している場合には、該当箇所を変更するか、style.cssの最下部に上記コードを追記してください。
最下部にコードを追記する方が簡単かもしれません。

アイキャッチ画像の独自表示はTwenty Fourteenの肝であり、それを削除してしまうのはちょっとアレな感じもしますが、毎回キレイにアイキャッチ画像を表示させるためには画像サイズをかなり気を付けなければなりません。
それが少々大変そうだったので、アイキャッチ画像を削除するカスタマイズに至りました。
感想
まだTwenty Elevenを試し始めたばかりなので、cssの作り方がハッキリと理解できません。まぁ、長く試し続けても私には理解はできませんが...(苦笑)
ほんの少し余白を削るだけのカスタマイズに、とても長い時間を費やしてしまいました。
そして、このTwenty Fourteenはデバイスに合わせて表示を変えることができます。
その分スタイルシートの変更箇所が多いので、カスタマイズには少々苦労しそうです...
しかし、とても使いやすいテーマであることも確かです。
引き続き便利にカスタマイズしていきたいと思います。
関連記事

WordPressのデフォルトテーマにも採用されたTwenty Fourteenの背景色を変更するカスタマイズの紹介です。意外と手こずるカスタマイズですので、参考になれば幸いです。

レスポンシブで使いやすいWordPressテーマTwenty Fourteenのヘッダー部分に、SNSアイコン画像を貼り付けるカスタマイズを紹介します。

Twenty Fourteenのトップページをカスタマイズし、アイキャッチ画像と記事タイトルの一覧にしスッキリとレイアウトにする方法を紹介します。