優先度や進捗を画像で可視化する

この記事で学べること

​

Salesforceを利用している中で、「優先度に合わせて緑、黄、赤のいずれかのフラグ画像を表示したい」や「プログレスバーを使って進捗をより分かりやすくしたい」と思ったことはありませんか？Salesforceでは、カスタム数式項目を使用して、項目値に合った画像を表示することができます。

​

今回は、ToDoの優先度に合わせてフラグを表示する設定をしてみましょう。操作手順は、大きく次の2つに分けることができます。

数式項目による画像表示の操作手順

カスタム数式項目で使用する画像は、事前にSalesforceにアップロードされている必要があります。

１．[ファイル]タブをクリックします。

[ファイル]タブがない場合は、アプリケーションランチャーより選択します。

２．画像ファイルをアップロードするライブラリを作成します。

[新規ライブラリ]をクリックし、必要情報を入力後、保存します。

３．ライブラリに画像ファイルをアップロードします。

作成したライブラリを開き、[ファイルを追加]をクリックし、今回使用する3色の画像をそれぞれ追加します。

４．ライブラリを必要なメンバーに共有します。

ページレイアウトにカスタム数式項目の表示するユーザーに、画像ライブラリへのアクセス権を付与します。

５．各画像のURLをコピーします。

数式項目に画像URLを含めることで、項目での画像表示を実現します。画像タイトルをクリックしてプレビューを表示します。[画像のアドレスをコピー]をクリックし、画像URLをコピーしておきましょう。なお、数式では、アドレスの”/sfc”以降を使用します。

​

１．[設定]｜[オブジェクトマネージャ]より「活動」を選択します。

２．左サイドバーより[項目とリレーション]を選択し、[新規]をクリックします。画面中央に表示される[新規]より、新たに項目を作成します。

項目の詳細は、次のように設定します。

・項目の表示ラベル：優先度フラグ

・項目名：PriorityFlag

・データ型： 数式（戻り値：テキスト）

・項目レベルセキュリティ： 任意のプロファイル

・ページレイアウト： 任意のページレイアウト

・空白値の処理：空白項目を空白として表示

・数式：

IMAGE( CASE( Priority,

”高",

"/sfc/servlet.shepherd/version/renditionDownload?rendition=ORIGINAL_Png&versionId=0682x000004mKzH&operationContext=CHATTER&contentId=05T2x00000GYVvo",

"中",

"/sfc/servlet.shepherd/version/renditionDownload?rendition=ORIGINAL_Png&versionId=0682x000004mKyj&operationContext=CHATTER&contentId=05T2x00000GYVvj",

"低",

"/sfc/servlet.shepherd/version/renditionDownload?rendition=ORIGINAL_Png&versionId=0682x000004mKzC&operationContext=CHATTER&contentId=05T2x00000GYVOH",

""),

"Priority Flag")

​

任意のToDoを開くと、優先度に合わせて表示される画像が異なっていることが分かります。

さらに、強調表示パネルに追加することで、一目で確認できるようになります。強調表示パネルについて詳しく知りたい方はこちらをご覧ください。

​

優先度や進捗項目のリスト値が増えるほど、画像のアップロード作業にかかる工数は増加します。そんなときは、静的リソースを使用しましょう。静的リソースを使用することで、zip形式でファイルをアップロードすることができ、1つずつ画像URLをコピーする必要はありません。

静的リソース

静的リソースとは、数式項目やVisualforce ページで参照できるコンテンツをアップロードできる機能です。リソースには、zipやjarファイル、画像、スタイルシート、JavaScript、その他のファイルを使用できます。

[設定]|[クイック検索]より、「静的リソース」を検索し、選択します。[新規]より、今回使用するzipファイルをアップロードします。

数式項目で画像を使用する際は、静的リソース名とzipファイル名、画像名を指定します。

"/resource/静的リソース名/zipファイル名/画像名"

・数式

IMAGE( CASE( Stage ,

"要件確認","/resource/ProgressBar/ProgressBar/Bar1.png" , "要件確認" ,

"原因調査", "/resource/ProgressBar/ProgressBar/Bar2.png","原因調査",

"提案事項確認", "/resource/ProgressBar/ProgressBar/Bar3.png","提案事項確認",

"最終チェック", "/resource/ProgressBar/ProgressBar/Bar4.png","最終チェック",

"待機", "/resource/ProgressBar/ProgressBar/Bar5.png","待機",

"完了", "/resource/ProgressBar/ProgressBar/Bar6.png","完了"),"")

​

​

考慮事項

学習ツール

まとめ

リスト値に合わせて画像を表示することで、より簡単に優先度や進捗を確認することができます。設定する数式項目に合わせて適切な機能を活用し、効率的な組織設定を目指しましょう。