クラスターブロック

クラスター ブロックを使用すると、他のブロックを 1 つの親ブロックにグループ化し、カスタムの背景を持つブロックの興味深いセクションを作成できます。

ツールバーのブロック設定

ブロックで使用できるツールバー ボタンを使用すると、ブロックの幅をコンテンツ サイズ、ワイド サイズ、または全幅サイズに変更できます。画像を背景として選択すると、ツールバーのアイコンを使用して、ブロック内に表示される画像を変更できます。カスタムの高さが定義されたクラスターの場合、コンテンツを垂直方向に整列させるオプションが利用可能です。コンテンツをクラスター ブロックの上部、中央、または下部に配置できます。

サイドバーのブロック設定

ブロックのサイドバー設定から、ブロックに関連する背景、オーバーレイ、境界線、影、および高さのオプションを定義できます。

背景設定

Block には 4 つの背景タイプがあります。

  • なし
  • 画像
  • 単色
  • 勾配

画像の背景

画像の背景オプションを使用すると、カスタム画像を背景にアップロードし、他の追加オプションを定義できます。

  • 背景画像のサイズを設定する
  • 背景の画像に繰り返しオプションを設定する
  • 背景の画像を固定するか、ページと一緒にスクロールするかを定義します
  • 画像上に焦点を定義して、背景内の画像の位置を設定します
  • 画像の下に背景色またはグラデーションを設定します。これらのオプションは、背景画像が透明な PNG 形式の場合に便利です
  • 画像上にオーバーレイを設定すると、オーバーレイを単色またはカスタム透明度のグラデーションで定義して、興味深い背景の外観を作成できます。
画像の背景のレスポンシブ オプション

デスクトップ サイズとカスタムのレスポンシブ画面サイズに対してさまざまな背景画像設定を定義できます。画像を背景としてアップロードすると、別のラジオ ボタンが表示されます。有効にすると、新しいタブが表示されます。 [モバイル サイズ] タブに移動し、パラメータを定義します。

レスポンシブ オプションが適用される場合の画面幅を定義できます。

レスポンシブ レイアウトでは、背景に別の画像を含めることができます。画像を変更してサイズを小さくし、アップロード時間を短縮します。ブロック ツールバーに移動し、既存のデスクトップの背景画像をモバイル バージョンの画像に置き換えます。透過png形式で、位置や背景色を選択できます。他のオプションはデスクトップ レイアウトと同じように使用されます。

背景画像を変更する方法

次のアイコンをクリックすると、背景画像を変更できます。

単色の背景

このオプションを使用すると、ブロックの背景に単一の色を定義できます。

グラデーションの背景

このオプションを使用すると、ブロックの背景にグラデーションを定義できます。

枠線の設定

オプションを使用すると、ブロックの境界線をカスタムの色、幅、丸みを帯びたブロックのエッジの半径で定義できます。

影の設定

影の設定で色を定義すると、ブロックの下の影をアクティブにすることができます。必要に応じて影をカスタマイズするために必要なすべてのパラメータが利用可能で、水平および垂直オフセット、ぼかし、およびピクセル単位の拡散半径のコントロールがあります。
影は外側または内側の影タイプとして表示できます。

高さの設定

高さ設定を使用すると、ブロック内のコンテンツがこの高さを超えない場合に、ブロックを強制的に定義された高さで表示できます。ブロックの最小の高さには、ピクセル、vh、vw のさまざまな単位から選択できます。
カスタムの高さサイズまたはカバーの高さをブロックに定義したら、ブロック ツールバーで使用できるアイコンを使用して、ブロック内のコンテンツを垂直方向に整列することもできます。

Columns ブロック内に挿入されるクラスター ブロックの場合は、クラスター ブロックの高さを挿入される柱の高さ全体に合わせる追加オプション「Cover column height」が利用可能です。このオプションは、Cluster ブロックが Column に直接挿入された 1 つのブロックのみである場合に効果があります。もちろん、他のブロックを必要なだけクラスター ブロックに挿入できます。

幅の設定

幅設定を使用すると、デフォルトで定義されているクラスター ブロック内のコンテンツの幅をカスタマイズできます。 WordPress カスタマイザーの一般的なレイアウト設定.

幅は、クラスター ブロック ツールバーで設定されたさまざまなサイズ (コンテンツ、ワイド、全幅) に対して個別に変更できます。

幅設定は、アクティブな Citadela Pro プラグインでのみ使用できます。

モバイル設定

モバイル設定では、クラスター ブロックをモバイルでのみ表示するか非表示にするかを定義できます。コンテンツの応答性が低い画面サイズでブロックを非表示にすることができます。

間隔の設定

オプションを使用すると、クラスター ブロック内のコンテンツの周囲のパディング (間隔) を定義できます。使用可能なスペースには、なし (デフォルトの間隔)、0 (ゼロ、間隔なし)、小さい間隔、および大きい間隔の 3 種類があります。