logo Ribbit's works
にメンテナンス済み

目次プラグイン

レコード編集画面、詳細画面に目次を追加し、任意のセクションへスクロールできるようにします

kintone はその性質上、1つのアプリに多くのフィールドが存在するような構造になりやすいです。

そういった際に課題となってくるのが、レコードの詳細画面や編集画面の見やすさ、使いやすさではないでしょうか。

当サイトでは多くの kintone プラグインを公開していますが、その中の1つにタブプラグインがあります。

タブプラグイン

このプラグインは、前述したような課題を解決するために開発されました。

レコードの詳細画面、編集画面にタブを追加することができるプラグインで、フィールドはもちろん、スペースやラベルの表示・非表示にも対応しています。

ただ、タブを切り替える度にフィールドの表示・非表示を切り替えるため、JavaScript カスタマイズで表示・非表示を制御している場合、 タブを切り替える度に表示・非表示がリセットされてしまうという問題がありました。

この問題を解決するため、見やすさ、使いやすさを向上するアプローチとして、フィールドの表示・非表示を制御するのではなく、目的の位置までスクロールするプラグインを開発しました。

プラグインの概要

プラグインは、レコードの詳細画面、編集画面に目次を追加することができるプラグインです。

スペースフィールドを見出しとして設定することができ、設定した見出しの一覧が左側に表示されます。

一覧の特定の行をクリックすることで、紐づく見出しの位置までスクロールすることができます。

プラグインが提供する機能

  • レコードの詳細画面、編集画面に目次を追加する
  • アプリのスペースを見出しとして設定し、目次に表示する
  • 目次の特定の行をクリックすることで、紐づく見出しの位置までスクロールする
  • 目次の幅の調整

プラグインの特徴

フィールドの表示・非表示と競合しない

フィールドの表示・非表示は、公式の JavaScript API も用意されている程、kintone のカスタマイズの中でもよく利用される実装です。

しかし、タブプラグインのようにフィールドの表示・非表示を切り替えるプラグインと組み合わせると、タブを切り替える度に表示・非表示がリセットされてしまうという問題がありました。

このプラグインは、フィールドの表示・非表示と競合せず、スクロールすることで目次を表示するため、 フィールドの表示・非表示を制御するプラグインや JavaScript カスタマイズと組み合わせても問題なく利用することができます。

プラグインが活きるシーン

  • レコードの詳細画面、編集画面に多くのフィールドが存在する場合
  • フィールドの表示・非表示を制御するプラグインや JavaScript カスタマイズを利用している場合
  • アプリの閲覧性向上と、サイト内検索を両立させたい場合

プラグインのソースコード

当プラグインはオープンソースです。 プラグインがどういったファイルで構成されているのか、どのように実装されているのか、全てのプログラムを Github から確認することが可能です。

プラグインのソースコードを確認されたい方は、当ページトップの「ソースコードを確認する」ボタンからプラグインのリポジトリにアクセスすることができます。