コンテンツタイプ【user】:ユーザー編集
コンテンツタイプ【user】:ユーザー編集とは
「ユーザー編集」コンテンツはuserモジュールを導入すると作成できるようになります。
ユーザー(会員)ログイン後、自身の情報を編集するためのコンテンツです。
コンテンツを編集する場合は以下から進んでください。
ユーザー編集コンテンツの作成
管理者画面 > 設定(画面右上歯車アイコン)>コンテンツ > 新規作成
コンテンツ作成画面のコンテンツタイプから「ユーザー編集」を選択すると、ユーザー編集コンテンツを作成することができます。
ユーザー編集コンテンツを作成する場合、「対象シート」を指定する必要があります。userモジュールから複数のユーザーシートを作成した場合、どのシートにユーザーを編集させるのかを指定します。
ユーザー編集コンテンツの設定
まず、基本的なページ情報の設定、閲覧権限や公開設定などを行います。
Webページのコーディングデータは、テンプレートHTMLのエリアで編集していきます。
コンテンツ情報
コンテンツタイプ
ユーザー編集コンテンツを作成します。「ユーザー編集」と表示していることを確認してください。
コンテンツURL
コンテンツ(ユーザー編集フォームのページ)のURLとなります。
対象シート
新規作成で設定した対象シートが表示されます。クリックすると「シート編集」画面が開きます。
コンテンツ設定
コンテンツID
コンテンツURLで使用するIDです。省略した場合は自動入力します。変更するとコンテンツURLも変更されます。
カテゴリ名
コンテンツの管理用にカテゴリ分けが可能です。省略した場合は「未設定」になります。
コンテンツ名
コンテンツを管理する名称です。わかりやすい名称を設定します。
公開範囲
ユーザー編集コンテンツはログイン後の会員などのユーザーのみ閲覧可能です。
閲覧権限外の転送URL
公開範囲で設定した権限以外がアクセスした場合の転送先URLです。
対象デバイス
作成したコンテンツの閲覧が可能な端末を設定します。
対象外デバイスの転送URL
「対象デバイス」で設定していない端末からアクセスした場合の転送先URLです。
Basic認証
コンテンツにBasic認証をかけることができます。設定したUserIDとPassを入力することで閲覧可能となるコンテンツが作成できます。
公開設定
コンテンツ(ユーザー編集)の公開状態を設定します。新規作成時の初期値は「非公開」です。
テンプレートHTML
「ユーザー編集」コンテンツでは、以下の編集エリアを用意しています。各編集エリアでHTMLの編集や変数を挿入し、各画面を作成していきます。
【入力画面HTML】
会員の情報を編集する編集画面(入力フォーム)となるコーディングデータを入力していきます。
フォーム入力に必要な入力項目は変数として用意されているので、適宜配置していきます。
変数から出力された項目には、あらかじめユーザー情報が入力されています。
※対象シートで設定したシートに定義されている項目が変数として使用できます。
あらかじめDreamweaverなどのツールでコーディングしたデータをそのまま貼り付け、入力項目を変数に置き換えるだけでユーザー編集フォームが作成できます。
以上のように入力することで、Web側でユーザー編集画面が作成できます。
フォーム用変数
フォームを作成する場合、必ずフォームスタート用変数とフォームエンド用変数を配置する必要があります。
- フォームスタート用変数:
[form_start]
- フォームエンド用変数:
[form_end]
[form_start]
[error]
<div class="mod-form">
<h2 class="cnt-title">基本情報</h2>
<div class="mod-table-form">
<table class="table-line">
<tbody>
<tr>
<th>氏名<span class="mark-req">必須</span></th>
<td>[user_origin_user_name]</td>
</tr>
<tr>
<th>メールアドレス<span class="mark-req">必須</span></th>
<td>[user_origin_mail_1]</td>
</tr>
(省略)
<div class="box-btn">
<div class="btn-block">
[form_check_button]
</div>
</div>
</div>
<!-- /.mod-form -->
[form_end]
主要変数
以下ユーザー編集フォームを作成するにあたり、主に使用される変数を紹介します。
フォームスタート | [form_start] |
フォームエンド | [form_end] |
確認ボタン | [form_check_button] |
エラー表示 | [error] |
フォームに配置した項目を必須設定としたり、フォーマット設定した場合、入力チェックが行われます。
チェックエラーを表示させたい箇所にエラー表示用変数[error]
を配置します。
- エラー表示用変数:
[error]
エラーの表示内容については次の【エラー挿入HTML】に記述します。
【エラー挿入HTML】
複数のエラーを一度に表示させるために、4パターンの表示形式が選べます。
- スラッシュ区切りで表示:
[error_message_slash]
- 改行区切りで表示:
[error_message_br]
- リスト形式で表示:
[error_message_li]
- スパン区切りで表示:
[error_message_span]
コンテンツ側で変数を配置した場所にエラーメッセージが表示されればOKです。
【確認画面HTML】
フォーム入力後に遷移する入力確認画面を作成します。
基本的には【入力画面HTML】とほぼ同じ内容のコーディングデータで対応できます。
ページのタイトルや登録完了/修正ボタンの配置を行う程度でいいでしょう。
※【確認画面HTML】にも[form_start]
と[form_end]
の変数は必要です。[error]
変数は必要ありません。
主要変数
以下ユーザー編集フォームの確認ページを作成するにあたり、主に使用される変数を紹介します。
フォームスタート | [form_start] |
フォームエンド | [form_end] |
登録ボタン | [form_fix_button] |
修正ボタン | [form_back_button] |
【完了画面HTML】
確認画面から登録完了ボタンのクリック後に遷移する登録完了画面を作成します。
基本的には【入力画面HTML】とほぼ同じ内容のコーディングデータで対応できます。
完了画面HTMLはサイトのトップページへのリンクを配置することをおすすめします。
※【完了画面HTML】には[form_start]
と[form_end]
、および[error]
変数は必要ありません。