中級者向け：「カバー」ブロックのカスタマイズ

「新しいページを作成する」では、サイト訪問者の目を惹く「カバー」ブロックの設定について解説しました。
カバーブロックの利用に慣れてきたら、カスタマイズに挑戦してみましょう。

画像：カスタマイズ例

選んだ画像が大きく、表示させたい部分からずれてしまったときは、画面右側のメニュー「メディア設定」から「焦点ピッカー」を利用します。

画像がプレビュー表示されている中央に「〇」が表示されているので、ドラッグ＆ドロップで希望の位置に移動させましょう。

タイトルを目立たせるため、「カバー」ブロックで設定した画像にはデフォルトで黒っぽいフィルターがかかります。この設定は、画面右側のメニュー「オーバーレイ」から変更できます。

「オーバーレイ」の中の項目「色」で設定します。

「単色」は、単一の色を選びます。あらかじめパレットに表示されている色を選ぶか、「カスタムカラー」をクリックしてお好みの色を選びましょう（図3参照）

「グラデーション」を選ぶと、2色以上のグラデーションからなる色を重ねることができます。あらかじめパレットに表示されているグラデーションを選びます。

グラデーションに使う色を変更するには、パレットで選択した色の下に表示される色設定のバーをクリックします。グラデーションの始まり、終わりのほか、中間に入れる色も決められます。

オーバーレイの濃さを変更するには「不透明度」から設定します。

デフォルトは50（％）とされています。バーの上の「〇」をドラッグ＆ドロップで移動させたり、バーの右側の数値を変更して希望の濃さに調整しましょう。

サイト全体で決められているテーマカラーやシステムとの兼ね合いから、できないカスタマイズもあります。例えば以下のカスタマイズができません。あらかじめご了承ください。

タイトル全体の色を変えるには、画面右側のメニュー「色設定」から行います。

色設定の項目をクリックすると「文字色」を選べるようになるので、希望の色を設定します。あらかじめ表示されているパレットから選ぶことができるほか、「カスタムカラー」をクリックして自由に色を選ぶこともできます。

タイトルのうち１文字だけなど、部分的に色を変更する場合には、タイトルの枠に付属するメニューから指定します。

① タイトルをクリックして、色を変えたい部分だけ選択状態にします。

② タイトルの枠に付属しているメニューから、下矢印をクリックして、隠れているメニューを表示します。

表示されたメニューの中から「文字色」をクリックして、希望の色を指定しましょう。

あらかじめ表示されているカラーパレットから選べるほか、「カスタムカラー」をクリックして自由に選ぶこともできます。

テキストの背景だけ色を変えるには、画面右側のメニュー「色設定」から行います。

色設定の項目をクリックすると「背景色」を選べるようになるので、希望の色を設定します。

文字色と同様に、あらかじめ表示されているカラーパレットから選ぶことができるほか、「カスタムカラー」をクリックして自由に色を選ぶこともできます。

タイトル以外にもテキストを追加することができます。

メインとなるタイトルの末尾をクリックして、Enter を押してみましょう。タイトルの下に「段落」ブロックが追加されます（図10参照）

通常の段落と同じように入力、編集します。

カバーブロックの役割は、あくまでも目を惹きつけることです。ブロックの中の情報量が多くなりすぎないように気を付けましょう。

タイトル、サブタイトル（追加した場合）はそれぞれで配置を変更することができますが、カバーブロックではユニークな位置に設定することもできます。

① カバーブロックをクリックして、枠に付属しているメニューから「コンテンツ位置を変更」というアイコンをクリックします（図13参照）

クリックすると、9つの点が並んだメニューが表示されます。

② 表示された9つの点は、カバーブロックの中におけるコンテンツの位置（今回の場合は、タイトルとサブタイトル）を表しています。

例えば、コンテンツを左上に移動したい場合は、9つの点から左上の点をクリックします。