ブロック

ブロック »カバーブロック

「カバーブロック」を追加すると、スマートでプロフェッショナルな外観の投稿またはページができます。

カバーブロックを追加する

「+ 挿入」アイコンをクリックして開始します。新しい段落ブロックに「/cover」と入力し、Enter キーを押して簡単に追加することもできます。

スラッシュコマンド「/cover」を使用してカバー画像を挿入します。
スラッシュコマンド「/cover」を使用してカバー画像を挿入します。

ブロックを追加する手順については、こちらを参照してください。


画像を追加

ブロックを作成すると、「アップロード」「メディアライブラリ」の2つのオプションが表示されます。「アップロード」では、デバイスに保存されている新しい画像をアップロードできます。「メディアライブラリ」では、サイトの「メディアライブラリ」にアップロードされている画像を選択できます。


テキストとその他のコンテンツを追加する

カバー画像を選択したら、その画像にタイトルを付けます。例えば、投稿またはページの新しいセクションのタイトルを付ける場合に使用できます。「ボタンブロック」「段落ブロック」などの他のブロックを追加して、「カバーブロック」の上に表示することもできます。


ブロックツールバー

各ブロックに独自のツールバーアイコンとユーザーコントロールが備わっており、エディターで直接ブロックを編集できます。

カバーブロックには多くのツールバーオプションがあります。
「カバーブロック」には多くのツールバーオプションがあります。
配置

他の多くのブロックと同様に、ツールバーを使用して「カバーブロック」を左、右、中央に配置できます。左または右を使用した場合、「カバーブロック」の横に別のブロックを配置できます。

「カバーブロック」は「幅広」および「全幅」でも配置でき、独自のヘッダーやワイドスクリーン効果を作成する際に便利です。これら2つのオプションは、テーマによっては使用できない場合があります。

幅広はカラムの境界線を超えるだけですが、全幅はページの幅全体に広がります。
幅広はカラムの境界線を超えるだけですが、全幅はページの幅全体に広がります。
コンテンツ位置

「コンテンツ位置」オプションを使って、テキストと他のコンテンツを画像の上のどこに表示するかを調整できます。

カバーブロック - コンテンツ位置オプション
コンテンツ位置を使ってブロック内のコンテンツを移動
画像を置換

カバーブロックツールバーのもう1つのオプションです。「置換」を使って、ブロックに新しい画像ファイルを選択できます。カバーブロック内の画像を差し替える必要がある場合に使用します。


ブロック設定

すべてのブロックには、ブロックツールバーのオプションに加えて、エディターのサイドバーに独自のオプションがあります。サイドバーが表示されない場合は、「公開」ボタンの隣にある歯車アイコンをクリックしてください。

ブロック設定はサイドバーに表示されます。
ブロック設定はサイドバーに表示されます。
スタイル

「カバーブロック」設定の「スタイル」を使って、カバー画像の上または下に波型の効果を追加できます。

固定背景

サイドバーのブロック設定には、固定背景の切り替えがあります。固定背景をオンにすると、カバー画像はページとともにスクロールします。固定背景をオフにすると、画像は定位置に埋め込まれるためスクロールしません。

カバーブロックを固定画像にします。
カバーブロックを固定画像にします。
アイキャッチ選択プログラム

固定背景オプションをオフにすると、アイキャッチ選択プログラムが表示されます。このツールは、写真の主に中心となる部分を特定し、そこに焦点を合わせます。アイキャッチ選択プログラムをクリックして必要な部分にドラッグするか、下にある水平および垂直位置パーセンテージを使って手動で設定します。

サイズ

カバー画像の最小の高さを設定できます (ピクセル単位)。これにより、ページを閲覧している人が使っている画面のサイズに関係なく、常に設定した高さ以上で画像が表示されるようになります。

オーバーレイの色

オーバーレイの色オプションを使用して、カバー画像にカラーオーバーレイを追加できます。デフォルトではグレーの透明なオーバーレイですが、オーバーレイの色オプションを使用すると、好きな色を選択して変更できます。

カラーオーバーレイを追加して、透過率を設定します。
カラーオーバーレイを追加して、透過率を設定します。
透過率

スライダーを使用して、カバー画像のオーバーレイの透過率を設定します。スライダーを 100 の方向に動かすとオーバーレイは暗く不透明になり、0 の方向に動かすとオーバーレイは明るく透明になります。100 にすると、オーバーレイは完全に不透明になり、表紙の画像は表示されません。0 にすると、オーバーレイは完全に消え、画像のみが残ります。

カバー画像にタイトルを追加する場合は、タイトルを読みやすくするためにオーバーレイをある程度不透明にすることを推奨します。


カバーブロックの動画

プレミアムビジネスeコマースプランのサイトの場合は、カバーブロックに動画を使えます。.mp4 形式の動画が最適ですが、他の形式の動画もアップロードできます。「VideoPress のよくある質問」で、使用できる形式のリストを確認できます。

「カバーブロック」を通常と同じように挿入します。ただし、画像を選択する代わりに、すでにアップロード済みの動画を選択します (もちろん直接動画をアップロードすることもできます)。

録画: カバーブロックを挿入、メディアライブラリから画像を挿入、メディアライブラリのポップアップで動画タブを選択。

その後、挿入する動画を選択し、必要であればブロックの幅設定を調整します。

録画: ブロックに挿入する動画を選択、ブロックの幅を調整。

これでカバー動画の上にお好きなテキストやボタンを追加できます。


上級者向け

高度な設定のタブでブロックに CSS クラスを追加することで、カスタム CSS を記述してブロックを好きなようにスタイリングできます。さらに詳しく。

「高度な設定」セクションでブロックに CSS クラスを追加できます。
「高度な設定」セクションでブロックに CSS クラスを追加できます。