A well-designed page layout can often be used by both desktop and mobile devices. So far in my previous post, none of the objects are large and unwieldy on a mobile screen. However, we can imagine that an object with a hundred fields might be difficult to use on a phone. In cases like this, it’s useful to create a mobile-specific page layout. Just like the page layout you modified in the last post SFDC: Modify a Page Layout, a mobile-optimized layout can be assigned to different roles, so that people who primarily use a phone get the mobile version, while desktop-only users get the standard version.
In this post we learn how to:
• Modify an existing page layout so that it’s optimized for a mobile device—If your users access your app from desktop and mobile devices, then you might want to optimize your page layouts so that they work with various form factors. However, if your users are entirely or mostly mobile, they might find a mobile-specific layout is more productive.
• Create a compact layout—Compact layouts determine the fields that show up in a record’s highlights area and the record’s feed items in the full site. Compact layouts are a great way to display a record's key fields at a glance.
Create a Page Layout for Mobile Users
The objects in the Warehouse app don’t have enough fields to demonstrate why a mobile page layout is necessary, so in this step, you customize the page layout for the Account object. This object isn’t used in the Warehouse app, but it’s a useful exercise for any mobile layout.
1. First navigate to an existing account by clicking the (+) tab and then Accounts.
2. In the View drop-down list, select All Accounts.
3. Click the first account: Burlington Textiles Corp of America. Notice that there’s a lot of information on this page, and it might be a challenge to navigate on a small screen.
4. From Setup, click Customize > Accounts > Page Layouts, and then click New.
5. Name the page layout Account Mobile Layout and then Save.
6. Add a few fields that are important to mobile technicians. Drag the Account Site, Shipping Address, and Phone fields onto the Fields section of the preview pane.
7. Click the Related Lists category in the palette, and drag the Cases and Contacts elements to the Related Lists section. Related lists show up on the record related information page in Salesforce1. When mobile users assigned to this page layout views an account record’s related information, they’ll see preview cards they can click to see information about the cases and contacts for that account.
8. Click Save and then No when asked if you want to override users’ customized related lists.
9. Now you need to assign the mobile-optimized page layout to a user profile. Click Page Layout Assignment and then Edit Assignment.
10. Click System Administrator.
11. In the Page Layout to Use drop-down list, select Account Mobile Layout, and then click Save.
12. Now when you access the Account object, you’ll do so through the mobile-optimized layout. Try it now by going to Salesforce1 and tapping Accounts in the navigation menu.
Since you just accessed the Burlington Textiles Corp of America account from the full site, you should see that in the Recent Accounts list.
13. Tap that account.
Note: Normally, after creating a page layout for mobile users, you’d add it to a mobile user’s profile. To keep things simple (so that you don’t have to log out and switch users), you simply added the page layout to your own profile instead.
Display Key Fields Using Compact Layouts
Page layouts aren’t the only thing used to customize how your data appears in a mobile environment. Salesforce1 uses compact layouts to display a record's key fields at a glance.
Here, we create a custom compact layout and then set it as the primary compact layout for the Merchandise object.
1. From Setup, click Create > Objects, then click the Merchandise object.
2. Scroll down to the Compact Layouts related list and click New.
3. In the Label field, enter Merchandise Compact Layout.
4. Move Merchandise Name, Price, and Quantity to the Selected Fields list, and then click Save.
5. Now you need to set the compact layout as the primary. Click Compact Layout Assignment.
6. Click Edit Assignment, select the compact layout you just created, and then click Save.
Leave Comment