アイキャッチ画像を設定しているのにカバーに表示されない

A. カスタマイザーの「Title Position」が Cover になっているか確認してください。設定が Standard のままだとカバーエリア自体が表示されません。

カバーの高さを画面全体にしたい

A. Cover Height の入力欄に 100vh と入力することで、ビューポート全体の高さに対応したカバーを設定できます。ただし、ヘッダーの高さ分がずれる場合は調整してください。

A. カスタマイザーの「Post → Title → Color」から変更できます。Coverモードでは白（#ffffff）が読みやすいケースがほとんどですが、明るいオーバーレイを使う場合はブランドカラーに合わせて調整してください。

「WordPressの記事タイトルをもっとおしゃれに見せたい」「カバー画像付きのヘッダーを実装したいけど難しそう…」と感じていませんか？

Apuraテーマなら、コードを一切書かずにカバー画像付きのタイトルセクションを設定できます。この記事では、タイトル表示位置の切り替えから、カバー画像・オーバーレイカラーの調整まで、ステップごとにわかりやすく解説します。

この記事はApura v1.2.0以降を対象にしています。お使いのテーマが古い場合は、WordPress管理画面の「外観 → テーマ → 更新」から最新版に更新してください。

Apuraでは、投稿・固定ページのタイトル表示エリアを「タイトルセクション」と呼びます。デフォルト（Standard）では通常のテキストタイトルが表示されますが、Coverモードに切り替えると、アイキャッチ画像をフルワイドで背景に広げた、インパクトのあるヘッダーデザインになります。

設定できる項目は大きく4つです。

設定項目	説明
Title Position	Standard（通常）またはCover（カバー画像付き）を選択
Cover Height	カバーエリアの高さをpxまたはvhで指定
Overlay Color	画像の上に重ねるカラーと透明度
Title Typography / Color	カバー上に表示するタイトルのフォントと文字色

設定はカスタマイザーから行います。以下の手順で進めてください。

カスタマイザーを開く

WordPress管理画面から「外観 → カスタマイズ」を選択してカスタマイザーを開きます。
投稿設定を開く

左パネルの「Post」または「投稿」セクションをクリックします。固定ページに設定する場合は「Page」を選びます。
Title セクションを選択する

Post設定内の「Title」タブをクリックします。ここにTitle Positionの選択肢が表示されます。
Title Position を Cover に変更する

「Title Position」ドロップダウンを Standard から Cover に切り替えます。プレビューエリアに即時反映されるので、見た目を確認しながら調整できます。
各オプションを調整して保存する

Cover Height、Overlay Color、Typography などを好みに合わせて設定したら、左上の「公開」ボタンをクリックして保存します。

カバーモードでは、各投稿に設定したアイキャッチ画像が自動的に背景として使われます。アイキャッチ画像の設定は、記事の編集画面右サイドバーの「アイキャッチ画像」から行います。

アイキャッチ画像が設定されていない場合、カバーエリアの背景は単色（Overlay Colorの設定色）になります。テーマの設定でフォールバック画像を指定することも可能です。

推奨する画像サイズは以下のとおりです。

カバー画像の上に色を重ねる「オーバーレイカラー」は、タイトル文字を読みやすくするために欠かせない設定です。画像の明暗によって適切な設定が異なります。

明るい画像の場合：黒（#000000）を透明度40〜60%でオーバーレイし、タイトルを白文字にすると読みやすくなります。

暗い画像の場合：オーバーレイを薄くするか、ブランドカラーを20〜30%の透明度で重ねると統一感が出ます。

カラーなし：0%（透明）にすると画像をそのまま表示します。写真の世界観を活かしたいときに有効ですが、白い背景の写真だとタイトルが見えにくくなるため注意してください。

カスタマイザーの設定はサイト全体に適用されますが、特定の投稿だけ別のスタイルにしたい場合は、投稿編集画面のサイドバーから個別に上書き設定できます。

投稿の編集画面を開き、右サイドバーの「投稿タブ → Apura設定」を展開すると、Title Position を記事単位で変更できます。たとえば、通常はStandardで運用しながら、特集記事だけCoverを使うといった運用が可能です。

ブログ記事 → Standard（シンプルで読み始めやすい）

特集・まとめ記事 → Cover（視覚的インパクトで差別化）

固定ページ（About / Contact など） → Cover（ブランドイメージを強調）

: カスタマイザーの「Title Position」が Cover になっているか確認してください。設定が Standard のままだとカバーエリア自体が表示されません。
: Cover Height の入力欄に 100vh と入力することで、ビューポート全体の高さに対応したカバーを設定できます。ただし、ヘッダーの高さ分がずれる場合は調整してください。
: カスタマイザーの「Post → Title → Color」から変更できます。Coverモードでは白（#ffffff）が読みやすいケースがほとんどですが、明るいオーバーレイを使う場合はブランドカラーに合わせて調整してください。

Apuraテーマのタイトルセクション設定を使えば、コードなしでプロフェッショナルなカバー画像付きヘッダーを実装できます。要点を整理すると：

カバーモードを活用して、読者の第一印象をぐっと高めるサイト作りに挑戦してみてください。