How to make Image URL Dynamic in Data Recipe in CRM Analytics/Tableau CRM
A picture speaks 1,000 words because Our human brains prefer visuals over text.so, if you use high-quality visual aids in your Dashboard along with the text it will significantly increase the chances of your audience paying attention as well as wow them a bit.
Business Use case :-
You have a requirement where you would need to show column data as a pictorial representation/custom icon image. or Images to represent the Column data represented in data.
Eg: Based on the Customer Type & Billing country custom Icon would show on the dashboard table.
Problem Statement:-
The Uploaded image can be any image you’d like to use, as long as those images live in Salesforce. In order to represent the images on the dashboard you have to have an image link at the record level. we could achieve this in two ways one is by preparing a CSV file containing the set of links, Data, and then exported as a dataset in Analytics Cloud or by creating a hardcoded link value directly in Data Recipe. both ways involve manual steps so when you are deploying this component to the higher orgs you have to change the CSV file or Hardcoded Link value as Post-deployment activities in every time which may lead to manual error.
Would it not be better If the URL gets changed based on the target org..? sounds like good right…? let's jump into the solution.
Solution
Leveraging the Domain object to get the base URL along with String Manipulation we will be able to make the URL string which will act as a dynamic in every org.
Considerations :
Let's make sure that your org uses the Custom domain with Enabled Enhanced Domain to apply this approach. If enhanced domains are enabled in your org, the My Domain name is used as the subdomain for URLs across your org, including Salesforce Sites and Experience Cloud sites.
Salesforce enforces enhanced domains in all orgs in Winter ’24.so we are good to follow this approach.
Step 1:- Add Images to the Gallery
use these steps to upload the files to the image gallery
- From the App Launcher, find and select Analytics Studio.
- Click Create and select Dashboard
- In the template chooser, click Create Blank Dashboard.
- From the left-hand toolbar, drag an image widget onto the canvas.
- In the center of the image widget, click Image.
- In the image selection window, click Gallery, then click
- Select the Required image files and click Open to upload them. The Images now appear in the gallery.
- Select the image and right-click, copy the image link. paste it on the Notepad.
- Repeat Step 8 for all the images.
Now we’ve got a gallery full of required Images! Next, we’ll see how to bring the Image URL to the record level in the dataset that can use those images.
Step 2:- Prepare Dataset
My Domain URL Format For Enhanced Domains Org:
Sandbox Org URL Format
Production Org URL Format
For more details about My Domain. please refer to the below help document.
If you look at the copied image URL from step 8 it would be like the below. in this URL Sandbox Name Part (After my domain name)will be varying for all of the sandboxes org. so we are going to retrieve this part from the Domain object. Protocols, Hostname, path, and parameters will remain the same for all the org. hence we are going to pass these four values as hard-coded to form the URL.
Note:- URLs for Developer Edition org and sandboxes use different formats.so the below developer org URL doesn't have the sandbox name, only my domain exists.
Step 1 :
As we have seen before If enhanced domains are enabled in your org, your My Domain is used as a subdomain in your Experience Cloud sites and salesforce sites. so in our case, we would need a base URL (My Domain)for the respective org. hence we are good to use the Domain object to extract those.
Load the ‘Domain’ object in Data Recipe.
Step 2 :
If you look at the URL Format of the enhanced domain Login on ‘Prepare dataset section’. A My Domain uses Salesforce domain suffixes such as my.salesforce.com or my.salesforce-sites.com based on the Org type Across your org’s URLs.So we would need to split down the Salesforce domain suffixes from the Domain Name field to get the Base URL.
Eg: the following is the Base URL for this Org https://manufacturingcloudcom-6b-dev-ed.
First, we would need to locate the position of the Salesforce domain suffixes where they start. Salesforce domain suffixes start with the ‘My’ substring so we have to get the position of the ‘my’ substring in the given String.
Formula : instr(field, searchString, [position, [occurrence]])
Now we know the Position of the Salesforce domain where its starts in the given string. what we have to do is to split the string till the starting position of the Salesforce domain by passing the instr functions inside the substr as a length of the string we wanted to extract.
Formula : substr(field,position,len)
Note: if you look at the above formula you noticed that we are subtracting the instr output by 1 because we are trying to locate the position of the ‘my’ substring in the String. so it will give the position value till ‘m’ but we don't want to include that in our final string that's the reason why we have subtracted 1 from the instr output.
Step 3:
we have the base URL string but we ended up having two rows we wanted only one row at the end of this stream to augment the Account level. so we are doing the Aggregation by the “Extracted Base URL” row.
Step 4:
Dropping the unnecessary Aggregated column from the stream node.
Step 5:
Augment the Extracted Base URL column to the required object level. in this demonstration at the Account level. but this Extrcted Node doesn't have the matching key to perform the join operation. therefore we are going to perform a cross-join operation in that case all of the rows on the right-hand side will get added to each of the rows on the left-hand side.
Note:
Limitations for Cross Join
Because a cross-join creates a larger dataset than either of the source datasets, it has some limitations. Keep these points in mind when designing and testing your cross-join.
- Only one cross-join per recipe
- Cross-join results maximum of 10 million
- Left dataset column maximum of 8 and row maximum of 100,000
- Right dataset column maximum of 8 and row maximum of 1,000
- Doesn’t support multi-value columns
Step 6:
Now we have the extracted Base URL at the Required Object level, in this case, at the ‘Account’ level. now it's time to form the URL string based on the business condition.
Scheme/Protocols will be the same so we can concatenate the protocols prefix to the Base URL which we retrieved from the last step.
HostName will be the same because we are going to access the content(Files) URL type. so we can take it as it is “file.force.com/” .
The path also remains the same for all org because our stored images are under the file-asset path. so we can take it as it is “file-asset/”.
The parameter is nothing but the file Name in this case it's just ‘Image Name’, so based on the record type Custom Image gets changed. in this case, you have to modify the parameter based on the record type criteria and then concatenate the suffix to the Protocols + Mydomain + HostName+Path. our final URL string looks like below
https://manufacturingcloudcom-6b-dev-ed.file.force.com/file-asset/CustomerDirectpng
Note:-
You can take All these Protocols, HostName, Path, and Parameter values from step 8 of Add images section and then pass it to the formula or you can form the string if you are sure about the FileName otherwise we will get an error.
Eg: when the Account type is Customer then “customerjpeg” (Image name) will be the parameter.
Eg: when the billing country is US, USA, United States then “flagusapng” (Image Name) will be the parameter.
Note:- The Parameter/filename at the end of the URL leaves off special characters such as hyphens and periods.
Step 7:
Now we have a custom image URL in the node. we can augment these to the master Stream and Register them as a Dataset
Please refer to the below video for more about Data Recipe
Step 3:- Create a Dashboard Detail Table with Custom Icons/Images
Step 1 :
Create a Detail Table Query with all the required fields along with both of the custom Image URL Fields by using the above dataset in Dashboard.
Step 2:
Bring the created Query on the Dashboard palate, Click on the “Column” tab on the right-hand palate.
Step 3:
From the ‘Choose Column’ option select the Appropriate column which has the Image URL then Select an “Image” from the ‘Show Data As’ option.
Repeat the above step for all the Image URL Coulmns in the Query.
Step 4:
Click Save and enter the following values:
i.Title: Name the dashboard
ii. App: Select the App
Click Save.
Please refer to the below video for more details about the dashboard
Key Takeaway :
When you are deploying the components you must include all of these images in the package XML.
Conclusion
As much as if we eliminate the manual steps we can save time as well as we can avoid manual errors. For this kind of business requirement, we can utilize the Domain object to get the Base URL then we can pass the rest of the URL elements as a hardcoded value to form the URL string. In this approach, we can mitigate the manual steps of CSV uploads or hard-coded value changes every time when we promote our components to higher orgs.
Happy Learning
you can follow me on linked @linkedin.com/in/ramdoss-k-5157566a
