ツールチッププラグイン

ツールチップに画像を表示する

このページでは、ツールチッププラグインを使用して、ツールチップに画像を表示する手順を確認できます。

フィールド横のツールチップ内に、テキストとあわせて画像を表示できます。文字だけでは伝わりにくい入力位置や見本などを、画像で視覚的に補足できます。

運用中のアプリでも設定が可能です。今回の設定内容（設定手順）に基づいて作成したい方は、アプリテンプレートをダウンロードしてください。

まだ kintone にプラグインをインストールしていない方は、30日間のお試し申込をしてプラグインをご利用ください。

1必要なフィールドをフォームに配置する

アプリのフォーム設定で、任意のフィールドを設定します。今回の例では「品名」「品番」「ラベル見本（添付ファイル）」を配置します。「ラベル見本」には、品番の記載位置がわかるラベル写真を格納します。アプリテンプレートを利用する場合は、既に設定済です。

2ツールチップの文面を設定する

プラグインの設定画面を開き、「ツールチップの表示内容設定」タブを選択します。今回の例では、「品番」フィールドにツールチップを設置します。

表示内容には、次のテキストを入力します。

商品ラベルの「品番」に記載されているコードを、そのまま入力してください。
半角英数字・ハイフンはラベルどおりに入力します。

表示画面は、レコード一覧・詳細・追加・編集画面にチェックを入れます。

3ツールチップに画像を設定する

続いて、ツールチップに表示する画像を設定します。画像の指定方法には「URLで指定」と「添付ファイルフィールド」がありますが、今回は社内で管理しているラベル見本を使うため、「添付ファイルフィールド」から選択します。

表示内容の編集欄で、画像追加アイコンをクリックします。

「画像を挿入」画面で「添付ファイルフィールド」を選び、参照先アプリ・フィールド・表示する画像を指定して「この画像を挿入」をクリックします。今回の例では、参照先アプリにこのアプリを選び、フィールドに「ラベル見本（添付ファイル）」、画像にラベル見本の写真を指定します。

設定が完了したら、保存ボタンを押してアプリを更新します。

すべてのプラグインを
30日間無料でお試し