弊社では、キントーンのフィールドに?ボタンを表示し、カーソルを合わせることで吹き出しメッセージを表示するプラグインを提供しています。このプラグインを用いることで、次のお悩みを解決することが可能です。
- 「入力項目に対する補足メッセージが長く、画面の表示領域を多く使ってしまう」
- 「アプリのレイアウトを崩さずに備考メッセージを表示させたい」
- 「ヘルプメッセージを常に表示させる必要は無いが、必要なときにのみ表示させたい」
本ページでは、吹き出しメッセージ表示プラグインのインストールから変換設定の方法までをご説明します。
※kintone吹き出しメッセージ表示プラグインの詳細はこちらをご確認ください。
プラグインのインストール
プラグインファイルのダウンロード
まず、プラグインファイルをダウンロードします。吹き出しメッセージ表示プラグインのダウンロードはこちらからお問い合わせください。
プラグインのインストール
以下のページの「ファイルから読み込んでインストールする」の説明を参考に、プラグインをインストールしてください。
※この操作はkintoneのシステム管理者で行う必要があります。
https://jp.cybozu.help/ja/k/admin/plugin.html
プラグインをアプリに追加
以下ページを参考に、アプリにプラグインを追加してください。
https://jp.cybozu.help/ja/k/user/plugin.html
プラグインの設定
変換設定
アプリにプラグインを追加後は、プラグインの一覧に「吹き出しメッセージ表示プラグイン」が表示されます。本プラグインの設定ボタン(歯車)をクリックします。
プラグインの設定画面が表示されます。「アクティベーション」と「全般設定」と「吹き出し設定」の設定を行います。
アクティベーション
“アクティベーションキー”には、無償版でご利用の場合は何も入力をしないでください。有償版をご利用の場合は、弊社からご連絡したキーを入力します。
全般設定
“吹き出しのフォントサイズ”には、噴き出し内の文字サイズを指定します。
“吹き出し表示適用範囲”には、噴出しを表示させる対象を指定します。
- フィールド名のみ・・・数値フィールドや文字列 (1行)フィールドなど、入力フィールドのタイトル部分にのみ表示します。
- ラベルのみ・・・ラベルにのみ表示します。
- フィールド名とラベル・・・上記の両方に表示します。
吹き出し設定
“フィールド名”には、アプリ内の入力項目のタイトル(フィールド名)を指定します。
“吹き出しへの表示メッセージ内容”には、表示するメッセージ内容を入力します。吹き出しメッセージは自動的に折り返しされないため、改行して横幅を調整してください。
“表示位置”には、?にカーソルを合わせた際に表示される噴き出しツールチップの位置を指定します。表示位置には次の11種類の中から選択可能です。
- 上(左寄せ)、左上、真上、右上、上(右寄せ)
- 左、右
- 下(左寄せ)、左下、真下、右下、下(右寄せ)
保存
変換設定後に画面の下までスクロールし、「保存」ボタンをクリックします。
アプリの更新
保存後は以下の画面が表示されますので、「アプリの設定に戻る」または「アプリ設定」のリンクをクリックします。
画面右上の「アプリの更新」ボタンをクリックします。
以上でプラグインの設定は完了です。
画面を表示すると、設定したフィールドに対して?ボタンが追加され、カーソルを合わせるとメッセージが表示されます。
<一覧画面に表示した場合>
<詳細画面、追加画面、編集画面で表示した場合>
よくある質問
Q.プラグインの設定を変更したが、画面で反映されない。
A.アプリの更新を行っていない可能性があります。プラグインの変換設定を変更した場合は必ずアプリの更新まで行ってください。
Q.プラグインの設定を変更したが、一覧画面のフィールドに?が表示されない。
A.表示対象フィールドの幅を広げると、?が表示されます。
Q.吹き出しにリンクを追加したいがどうすればいいのか?
A.aタグを使用します。
(例)キントーンプラグインへ と表示したい場合、<a href=”http://ait-labo.com/system/kintone-plugin/” target=”_blank”>リンク</a> を設定する。
Q.吹き出しにリンクを追加したが、ページに飛ばない。どうすればいいのか?
A.ダブルクォーテーションが半角文字で指定されているかを確認してください。
誤:<a href=”http://ait-labo.com/system/kintone-plugin/” target=”_blank”>キントーンプラグインへ</
正:<a href=”http://ait-labo.com/system/kintone-plugin/” target=”_blank”>キントーンプラグインへ</