スライダー

スライダーブロックは、トップページだけではなく複数のページ、ページ内任意の複数の箇所にスライダーを設置できます。スライダーアイテム内には様々なブロックを配置できるため、レイアウトは自由自在です。また、画面サイズに応じて背景画像と高さをそれぞれ指定することも可能です。

スライダーブロックの構造

スライダーブロックは、まず親ブロックのスライダーがあり、その中に子ブロックのスライダーアイテムがあります。1つのスライダーにつき、複数のスライダーアイテムを追加できます。

編集モード / プレビュー（スライド）モード

編集画面では、スライダーアイテムは縦に積まれて表示されます。編集画面で邪魔になる場合は、ブロックツールバーから「プレビュー（スライド）」を選んでください。プレビューにすると、編集画面でもコンパクトに表示できます。

スライダーの順番の変更

順番を変更したいスライダーアイテムを選択し、「上（または下）に移動」をクリックします。

スライダーブロックの設定

[親ブロック] スライダーの設定

幅

スライダーの幅は、親ブロックを選択した状態で、ツールバーの「配置」（なし / 幅広 / 全幅）から選べます。

高さ

スライド設定

アイテムの複数表示設定

画像など複数枚を一度に表示させることができます。複数のビジュアルを縦方向ではなく並列にすることで、限られたスペースにより多くの情報を掲載できます。

一度に遷移するスライドアイテム：1つずつ

一度に遷移するスライドアイテム：表示アイテム数と同じ

左右のスライドを少し見せることも可能

ズームアニメーション

ズームアニメーション効果も設定できます。メインビジュアルのスライダーなど視覚的なインパクトを高めたいときにご利用ください。

ズームアニメーションを有効にすると、エフェクトが自動で「フェード」に切り替わります。また、「アイテムの複数表示設定」は非表示になりますが、スライドエフェクトに戻すと再び表示されます。

背景画像の元の大きさを1とした拡大率をそれぞれ指定します。大きい値ほど背景画像が拡大されます。終了倍率を開始倍率より大きい値に設定するとズームインになります。

• 背景画像の開始倍率：元のサイズを1とし、拡大率を指定します。
• 背景画像の終了倍率：ズームアニメーション後の背景画像の拡大率を指定します。

[子ブロック] スライダーアイテムの設定

スライダーアイテムにリンクを指定

スライダーアイテムを選択した状態で、ブロックツールバーの「リンクURL」からリンクの指定が可能です。スライダーアイテム全体にリンクをクリックできるようにしたい時にご利用ください。

たとえば、以下のスライドショーでは、各スライドの背景画像のどこかをクリックすると、指定したページに移動します。（ここでは、このページに移動するように設定しています）

レイアウト設定

スライダーアイテムのスタイルから、パディングを指定できます。

背景設定

モバイルで表示すると見せたい部分が切れてしまうときは、モバイル用の画像を指定すると便利です。