船井デジタル道場
一覧上のレコードをグループ化し看板形式で表示！『KanbanBoardプラグイン』について
INDEX
こんにちは！きゅりえです！
船井総合研究所に勤務しており、現在は船井ファストシステムを導入されている企業様のサポートを行っております。このデジタル道場では、「kintoneってそんなことまでできるんだ！」とテンションの上がる記事を掲載しています。
是非他の記事もご覧ください！
今回はKanbanBoardプラグインの設定についてお伝えします。
「一覧を看板形式で見やすくしたい！」と思っていらっしゃる方は必見です！
kintoneのアプリを使っている中でこんなシーンはないでしょうか？
「一覧の絞り込み機能は便利だけど一画面で絞り込んだデータを見たい！」
「一覧でレコードをグループ化してレコードを表示したい・・・」
「一覧の画面をもっと見やすくしたい・・・」
非常に便利な一覧の絞り込み機能。これまでこのデジタル道場でも絞り込み機能やプラグインについて触れてきました。
ただ、この表示はレコードのデータが行単位として並ぶだけで、絞り込みが複数あると一覧を切り替えてあっちの一覧を見て、こっちの一覧を見て・・・と手間が発生していました。
「いっそのこと他のシステムでもあるように条件をグループ化し一目でレコードデータが見れるようになったらいいのに・・・」そんな一覧の表現に対する不満を解消してくれるのが、今回ご紹介するKanbanBoardプラグインです！
『KanbanBoardプラグイン』とは
『KanbanBoardプラグイン』とは、一覧上のレコードを絞り込み条件でグループ化し、看板形式で表示させることのできるプラグインです。
それに加えて、表示しているレコードに対して色を付けることが可能です！案件の進捗状況や製品種別などで色分けをして、より見やすくできます。
また、KanbanBoardプラグインでは、日付の追加絞り込みを行うことで、指定した基準日に対して前後の年月日で絞り込んだレコードを表示させることができます。TODOアプリで使う際は、カレンダーで選択した日付の前後のタスクを絞り込むといった風にも利用することが可能です！
一目でその条件ごとにグループ化されたレコードを確認することができますね！
モバイル版での表示には対応しておりません。スマートフォンで確認する際は、kintoneをPC版に表示してからご確認くださいませ。
PC版表示について：https://jp.cybozu.help/k/ja/user/mobile_access/mobile_view.html
『KanbanBoardプラグイン』の設定方法
①一覧にKanbanBoardプラグインを設置するための一覧を作成します。
アプリの設定画面開きます。
KanbanBoardプラグインを設置したいアプリの右側の歯車マークをクリックします。
一覧タブをクリックし、新規の一覧を作成します。
アプリの設定画面に入ったら、一覧タブをクリックし、右側の＋マークをクリックし新規の一覧を作成します。
表示形式でカスタマイズを選択し、HTMLを入力した後に一覧設定を保存します。
一覧の新規作成画面に入ったら、一覧名を分かりやすい名前に設定します。
そして、「レコード一覧の表示形式」を「カスタマイズ」に設定します。
※一覧を表示する範囲は「PC版とモバイル版で表示する」にしておきます。
HTMLには下記を入力します。
<div id="kanbanboard-container"></div>
HTMLコードを入力したら、左上の「保存」ボタンを押して、アプリ更新を行います。
②プラグインをアプリに追加します。
プラグインはTiS様のサイトからダウンロードが可能です。
ページ中央部分の無料DLの下にある[ダウンロード]をクリックするとダウンロードできます。
その後、ダウンロードしたプラグインをアプリに追加します。
追加方法はこちらの記事をご覧ください。
③プラグインの設定を開きます。
アプリの右上にある歯車マークをクリックします。その後アプリの設定に画面が切り替わるので、設定タブ内「プラグイン」をクリックします。
『KanbanBoardプラグイン』の右横にある歯車マークをクリックします。
④プラグインの設定をします。
- 利用一覧：先ほど追加したカスタマイズ形式の一覧を設定します。
- 日付での追加絞り込み：有効にする場合はチェックを入れて基準となる日付フィールドもしくは日時フィールドを設定します。有効にすることで下記の日付の追加絞り込みを利用した条件を使用することが可能です。
【日付の追加絞り込みを利用した条件について】
この部分には関数を入力することで、カレンダーで選択した日付に限定せずレコードを表示することが可能です。
詳細：https://kintone.tis2010.jp/docs/plugins/kanbanboard/ja/
＜利用例＞案件管理アプリで本日の日付に対して見込み日が前後のレコードを表示する
「日付の追加絞り込みを利用した条件」を利用した一覧のイメージ
「日付の追加絞り込みを利用した条件」を利用する場合の設定イメージ
＜設定した関数＞
見込み日が本日に対して３日以前の案件：BEFORE(“-3 day”)
見込み日が本日の前後２日の案件：BETWEEN(“-2 day”,”2 day”)
見込み日が本日に対して３日以降の案件：AFTER(“3 day”)
- グループ分け：グループの条件を指定することができます。グループ名は一覧で表示するグループ名を、条件にはグループの条件を指定します。
- カードラベルフィールド：一覧で表示するカードに表示するデータを設定することができます。
- カード色：条件に応じてカードに色付けを行うことができます。
- 列幅：列幅のサイズを指定することができます。※200px以上のみ
⑤プラグインを保存し、アプリを更新します。
プラグインの設定画面の最下部にある「保存」ボタンをクリックし、アプリの設定画面に戻り「アプリを更新」をクリックして完了です！
最後に
いかがでしょうか？
kintoneの標準機能で表現できない一覧の表示の仕方でしたね！
「一目で一覧のレコードを把握したい！」という時におすすめのプラグインでした！
是非活用してみてください！
1人では設定が難しいかも…と思われる方もいらっしゃるかもしれません。
船井ファストシステムをご契約の企業様は、オンラインサポート（チャットもしくはWEBミーティング）にてご相談を受け付けておりますので、ぜひご活用ください！
