高度なwebフォームをkintoneに連携！フォームブリッジ　[トヨクモ株式会社（旧：サイボウズスタートアップス株式会社 Cstap）]

[著者：TOYOKUMO（旧：cstap） 簗瀬 沙希]

フォームブリッジとは？

アンケートフォームや申込みフォームをノンプログラミングで簡単に作成する事ができ、フォームに登録された情報をkintoneにデータ登録できるwebフォームサービスです。初期費用0円、6,000円/月～からご利用できます。

フォームを横並びに設定したり、複数のkintoneアプリにデータの情報を登録することが可能になったり、ステップフォームや条件分岐ができるようになったりと、従来のフォームクリエイターでは実現できなかった機能をいくつも実装しております。

もちろんフォームはPC、スマートフォン、携帯電話向けとマルチデバイスに対応しています。

使用例

今回は、よくあるセミナー申込みフォームについて実際に使用している例を紹介します。
フォームブリッジで作成したフォームをiframeでHPに埋め込んで利用しています。

kintone側の設定

セミナー申込みをkintoneで管理する際、以下のようなフィールドが必要になるかと思います。
※ 全ての項目が必須な訳ではありませんが、管理する際に便利な項目も含め記載しています

フィールド名	フィールドタイプ
会社名	文字列 (1行)
部署名	文字列 (1行)
お名前	文字列 (1行)
電話番号	文字列 (1行)
メールアドレス	文字列 (1行)
申込みセミナー 日程	ラジオボタン
参加するセミナー	複数選択

また、「設定」>「APIトークン」より APIトークン を作成してください。
権限は「レコード追加」の権限が付与してあれば大丈夫です。生成したAPIトークンは後ほど利用するので、メモしてください。

フォームブリッジ側の設定

新しくフォームを1から作成するのか、目的のフォームを使いフォームを作成するのかを選びます。
今回は はじめから作成 を選択してフォームを作成します。

次に、kintoneで作成していたアプリと連携しフォームを作成します。
kintoneアプリのURLとAPIトークンを登録します。これでフォームを作成していきます。

ここから、「一般設定」や「フィールド」、「自動返信メール」を設定します。

フィールドからフォームを横並びにしたり、フォームの幅を調整したりすることができます。

 編集完了を選択し、フォームを公開します。

実際に投稿すると、回答情報はセキュアに管理しながらkintoneにデータ登録されます。

高度なフォーム

フォームブリッジでは、機能を組み合わせることで高度なフォームを作成することができます。

ステップフォーム

複数ページに渡るフォームを作成することができます。

まずフィールドで投稿までに必要な情報を設定します。
※ ラベルを使って色をつけて編集したりする事も可能です

フィールドが設定できたら、次はステップフォームの設定を行います。
それぞれのページの「タイトル」、「説明」、「表示するフィールド」を選択します。

Step1 ではセミナー内容を確認する画面を用意し、
Step2 ではお客様情報を入力する画面を用意、
Step3 では簡単なアンケートに回答する画面を用意します。

・Step1

・Step2

・Step3

※ 申込みフォームから投稿をしたら自動返信メールを送るように設定する事もできます。

これで、3ページに渡り申込みページを作成することができます。

自動返信メール

回答者への返信メールを送ることができます。回答者が入力した情報を引用することもできます。

まず、自動返信メールの +(追加ボタン) から返信メールの設定をします。
フィールドに入力された内容をそのまま引用できる為、使用する場合はフィールドを選択して本文内に挿入します。

差出人名も自由に変更可能です。

実際にフォームを登録すると、以下のような返信メールが届きます。

条件分岐

条件となるフィールドが特定の値を取る時のみ、表示するフィールドを設定できます。

例えば、「セミナー日付を選択すると、その日に参加できるセミナーのみ表示される」といった事が可能になります。

条件分岐の「条件分岐を利用する」にチェックを入れて、+ (追加ボタン) から条件分岐の設定を作成します。

今回は、セミナー参加日で

• 5/10を選択したらkintoneセミナーを選択できるようにする
• 5/11を選択したらofficeセミナーを選択できるようにする

という設定を作ります。

条件分岐に利用するフィールドを選択します。

分岐の詳細設定を作成します。

今回の場合、申込みセミナー日程で10日を選択したら、参加するセミナーの選択肢を表示させる(できる)という設定を作成します。

さらに分岐の追加ボタンをクリックし、11日を選択したら参加する(できる)セミナーの選択肢を表示させるという設定です。

保存してフォームを確認すると、

10日を選択すると、kintoneセミナーの選択肢が表示され、

11日を選択すると、officeセミナーの選択肢が表示されます。

その他

他にも、回答数の上限を制限や回答期間の制限ができる「制限機能」、

フォームに登録すると、複数のkintoneアプリに情報登録したり、エラーがあった際に管理者に対して通知メールを送ってあげたりする「回答後処理」を設定することもできます。

 

弊社製品の kViewer というサービスと連携させて、回答者ごとの専用ページを作成したりすることもできます。

また、プリントクリエイター と連携させることでこの見積をフォームブリッジから依頼して、プリントクリエイターで出力とすることもできます。

FAQ

Q. フォームブリッジのボタンの文字を変えたい。

例) 回答ボタンの「回答」を「申込」という文言に変更したい

A. フォーム編集画面の「多言語化」から設定可能です。

「多言語化を利用する」にチェックを入れ、ボタンにしたい文言を入力します。

 

Q. フォームブリッジのラジオボタンの初期値が設定されるが、設定しない方法はありますか？

A. 以下のブログ内にコードの記載がございますので、ご確認ください。

https://kintoneapp.com/blog/radio_off/

Q. 完了画面のアイコンを変える方法はありますか？

A. フォームブリッジの完了画面の内容を変えるのであれば、フォームの「完了画面」設定から、「HTML形式で入力する」を選択し、HTMLを入力することで変更が可能です。

Q. 入力した値を再度入力させる場合、値が異なったらエラーを出す事できますか？

例) パスワードを入力させて、再度パスワードを入力させる等

A. こちらに関しまして、ブログ記事がございますので参考にして下さい。

https://kintoneapp.com/blog/input_comfirmation/

Q. 郵便番号を入力するだけで、住所が自動で入力されるということは可能ですか？

A. こちらに関しましても、ブログ記事がございますので参考にして下さい。

https://kintoneapp.com/blog/postal_code/

利用料金

	ライト	スタンダード	プレミアム
料金	月額6,000円	月額9,000円	月額14,000円
フォーム作成機能	◯	◯	◯
管理者への登録エラー通知機能	◯	◯	◯
自動返信メール	―	◯	◯
スマートフォン専用レイアウト機能	―	◯	◯
ステップフォーム機能	―	◯	◯
条件分岐機能	―	◯	◯
kViewerと連携したルックアップ機能	―	―	◯
kViewerと連携したMyページ機能	―	―	◯
プリントクリエイターとの連携機能	―	―	◯
安心運用サポート	―	◯	◯

 

最後に

フォームブリッジを利用することで、ホームページでのお問い合わせ受付や申込み、アンケートなどのフォームを簡単に作成できます。
また、簡単なフォームを作成するだけではなく、kintoneの画面では実現できない条件分岐フォームやステップフォーム等、高度なフォームを作成することも可能です。

随時無料トライアルを受け付けておりますので、是非お気軽にお試しください。
トライアルお申し込みは フォームブリッジ無料お試しフォーム からお申し込みください。

このTipsは、2019年2月版 kintoneで確認したものになります。