kintoneのカレンダービューが外部公開できるようになったよ

こんにちは、トッティです。

今回は、先日バージョンアップしたばかりのkViewerを紹介します！

今まで、kViewerは「一覧表示」と「グラフ表示」にのみ対応し、「カレンダー表示」はできませんでしたが、この度対応し、カレンダー表示のまま外部に公開することができるようになりました！セミナーの開催予定などを、カレンダー表示でより分かりやすく公開することができます。

設定も簡単なので、是非試してみてください。

▲今回のゴール

カレンダー表示で外部公開したいkintoneアプリを作成する

そもそもですが、kintone内のデータを外部に公開するサービスなので、当然kintoneアプリが先に存在する必要があります。

分かりやすく、今回は「イベントカレンダー」というアプリを用意しました。

▲今回作ったのはこんなアプリ（予定の色のフィールドは、ラジオボタンorドロップダウンで設定する）

開始日時と終了日時を用意しているのは、kViewerでは日にちだけでなく、時間も設定ができるからです。

▲レコード登録するとこんな感じになっていく

さて、これをkViewerで公開してみましょう。

kViewerでカレンダービューを設定する

kViewerのトップページから、「カレンダービューの作成」に進みます。

▲ビューの作成からカレンダービューを選択する

URLを登録し、kintoneのアプリ情報を取得します。

▲該当アプリのURLよAPIトークン、ビューの管理名を入力する

編集画面の左メニューにある「レコード一覧」をクリックします。

▲カレンダービューの編集画面から「レコード一覧」をクリック

「カレンダーの設定」内で、カレンダーに関するフィールドを各種、設定します。

▲各項目の設定をする（週の始まりや初期表示日、予定時刻は任意で設定）

①：カレンダーに表示されるイベントのタイトルになります。一番目立つやつです。

②：予定の開始日時です。

③：予定の終了日時です。kintoneの「カレンダー形式」では日付をまたぐ表示ができませんが、この「開始日時」と「終了日時」で数日間にわたる予定などを公開することが可能です。

▲予定の色を設定する（該当アプリで非表示にする項目として設定したもの）

④：予定の色分け設定ができます。

最後に「保存」をクリックします。

その後、左メニューの「レコード詳細」でどのフィールドを表示するかを設定します。

▲左メニューの「レコード詳細」をクリック

画面遷移後、左の設定項目から外部公開したい該当アプリのフィールドを、画面に設置します。

▲外部公開するフィールドをドラッグ&ドロップ

フィールドを全部設置したら、必ず一番下の「保存」をクリックしましょう。

さて、ここまで設定ができれば、プレビューしてみます。

▲できた！

タイトルはクリック可能ですので、例えば「ユーザー懇親会」をクリックしてみます。

▲イベントの詳細が表示される

イベントの詳細が表示されるので、申込みのリンクなどをここで用意することも可能です。

今回はデフォルトのカレンダービューを「月」にしているので、上記の表示になっていますが、「週」に変更することもできます。

▲週表示ver

設定はこのような流れで行います！

社内、または取引先とコミュニケーション行っていたkintoneが、不特定多数のお客様相手にも使えるんです！是非、お気軽にお試し下さいね！kintoneの世界が一気に広がりますよ！( ･`ω･´)

それではまた。