Upgrade Case Layouts

When you move to Service Cloud in Lightning Experience, you need to think about page layouts a little differently. Of course, you can still use page layouts to add, remove, reposition, and update field properties. But with the out-of-the box three-column layout on cases, you might not need to change a thing. After all, the preconfigured case layout in the Service Console was designed with support agents in mind. The most important fields are front and center and easy to spot, whether in a Related Record component (1), on the Details tab (2), or in a new record or edit overlay (3).

You may, however, want to bake some things into the existing case page layout. For example, when moving to Lightning Experience, you might want to add more case fields, change the fields that appear in a Related Record component, or move items around in the three-column layout. To do that, you have a few tools to work with:

1. Page Layout Editor
2. Actions Layout Editor
3. Lightning App Builder

Since Lightning Experience offers you more tools to change layouts, our earlier theme of “You did this in Salesforce Classic, this is how you do it in Lightning Experience,” gets tricky. That’s because you have more options and new questions to ask:

• In which column do I want a field to appear?
• Do I want to change preconfigured Related Record components?
• Do I want to change fields in Related Record components, page layouts, or both?

We’re going to show you the answer to those questions. And we’re going to do so with a scenario that we use in the rest of this unit.

The scenario: Like any good admin, you showed your support team the preconfigured three-column layout for cases in the Lightning Service Console, and asked them which fields, columns, and Related Record components you should update to improve their daily workflow. They said, “Make it more like our old console. We want the Case Reason field moved closer to the Priority field, and we’d like to see account information in the first column too.”

Into the bakery we go!

Your support team’s request to move Case Reason closer to Priority gets you right into page layouts. When you move fields around on page layouts in Lightning Experience, the results appear in both the Details tab and the new record or edit overlay.

To make this change:

1. From Setup, click the Object Manager tab. Select Case, and open the Case Page Layouts setup page.
2. Select the page layout in which you want to move fields, and click Edit.
3. Similar to Salesforce Classic, drag Case Reason under Priority.
   
4. Click Save.

Now when your agents look at case details, or create or edit a case record, Case Reason is under Priority to make their lives easier.

As you recall from the previous scenario, your agents want to see account information in the first column of the Lightning Service Console. To add anything to the existing tiles or information in that column, you work with Related Record components.

Related Record components provide functionality similar to lookup components in Salesforce Classic. As you remember, lookup components let users see or update fields alongside related records.

Behind-the-scenes, Related Record components use quick actions to display fields and provide console users with built-in record creation and in-line edit. Console users can update records, create records, and link records—all without leaving the page. You can configure Related Record components to show details about a contact on a case, or even the details of a case’s account.

To add account details to the first column of the Lightning Service Console, we first create a quick action that updates accounts. Then, we add the quick action to a Related Record component with the Lightning App Builder.

To give your support team the visibility they requested of accounts alongside cases requires that we create a quick action for accounts.

1. From Setup, click the Object Manager tab. Select Account, and open the Account Buttons, Links, and Actions setup page.
2. Click New Action.
   
3. For Action Type and Standard Label Type, select Update Record. This lets agents update fields on existing accounts related to cases that appear in the Lightning Service Console.
4. In Name, type a unique API name for the quick action, and click Save.
   
5. Arrange the account fields in the order that you want. Keep in mind that these fields are displayed in the Related Record component in the console. Let’s drag Account Number to the quick action layout, and click Save.
   

Now that your quick action for accounts is finished, the next step is to add it as a Related Record component on the case page layout for the Lightning Service Console. To do that, we use Lightning App Builder.

The Lightning App Builder helps you quickly add, remove, and update items on the Lightning Service Console’s preconfigured three-column layout. Let’s use it to add a Related Record component that shows account details.

1. From the Service Console, click and Edit Page.
   
2. In the Lightning App Builder, click Related Record in the list of standard Lightning Components and drag it to the first column. By default, it uses the case object as the lookup field, but we change it to accounts in the next step.
   
3. Under Lookup Field, choose Account Name. This updates the Related Record component to accounts, which is what your support team asked for.
   
4. Under Update Action, use the dropdown menu to select the account quick action that you created earlier.
   
5. Click Save.
6. Click Activation and select App Default. Since we want to assign the new case record layout to our Lightning Service Console app—not our entire org—click Assign as App Default.
   
7. Select Service Console and Next.
   
8. Review the assignment, and click Save.
9. At the top of the Lightning App Builder page, click Back.
   

Now when you refresh the Lightning Service Console or select another case, you see an Account Details Related Record component in the first column—just as your support team requested!

To recap, you updated the preconfigured case layout in the Lightning Service Console to improve your support team’s productivity. By request, you moved the Case Reason closer to Priority by editing case page layouts. Also, by request, you added an Account Details Related Record component to the first column of the console using a combination of quick actions and the Lightning App Builder.

Tip

Now that you know how to create quick actions and associate them with Related Record components, you can use the same process to customize the preconfigured Case Details and Contact Details Related Record components in the Lightning Service Console. For example, if your agents want to see the Case Reason field in the console’s first column, just create a new case update quick action. Then use the Lightning App Builder to modify the existing Case Details Related Record component so the Update Action field points to the new quick action.

Now that you know how to upgrade your console, case feed, and case layouts in the Lightning Service Console, you’re well on your way to moving into the future. Celebrate the new life you’ve breathed into your org with a big piece of cake. Chocolate or vanilla, it doesn’t matter as long as you blow out the candles.