CMS:テキスト入力を追加・設定する
読了時間:7分
ユーザーからメールアドレスや電話番号などの一般的なデータを収集する、テキスト入力要素、テキストボックス要素、またはリッチテキストボックス要素を追加しします。
始める前に:
エディタに CMS(コンテンツ管理システム)を追加していることを確認してください。
ステップ 1 | テキスト入力要素を追加・設定する
ページに 1行または複数行のテキストを入力できるテキスト入力要素を追加して、サイトのニーズに合わせて設定、レイアウト、デザインをカスタマイズします。
Wix エディタ
Wix Studio エディタ
- エディタ左側で「パーツを追加」 をクリックします。
- 「入力欄」をクリックします。
- 追加するテキスト入力要素の種類をクリックします:
- テキストを入力:訪問者は 1行のテキストを入力または編集することができます。
- テキストボックス:訪問者は複数行のテキストを入力または編集することができます。
- 使用するテキスト入力要素をページにドラッグします。
- テキスト入力要素で「設定」をクリックし、以下を編集します:
- タイプ:(テキスト入力要素のみ)テキスト入力要素で許可する文字タイプを選択します:
- テキスト:名前、住所、その他の情報など、すべての文字タイプを許可します。
- パスワード:パスワードを入力すると、それらの文字が ● 印で表示されます。
- 数値:数字のみを許可します。
- メール:メールアドレスのみを許可します。無効な形式のメールアドレスを入力すると、テキスト入力要素の枠線が赤く表示されます。
- URL:ウェブアドレスのみを許可します。無効な形式の URL を入力すると、テキスト入力要素の枠線が赤く表示されます。
- 電話番号:すべての文字タイプを許可します。
- 項目タイトル:テキスト入力要素の上に表示されるタイトルを入力します。
- 初期テキストを表示:オプションを選択し、必要に応じてプレースホルダテキストとデフォルトテキストを入力します。
- 認証:以下のオプションから選択します:
- 項目タイプ:該当するオプションを選択します:
- 必須項目:このテキスト入力要素への入力を必須にします。
- 読み取り専用:このテキスト入力要素に、コンテンツの表示のみを許可します。訪問者は値を編集することはできませんが、コピーすることは可能です。
- 文字数制限を設定:トグルを有効にして、訪問者が入力できる最大文字数を設定します。
- 正規表現を追加:(テキスト入力要素のみ)トグルを有効にし、正規表現(regex)コードを入力して、ブラウザのデフォルトの検証に、独自のパターン検証を追加します。
- エラーメッセージの形式:エラーメッセージの表示方法を「インライン」または「ツールチップ」から選択します。
- 項目タイプ:該当するオプションを選択します:
- タイプ:(テキスト入力要素のみ)テキスト入力要素で許可する文字タイプを選択します:
- 「レイアウト」アイコン をクリックし、プレースホルダの余白、テキストの方向、配置などを調整します。
- 「デザイン」アイコン をクリックし、別のプリセットデザインを選択します。「デザインをカスタマイズ」をクリックすると、デザインをさらに細かくカスタマイズすることができます。
ステップ 2 | テキスト入力を CMS に接続する
データセットを使用して、テキスト入力要素を入力内容を保存するコレクションのフィールドに接続します。必要に応じて、データセットモードやコレクションの権限を変更します。最後に、訪問者が入力した内容をコレクションのフィールドに送信できるよう、送信ボタンを追加します。
Wix エディタ
Wix Studio エディタ
- エディタで該当するテキスト入力要素をクリックします。
- 「CMS に接続」アイコン をクリックします。
- 「データセットを選択」ドロップダウンをクリックし、コレクションに接続する既存のデータセットを選択します。または、「新しいデータセットを作成」をクリックし、接続するコレクションを選択し、データセットに名前を付けて「作成」をクリックすることもできます。
- 「Value を接続」ドロップダウンをクリックし、入力内容を保存するコレクションのフィールドを選択します。
ヒント:「新しいフィールドを追加」を選択すると、入力内容を保存する新しいコレクションのフィールドを追加することができます。
- データセットモードとコレクションの権限を設定します:
- 「データセット設定」をクリックします。
- 「データセットモード」ドロップダウンをクリックし、「書き込み」または「読み取り&書き込み」を選択します。
- (必要に応じて)「コレクションの権限」横の権限タイプをクリックし、最初のドロップダウンで「フォームの回答」を選択します。その他のドロップダウンをクリックして、権限を絞り込むことができます。権限の設定が完了したら、「保存する」をクリックします。
- 訪問者がクリックして入力した内容を送信できるよう、「送信」ボタンを作成・設定します。
お役に立ちましたか?
|