In this Salesforce tutorial, we will discuss building a custom record page for a Mobile App in Salesforce Lightning.
We are going to cover the following points in this tutorial.
- Create a customized object record page for a Salesforce Mobile app.
- Activate the custom record page for the users in the Salesforce App.
Record Pages for Salesforce Mobile App
In Salesforce lighting, we can a Record Page for the Desktop application and Mobile Applications with the help of Lightning App Builder, that too without code and just in clicks. However, unlike the Home page, custom record pages are not only supported in Lightning Experience on desktop but also in Salesforce Mobile Applications.
In Salesforce Record pages are designed to be mobile-responsive, ensuring that users can access and interact with records on their mobile devices seamlessly, providing a better user experience.
While working for an organization that uses Salesforce as its CRM tool, I was asked to build a record page for the Mobile app view. The sales team uses the Salesforce Mobile App extensively to access customer information, update opportunities, and close deals.
To ensure that the sales team can efficiently perform operations from their mobile devices, it was to create a custom record page for the Salesforce Mobile App. Now in the below steps, I will show how I handled this situation and came out of it.
Create a Lightning Record Page for the Mobile app
To create a customized object record page for a mobile app, first log in to your Salesforce developer account and follow the steps below.
Step-1: On the Setup page of Salesforce Lightning, go to the Quick Find box and search for App Builder and from the options in the dropdown select Lightning App Builder.
Step-2: In the Lightning App Builder Setup page click on the New button to create a new record page.
Step-3: As we click on the New button a pop-up window will appear and here we can see options to create a custom lightning page. Now from here select the option Record page and then click on the Next button.
Step-4: In this step, we will add a Label and Object for the record page. In the Label tag enter the name of the custom record page and in this case, I’ve named it the Custom Opportunity page.
In the Object field search and select the object type for the custom Record page. In this case, I have selected Opportunity as an object for the record page. After adding Label and Object click on the Next button.
Step-6: In this step, we will select the template format from the list of template formats on the left-hand side. For this record page, I have selected the template format Header and Left Sidebar. After selecting the template format for the record page, click on the Done button.
Step-7: As we click on the Done button, Lightning app builder will open here we first set the page view to mobile view and for that click on the Desktop dropdown on the top of the screen, and from the options in the dropdown click on the Phone option.
Step-8: Now we will standard components to the templates of the app page. On the left-hand side, we can a list of standard components under the heading Components and from here we will drag these components to the template region.
Since we are creating this record page to track opportunities so, to display opportunities, add the Highlights panel component to the top region as shown in the picture below.
Step-9: Now add the components Record detail – Mobile and Tabs to the template regions of the record app page.
Step-10: In the Tabs component we already have two tabs Related and Details. Now to add more tabs click on the Tabs component and on the right-hand sidebar click on button Add tab and then click on the copy of details tab then under the heading tab-label select a tab. In this case, I have selected the tab Chatter and after adding the tab click on the Done button.
Step-11: To add component visibility to the components, click on the Add Filter button under the heading Set Component Visibility. In the field Filter type select Record Field and in the Field, select the fields from the list. In this case, I have selected Opportunity Name as a Field and Operator should be Equal. Last click on the Done button.
Step-12: We have created the Record page for the mobile app. Now click on the Save button to apply these changes.
Activation of Lightning Record Page in Salesforce App
Till we have created a record page, we will move ahead toward the activation of this record page in a Salesforce Lightning app.
Step-1: In the Lightning app builder page click on the Activation button which is on the top of the screen near the Save button.
Step-2: As we click on the Activation button a pop-up window will appear on the screen. in this window, we can see three tabs ORG DEFAULT, APP DEFAULT, and APP, RECORD TYPE, AND PROFILE. Here click on the tab APP, RECORD TYPE, AND PROFILE.
Step-3: In the tab APP, RECORD TYPE, AND PROFILE click on the button Assign to Apps, Profiles, and Record Types.
Step-4: In this step, we select the application to which we have to assign this record page. I have selected the app Mobile App for this Custom Record Page.
Step-5: In this window Select Form Factor, We will select the form factor that we want to apply to the application. There are three options for the form factor, Desktop and Phone, Desktop, and Phone. In this case, I have selected the form factor Desktop and Phone. After selecting the form factor, click on the Next button.
Step-6: In this step, select the Record Type Master by activating the checkbox Master under the heading Record type. After selecting Record Type, click on the Next button.
Step-7: In the window Selected Profiles we have to select the profile to display this record app page. To select the profiles go to the Profile column and activate the checkbox of the profile that you have to select and after selecting the profiles click on the Next button.
Step-8: As we click on the Next button, the Review Assignments window will appear. In this window, we can review the app, record type, profile, and form factor that will display the “Custom Opportunity Page” record page. After reviewing the assignments click on the Save button.
As we click on the Save button, the record page “Custom Opportunity Page” will be activated in the selected mobile app.
Now we have successfully created and activated a custom record page in the Salesforce Lightning Mobile App.
In this Salesforce tutorial, we have learned about building a custom record page for the mobile app in Salesforce. We first created a custom record page for a mobile app with the help of Lightning app builder and later activated that record page in a Salesforce mobile app.
You may like to read:
- How to Embed Report Chart to Salesforce Record page
- How to Add Calendar to the Record Page in Salesforce Lightning
- How to Create Different Page Layouts and Apply to Users in Salesforce
I am Bijay Kumar, the founder of SalesforceFAQs.com. Having over 10 years of experience working in salesforce technologies for clients across the world (Canada, Australia, United States, United Kingdom, New Zealand, etc.). I am a certified salesforce administrator and expert with experience in developing salesforce applications and projects. My goal is to make it easy for people to learn and use salesforce technologies by providing simple and easy-to-understand solutions. Check out the complete profile on About us.