エブリサイトでは、接続設定先にあるデータを使ってそのレコード単位で複数のWebページを一気に生成する事ができます。
この記事では、kintoneのアプリのデータを元に複数のWebページを生成する例を交えながら、
ページの基本設定の「URL展開レコード」、「ページのタイトル」、「URL」の使い方
ページ画面の接続設定における「ページ生成時のみ利用可」
ページ画面の「ページ生成時処理」
についてご説明します。
この記事の処理をお試し頂くと、最終的にこのような複数のページが生成される処理を実現できます。
kintoneアプリの準備
まず、kintoneにアプリを準備します。
アプリは 顧客サポートパック を導入してください（今回の例では顧客管理アプリのみを用います）。
アプリの修正
顧客サポートパックを導入して顧客管理アプリを追加したら、アプリのフィールドに、文字列(1行)フィールドを追加し、フィールド名とフィールドコードを「URL_prefix」として保存してください。
その後、2つのレコードのURL_prefixに対し、適当な文字列(英数字)を設定しておいてください。
アプリにAPIトークンを設定
併せて、アプリにAPIトークンを設定しておきます。
今回はレコード内容を取得するのみの処理なので、アクセス権は「レコード閲覧」のみとしておきます。
kintone側の設定はこれで終了です。エブリサイト側の設定に入っていきましょう。
エブリサイトの設定
まずはページ一覧画面で、新しいページを追加します。
ページの作成
すると次のようなダイアログが表示されます。
入力項目のうち、「ページ設定名」は正式なものを入力します。
また、「ページのタイトル」と「URL」は一旦仮の値を入れて、「追加する」をクリックし、画面を進めましょう。
※ページのタイトルとURLについて「ページ生成時処理」の設定が終わってからでないと、正しい内容が設定できないため
すると、次のようなページ画面が開きます。
接続設定を設定する
ここでは、kintoneで先ほど設定した顧客管理アプリに対して接続設定を設定します。
「接続設定タブ」をクリックし、「接続先を追加する」をクリックします。
接続先候補が出てきますので、「kintone」を選びます。
すると、kintoneの接続設定ダイアログが開きます。
接続設定ダイアログの各項目は次の要領で設定してください。
接続設定名：わかりやすい名前をつけてください。
認証可否：今回はページ生成時にしか利用しない接続設定となるので「ページ生成時のみ利用可」を設定します。
ドメイン：kintoneのドメインを指定します。
kintone アプリ：kintoneのアプリIDを指定します。
kintone アプリのAPIトークン：kintoneのアプリで設定したAPIトークンを指定します。
なお、認証可否について、何を選べばよいかについての考え方は、次の記事を併せて参考にしてください。
ページ生成時処理とページ内処理 ・ログイン・接続設定について
接続設定が完了したら、ページ生成時処理を設定できる準備が整ったことになります。
次はページ生成時処理を設定しましょう。
ページ生成時処理を設定する
ページ生成時処理タブを開き、「＋ アクションを追加」を1度クリックします。
そして、次のようにアクションを設定しましょう。
やること「クエリで条件を指定して kintone からレコードを取得する」、条件「処理を開始した時」を使います。
なお、やること「クエリで条件を指定して kintone からレコードを取得する」はkintoneカテゴリーの中にあります（右上の「キーワードで検索」で検索しても良いでしょう）。
やることのパラメータは
取得元アプリ：kintoneのアプリIDを設定します。
kintone接続設定：先ほど設定した接続設定を選択します。
検索条件：次の要領で設定します。
URL_prefix =! ""
これは、URL_prefixに文字列が入力されているレコードのみを対象とするために、レコードの絞り込みを行っています。
この１つのアクションが設定できたら、ページ生成時処理の設定は終わりです。
次は画面デザインを開き、画面に取得したレコードの会社名が表示されるように設定しましょう。
画面デザインを設定する
画面デザインタブを開き、タイル１(シンプルパネル)をクリックすると、タイル１のウィジェット編集画面が表示されます。
左部にある「テキスト表示」の「テキスト」を「アイテムをドラッグアンドドロップしてください」というエリアにドラッグアンドドロップします。
その後、ドラッグアンドドロップしたアイテムをクリックすると次のような表示になります。
これで、アイテムのパラメーターが変更できるようになったので、右下の「テキスト」の箇所に
= 会社名
と入力します。
また、具体的な式の書き方については、次のドキュメントも併せてご覧ください。
ここまで完成したら、ページの詳細な設定については全て終わりです。
上部、パンくずリストの「サイト：～～～」と記載されている箇所のリンクをクリックして、最後にページの基本設定を変更を行いましょう。
ページの基本設定を変更する
サイト画面にて、設定変更をしたいページの「…」ボタンをクリックし、「基本設定」をクリックします。
すると、次のようなダイアログが表示されます。
まずは下部のURL展開レコード を設定するため、クリックすると次のようなダイアログ出てくるので、アクション番号１を選択し、「選択を決定する」をクリックします。
その後、ページのタイトルに
= 会社名
URLに
${URL_prefix}
を設定します。
正しく入力できている事を確認できれば、「保存する」をクリックして保存しましょう。
これでエブリサイトの設定については終了です。
エブリサイトでページをテストするor公開する
ここまでで、kintoneとエブリサイト両方の設定が全て終わりました。
エブリサイトでページをテスト、ないし公開してみましょう。
ページをテストする場合や、公開する場合は、公開したいページのチェックボックスにチェックを付け、
その後、テストしたい場合は「選択したページをテスト」をクリック、
公開したい場合は「選択したページを公開」をクリックします。
※テストの場合は常にランダムに設定されたURLでテスト用ページが表示され、公開の場合はあらかじめ定めたアドレスにてページが公開されます(フリープランを除く。フリープランの場合は公開URLが毎回自動的に変更されます)。
今回は選択したページをテストしてみましょう。
「選択したページをテスト」をクリックすると次のようなダイアログが表示されます。
テストしたいページが表示されている事を確認し、「公開する」をクリックします。
すると公開処理がはじまり、次のダイアログが表示されます。
「ページ公開ステータスを確認」をクリックすると、テスト表示用のページが公開されていなければ、未公開の状態であることを示すページが表示されます。この場合はしばらく待って、「更新する」ボタンで改めてこのページを表示してください。
テスト表示用のページが公開済みならば公開済みとしてテストページ表示用に設定されたドメインと、生成されたURLのパスの一覧が表示されます。
また、生成されたURLのパスをクリックすると、実際に生成されたページが確認できます。
ページ公開でエラーとなる場合
設定に誤りがあった場合は、ページをテストないし公開したタイミングで次の様にエラーが表示されます。
この時は設定内容を見直し、改めてページをテストし、テスト表示してみてください。
おわりに
エブリサイトのドキュメントページやサポートページもぜひご活用ください。