マイプロジェクトにテンプレートがコピーされます。マイプロジェクトは左のメニューバーからアクセスできます。
ステップ3 アプリトリガー「従業員情報の登録」
テンプレートの1つ目の工程をクリックします。設定完了の証（水色のランプの点灯）がありますが、サンプル値の設定が必要なため、設定を進めます。
(1/2)フォームを作成
新規登録する従業員情報を取得するフォームを作成します。取得した値をそのままジョブカン勤怠に登録するため、ジョブカン勤怠の形式に合わせて作成するとスムーズです。
事前設定では、下記の質問項目が設定済みです。
右上のプレビューボタンを押すと、フォーム画面の見え方を確認できます。
フォームの編集画面に戻り下へスクロールします。
- 完了ページの設定
- フォーム送信完了ページのメッセージ編集ブロックが表示されます。ここは任意の設定ですが、メッセージを設定すると、より丁寧な印象になります。
- アクセス権限
- フォームへのアクセス権限はトグルの切り替えで設定できます。
- ヘルプ；IP制限に関して
- フローボットの起動権限
- デフォルトでこのフローボットを作成した人に設定されています。
→次へをクリックします。
※取得する項目を増やす場合
フォーム編集画面で、質問項目の一番下にある「＋質問を追加」ボタンをクリックします。
以下の内容を編集できるブロックが追加されます。
- 追加したい項目名
- 補足内容
- 形式（プルダウンメニューを開いて選択します）
例えば、電話番号を追加したい場合、ジョブカン勤怠の形式に合わせてハイフンなしの半角数字と補足を入れておくとエラー防止に役立ちます。
項目の表示順は、項目の左にある6点アイコンを選択しながらドラッグ＆ドロップで入れ替えられます。追加編集が完了したらプレビューで表示確認を行い、次に進みましょう。
(2/2)フォームの表示確認と詳細設定
次の操作で使用するため、編集欄にテスト用の値を入れます。
※ジョブカン勤怠は同じ値を登録できない仕様のため、スタッフコードなどは重複しない値を入力してください。
→保存するをクリックします。
ステップ4 ブラウザを操作する「ブラウザを操作する」
テンプレートの2つ目の工程をクリックします。ジョブカン勤怠への登録フローをこの工程で設定します。
(1/1)ブラウザ操作の詳細設定
事前設定でジョブカンの管理画面にアクセスから、フォームで取得した従業員情報の入力・登録まで雛形が設定されています。この工程は、Webサイト上でスタッフ登録をする工程を辿っています。
- 2つ目以降のアクションは、下へスクロールすると確認できます。まずはジョブカン勤怠にログインします。
- 「2.勤怠会社IDを入力」をクリックすると下の入力画面が表示されます。値の欄に、事前に取得しておいた値を入力して保存するをクリックしましょう。
- 「3.IDを入力：グループ管理者ログインIDを入力」をクリックして入力画面を開きます。
- グループ管理者IDとパスワードを入力するので、アカウントのプルダウンメニューを開き、「＋アカウントを追加」をクリックします。
- サービス名は任意の値になります。何のサービスの値かわかるように、【ジョブカン勤怠】と入力します。
- IDとパスワードには事前取得した値を入力します。
- 右下にある保存するをクリックします。
- 「4.パスワードを入力」を開きます。
- 3.で入力した情報が引用できます。アカウントのプルダウンメニューを開くと、先ほどIDとパスワードを入力したジョブカン勤怠（サービス名）が表示されますので、選択しましょう。
- これ以降は、 フォームから取得した値をジョブカン勤怠に入力する工程になります。
- 事前設定では、「姓名」「メールアドレス」「スタッフコード」の入力手順とそれぞれに フォームから取得した引用コードが入力されています。姓の場合はこういった画面です。
- 事前設定では、姓名とメールアドレスとスタッフコードのみが設定されています。電話番号の入力は追加の設定が必要です。
- ブラウザ操作の説明に戻ります。アクション一覧を見ると、各アクションとの間にプラスボタンがあります。アクションの途中に新たにアクションを挿入したい場合に使います。
- 今回はスタッフIDを入力した後、確認画面に遷移するまでに、電話番号の入力を差し込んでみます。プラスボタンをクリックすると、操作メニューが開きます。
- メニューの中から、「ブラウザ操作を指定」を選択します。遷移するURLを入力する画面が表示されます。
- ジョブカン勤怠のスタッフ登録画面のURL「https://ssl.jobcan.jp/client/new-employee」を入力します。
- 「操作を開始する」をクリックすると、別ウィンドウで画面が立ち上がります。
- ジョブカンのログイン画面が表示されます。左下に「要素にアクションを設定」と表示されたバナーが表示されていると、Yoomのブラウザ操作中の証です。
- 勤怠会社IDをクリックすると、操作メニューが表示されます。
- フォームに情報を入力を選びます。値を入力する画面が表示されるので、勤怠会社IDを入力して保存するをクリックします。
- ブラウザ操作の初めに解説した操作と同じ手順です。
- 同様に、グループ管理者ログインIDの欄をクリックして「IDを入力」を選択し、表示された画面からジョブカン勤怠（サービス名）を選択します。
- その下のパスワード欄をクリックして、「パスワードを入力」を選択して、表示された画面からジョブカン勤怠（サービス名）を選択します。
- パスワードの入力画面の下にログインボタンをクリックします。
- アクションメニューが表示され、「クリック」を選択します。（薄い水色にハイライトされて見えにくくなっていますが、ログインボタンです）
- アクション名を入力する画面が表示されるので、ログインするを入力して保存をしましょう。
- 電話番号の欄をクリックして、アクションメニューを開きます。フォームに情報を入力を選びます。
- アクションの操作画面が表示されます。値の欄をクリックすると、「従業員情報の登録」タブ内にフォームから取得した値が表示され、選択すると引用コードが埋め込まれます。
- 任意ですが、アクション名をわかりやすい名称に編集しておくと、アクション一覧でみた時にわかりやすくなります。編集が終わったら保存するボタンをクリックします。
- ブラウザ操作画面の「要素にアクションを設定する」バナーのYoomの画面に戻るボタンをクリックします。
- アクション一覧を確認して、重複しているアクションを消して全体を整えます。（設定上ブラウザにログインする操作が必要でしたが、途中ログインのアクションは消去しても問題ありません）
- ブラウザ操作オペレーション画面右下の、テストボタンをクリックします。
- 1.URLにアクセスから順にアクションのテストが始まります。
- 全部成功したことを確認します。
ジョブカン勤怠のスタッフ一覧で、テストの登録が確認できました。
→保存する をクリックします。
※エラーが発生する場合、下記の要因が考えられます。
- ジョブカン勤怠の基本設定が終わっていない（10分単位か15分単位の計算にするなど）
- メールアドレスやスタッフIDが重複している（ジョブカン勤怠の仕様で、同じ値は登録ができないようになっています）
ステップ5 アプリと連携する「チャンネルにメッセージを送る」
テンプレートの3つ目の工程をクリックしてください。Slackへの通知内容を編集します。
(1/2)連携アカウントとアクションを選択
こちらは初期設定済みです。
- アプリトリガーのタイトル
- アプリ
- Slackと連携するアカウント情報
- アクション
→次へをクリックします。
(2/2)API接続設定
- チャンネルID
- 編集欄をクリックすると、連携したSlackのアカウントからチャンネルの候補一覧が表示されます。該当のチャンネルを選択すると、自動でIDが引用されます。
- メッセージ
- 通知する定型文を作成し、特定のメンバーへのメンションも可能です。
- 編集欄をクリックするとフォームから取得した項目が、プルダウンメニューに表示されます。
- ジョブカン勤怠の登録が終わったら通知する仕組みなので、「登録が完了しました」だけでもよいですが、氏名やスタッフコードの情報を引用コードを用いたら、わかりやすくて便利です。
- 入力が終わったら、左下にあるテストボタンをクリックします。
- 成功！Slackのチャンネルに通知が届いていました。
→保存するをクリックします。これで、今回の工程は以上です。
ステップ6 アプリトリガーをONにする
全ての工程が設定されると、完了画面が表示されます。
トリガーをONにした後、テンプレートの左上にあるトグルを使用して、フローボットを起動します。
<span class="mark-yellow">プログラミング不要でフローボットの設定が簡単に完了しました。</span>トリガーをONにすると、フォームのリンクを取得できるようになります。右上のボタンからフォームのリンクを取得して、運用を始めてみましょう。
今回使用したテンプレートはこちらです。
.png)
.png)
.webp)
.webp)
