CMS:ボタンをデータセットに接続する
6分
ボタン要素をデータセットに接続し、ボタンがクリックされた際の動作を定義します。これにより、たとえば訪問者がボタンをクリックした際に、入力要素の内容がコレクションに「送信」されるようにしたり、動的アイテムページやコレクション内のドキュメントが表示されるようにすることができます。また、ボタンのラベルをコレクションのフィールドに接続して、ボタンに動的テキストを表示させることもできます。
データセットを使用してボタンをクリックした際に指定できる動作は、データセットモードの設定や、通常のデータセットに接続するか動的ページのデータセットに接続するかによって異なります。データセットを使用してボタンをクリックした際に指定できる動作についてはこちら
ボタンをデータセットに接続する
ボタンをデータセットに接続すると、「クリック時の動作を選択」ドロップダウンに利用可能なすべての接続タイプが表示されます。データセットは、ページ上の要素を CMS コレクションのコンテンツにバインドするものです。
Wix エディタ
Wix Studio エディタ
- エディタで該当するページにアクセスします。
- CMS に接続したいボタンをクリックします。ボタンを追加する方法はこちら
- 「CMS に接続」アイコン をクリックします。
- 「データセットを選択」ドロップダウンをクリックし、コレクションに接続する既存のデータセットを選択します。または、「新しいデータセットを作成」をクリックし、接続するコレクションを選択し、データセットに名前を付けて「作成」をクリックすることもできます。
- 「クリック時の動作を選択」ドロップダウンをクリックし、該当するオプションを選択します:
- データセット設定:ボタンがクリックされた際の動作を選択します。
- 動的ページ:リンクさせる動的ページを選択し、そのページを「同じタブ」または「新しいタブ」で開くか選択します。
- フィールド:接続するコレクションのフィールドを次の種類から選択します:オーディオ、ドキュメント、画像、URL、または動画。詳細はこちら
ヒント:「新しいフィールドを追加」を選択し、コレクションに新しいフィールドを追加して、そのフィールドに接続することもできます。

- (オプション)ボタンに、接続先のコレクションアイテムに応じて変化する動的テキストを表示します。「ラベルの接続先」ドロップダウンをクリックし、該当するコレクションのフィールドを選択します。
ヒント:ボタンをクリックして「テキストを編集」をクリックし、静的テキストを使用することもできます。

- (オプション)「色」フィールドをボタンに接続します:
- 右側の「ボタンを接続」パネルで、「色」までスクロールダウンします。
- 「通常時」、「ホバー時」、「無効」タブから、接続するボタンの状態をクリックして選択します。
- 該当するドロップダウンをクリックし、接続する「色」フィールドを選択します:
- 文字色の接続先:「色」フィールドを、ボタンのテキストの色に接続します。
- アイコン色の接続先:「色」フィールドを、ボタンのアイコンの色に接続します(ボタンにアイコンがある場合)。
- 枠線の色の接続先:「色」フィールドを、ボタンの枠線の色に接続します。
- 背景色の接続先:「色」フィールドを、ボタンの背景色に接続します。
- 「色」のコレクションフィールドに接続するボタンの状態ごとに、この手順を繰り返します。

- 「プレビュー」をクリックし、接続をテストします。
- 変更内容を公開する準備ができたら、「公開」をクリックします。
よくある質問
CMS でのボタンのリンクに関するよくある質問とその回答については、以下をクリックしてください。
訪問者がクリックしてメールを送信できる動的リンクを作成することはできますか?
ボタンに動的テキストを表示することはできますか?
別のフィールドタイプに接続する際は、どのようなコンテンツの制限事項に注意する必要がありますか?