ヘッダー画像の高さを調整する

SIRIUS2で追加されたレイアウト設定機能では、ヘッダー画像を横幅いっぱいに表示させる機能があります。
しかし、ヘッダー画像によっては画像の高さが大きくなりすぎてしまうケースもあります。
また「トップページでは大きくヘッダー画像を表示させ、他のページでは細いヘッダー画像にしたい」といった場面もあるかと思います。

これらの問題を解決するためには、SIRIUS2の「ヘッダー画像の高さ調整機能」を利用するのが便利です。
この機能を使うことで、ページの種類ごとにヘッダー画像の高さの最大値を指定することが可能となります。
使い方はとても簡単ですので、ぜひご利用ください。

ヘッダー画像の高さを指定したい場合、上部ツールバー上にある「テンプレート」→「ヘッダー画像の高さ調整」を選択してください。

下図のような「ヘッダー画像の高さ調整画面」が表示されますので、上部のタブから高さを指定するページを選択します。
この例では、エントリーページのヘッダー画像の高さを調整します。

PCとスマートフォンとで、それぞれヘッダー画像の高さを指定することができます。
ここではPC上でのヘッダー画像の高さを指定します。

「手動設定」の項目にチェックを入れると、「ヘッダーの高さ」の項目が有効になります。
プレビューを確認しながら、任意の数値を指定してください。

スマートフォンのヘッダーの高さも調整したい場合は、右側の画面で同じように設定を行います。
なおプレビュー画面の右側にある「スマホ表示」ボタンをチェックすると、プレビューをスマートフォンサイズにすることができます。

以上の手順で、ヘッダー画像の高さを調整することができます。
画面下部の「OK」ボタンをクリックし、実際のプレビューでサイトを確認してみましょう。