Salesforce’s most attractive features are those with the ability to customize anything and everything. Companies are always trying to get the most of Salesforce, and the ability to add images to Salesforce formula fields is one of the most used features. This essentially means instead of output a string of text or calculating a number, this formula provides you with a series of images depending on the scenario.
Create a formula field that displays the image
Have you ever seen records with fancy images displaying different values? Where the image is displayed on records, with a purpose to provide better look and understanding on the record. Have you ever wonder how this is done? We are providing you with a simple tutorial where you will get the skill on how to do this.
Source: Stack Exchange
This tutorial will be split into two parts one for Salesforce Lightning and one for Salesforce Classic.
Salesforce Lightning
Step 1: Install the Graphics Pack
Using the following link, install the Graphics Pack from Salesforce Labs. This will give you access to pages and pages of icons. If you or your company have already installed, Go to Step 4.
- Go to AppExchange.
- In the search bar write Graphics Pack.
- Press the green button ‘Get It Now’ on the right side.
- Log in to your org.
- Choose a user, that you want this package to be installed.
Step 2: Create a public library
- Navigate to “Files” by typing “Files” in the App Launcher and clicking the result.
- Click Libraries on the left-hand panel.
- Click the “New Library” button.
- Enter the library name (for example, “Public Images”).
Step 3: Upload your image file to your library
- Click the library that you just created.
- Click Add Files.
- From the select files dialog box, select the library you created in step 1.
- Click Done once the file has finished uploading.
Step 4: Repeat Step 3
When you repeat step 3 a couple of times you are adding all the images that you want to add in that specific library that you have created in Step 2.
Step 5: Create a new “Text” type Formula Field
- Go to Setup | Objects and Fields | Object Manager — Select the Object you are going to customize (Accounts, Case, Opportunity).
- Click Fields & Relationships.
- Click New.
- Select Formula.
- Click Next.
- Enter your custom field name, then select Text from the “Type” picklist.
- Click Next.
- In the “Enter Formula” screen, click Advanced Formula.
Step 6: Obtain the URL to the files you uploaded
- Go back to Files.
- Select the library you created in step 1.
- Click the image to preview it.
- Right-click the image and click “Copy image address.”
- Save the image address temporarily so that you don’t lose it.
- The image_url should look something like this:
/sfc/servlet.shepherd/version/renditionDownload? rendition=ORIGINAL_Jpg&versionId=06846000002mPro&operationContent=CHATTER&contentId=05T46000009hQHt/image.jpg
- You may also use an abbreviated format for the image URL:
/sfc/servlet.shepherd/version/download/06846000002mPro
- Notice that the abbreviated format uses the versionId from the first format, and the image name does not appear anywhere in the URL.
Step 7: Enter your image URL into your Formula Field using the “IMAGE” function
- In the text area, enter your formula using IMAGE to retrieve the image file you uploaded in step 2.
- Paste the image URL into the ‘image_url’ portion of the IMAGE function.
Step 8: Repeat step 5 and step 6
Step 9: Grant Field-Level Security
Grant the appropriate Field-Level Security to your Formula Field, then click Next.
Step 10. Include the Formula Field
Salesforce Classic UI
Step 1: Install the Graphics Pack
Using the following link, install the Graphics Pack from Salesforce Labs. This will give you access to pages and pages of icons. If you or your company have already installed, Go to Step 4.
- Go to AppExchange.
- In the search bar write Graphics Pack.
- Press the green button ‘Get It Now’ on the right side.
- Log in to your org.
- Choose a user, that you want this package to be installed.
Step 2: Create a public folder to hold your image files
- Click the Documents tab.
- Click Create New Folder.
- Enter the folder name (for example, “Public Images”).
- Give users “Read-Only” access to the folder and make it accessible to all users.
Step 3. Upload your image file to your Documents storage area
- Click the Documents tab.
- Click New.
- Enter the document name to be displayed on the browser.
- From the “Folder” picklist, select the folder you created in step 1.
- Click Browse to look for and select the file to upload.
- Click Save.
Step 4: Repeat Step 3
When you repeat Step 3 a couple of times you are adding all the images that you want to add in that specific library that you have created in Step 2.
Step 5: Create a new “Text” type Formula Field
- Go to Setup | Customize | <Object> — Select the object you are going to customize (Accounts, Case, Opportunity).
- Click Fields.
- Under “Custom Fields,” click New.
- Select Formula.
- Click Next.
- Enter your custom field name, then select Text from the “Type” picklist.
- Click Next.
- In the “Enter Formula” screen, click Advanced Formula.
Step 6. Obtain the URL to the files you uploaded
- Click the Documents tab.
- From the “Folder” picklist, select the folder you created in step 1.
- Click Go.
- Click View next to the name of the file you want to use. A new browser window or browser tab open.
- In the browser’s address bar, select and copy the URL.
Step 7: Enter your image URL into your Formula Field using the “IMAGE” function
- In the text area, enter your formula using IMAGE to retrieve the image file you uploaded in step 3.
- Paste the image URL into the ‘image_url’ portion of the IMAGE function.
Step 8: Repeat step 5 and step 6
Step 9: Grant Field-Level Security
Grant the appropriate Field-Level Security to your Formula Field, then click Next.
Step 10. Include the Formula Field
(This behavior can be seen in both Salesforce Classic and Lightning Experience).
Formula Examples
Example 1
This example displays a GIF image of a green square if the amount of an opportunity is greater than 100, a yellow square if it’s under 51 and 99, and a red square if it’s less or equal to 50.
IF( Amount > 100, IMAGE("/servlet/servlet.FileDownload?file=01570000000Q6El", "Green"), IF ( Amount > 50, IMAGE("/servlet/servlet.FileDownload?file=01570000000Q6Ef", "Yellow"), IMAGE("/servlet/servlet.FileDownload?file=01570000000Q6Ep", "Red")))
IMPORTANT: Although percentage fields appear to have whole number values, they are decimals. For example, 50% in the opportunity probability field is entered as 0.5, not 50. So the formula for a percent field should look like this (using probability field as an example):
IF ( Probability > 0.50, IMAGE("/servlet/servlet.FileDownload?file=01570000000Q6Ef", "Yellow")
Example #2
This example displays the JPG image of a flower regardless of the value in any field.
IMAGE("http://images.odeo.com/1/8/4/Zencast.jpg", "Flower", 300, 300)
Need more inspiration? Check out the Sample Image Link Formulas.
Educate Yourself Further
Read more about Customize your Salesforce App Branding
Check out this Trail: Advanced Formulas
Share this article...
Hello there! I know this is somewhat off topic butt I was wondering iif you
knew where I could ffind a captcha plugin for my coment form?
I’m ussing the ssame bkog platform as yours and I’m having diffiulty finding one?
Thanks a lot!