クリックやスワイプで複数アイテムの表示を切り替えるカルーセル（スライダー・スライドショー）が配置・デザインできます。

カルーセルを使用すると、限られたスペースでより多くのコンテンツを表示させたり、自動再生機能を使い、サイトに動きを加えることも可能です。

※現時点で無限ループ再生はサポートしていません。詳しくは、以下の記事をご覧ください。

この記事ではStudioでご利用いただける２種類のカルーセルの内、データ管理とデザイン編集をエディター内で完結できる「カルーセル（リスト）」の追加・編集方法をご紹介します。

Studio CMSダッシュボーで管理するデータで作る「CMSカルーセル」については、以下の記事をご覧ください。

カルーセルボックスの配置

デザインエディター左側の追加パネルから、カルーセルボックスをドラッグ&ドロップ、またはクリックでスクリーンに配置できます。

このボックスには、3つのアイテムがあらかじめ登録されています。サンプルデータを入れ替えて利用したり、データを追加、デザインを編集してカスタマイズいただくことも可能です。

カルーセルアイテムの編集

カルーセルに表示するテキストや画像などのデータは、レイヤーパネルで管理・編集します。

カルーセルボックスを選択し、画面左のレイヤーパネルを開きリスト内に表示されるデータを直接編集します。

リストの編集方法について詳しくは、リスト編集・管理をご覧ください。

レイヤーパネル上でリストを右端までスクロールすると表示される「+」ボタンをクリックして、プロパティ（列）が追加できます。

プロパティの種類について詳しくは、プロパティをご覧ください。

※ 「テキストプロパティの改行あり・なし」と「参照プロパティ」はリストでは提供していません

また、カルーセルのアイテムが自動でスライドする自動再生が設定でき、再生間隔などの指定も可能です。

設定項目	詳細
再生間隔	スライドが切り替わるまでの間隔
送り時間	スライドが流れる速度
ホバーで停止	マウスでカーソルを当てる又は、キーボード操作でフォーカスが当った際に自動再生が止まります。カーソル・フォーカスが外れると自動再生が開始します

ここに変換ボタンが表示される場合は、ボタンをクリックすると設定欄が表示されるようになります。詳しくは、以下の記事をご覧ください。

カルーセル内アイテムのレイアウトやスタイルは共通となります。カラー、数値、ブール値プロパティを使って、アイテム毎にスタイルに変化をつけることは可能です。

URLプロパティを追加し、リンク先をそれぞれ指定します。

リンク設定したいボックスを選択した状態で、画面右側のパネルを開きます。リンク設定にて、先ほど追加したURLプロパティを選択します。

carousel