Home / DeveloperSection / Articles / SFDC: Modify a Page Layout

SFDC: Modify a Page Layout

Anonymous User 5603 10-Mar-2015

In my last post SFDC: Create customized views of data, we learned how to create a customized view for lists of data. However, you can also customize what's on the detail page for a particular record, or the page layout. Click an invoice and take a look at the default page layout for all invoices

SFDC: Modify a Page Layout


Open the Page Layout Editor

Use one of the following ways to open the page layout editor.

        While on the record page that you want to modify:

        Click Edit Layout.

        Click the Quick Access menu on the right, and choose Edit Layout.

        From Setup, click Create > Objects, click the object you want to change the layout of, scroll down to the Page Layouts section, and then click Edit next to the layout you want edit. 

Understand a Page Layout

Notice that the editor itself has upper and lower sections. The upper section is a retractable toolbox called the palette, and the lower section is the preview pane. When you scroll down the page, notice that the palette moves with you, which makes it easy for you to edit longer pages.

SFDC: Modify a Page Layout


SFDC: Modify a Page Layout

        The Highlights Panel is useful for displaying key information at the top of the page.

        The Actions in the Publisher section is useful for customizing the actions that appear in the publisher.

        At the top of the Invoice Detail, notice the area for standard buttons (Edit, Delete, etc.) and custom buttons

        Next comes the Invoice Detail, which has three default sections.

        Information typically contains fields that users can manipulate at some point during the lifecycle of a record (creation and updates). By default, this section has two columns for fields.

        System Information typically contains fields that the platform automatically maintains—fields that users cannot edit. This section is also a two-column layout.

        Custom Links typically contains custom navigation links.

        Below Invoice Detail is a section for Mobile Cards. By default, this section is empty, but it’s important to know that mobile cards only appear in Salesforce1.

        Last on the page is a related list for related Line Items. 


You can make many changes to the page layout.

1. Hover over a section title. The mouse pointer changes, indicating that you can drag the section to a new location relative to other sections.

2. Hover over the upper-right corner of any section. Two buttons appear: one for removing the section (don't click it!) and another for editing its properties. Go ahead and clickSFDC: Modify a Page Layout . You can now edit the name of the section (only for non-default sections), when to display the section header, the section layout (one or two columns), and the tab-key order among section fields. Click Cancel.

SFDC: Modify a Page Layout


Rearrange Fields on a Page Layout

In this step, make some simple changes to the Invoice Detail area of the page layout.

1.    ClickSFDC: Modify a Page Layout for the Information section (see above if you forgot how to find this) and change the section layout to one column. Click OK.

2.   Drag the Owner field above the Status field. When you’re done, the modified Invoice Detail area should look like this.

SFDC: Modify a Page Layout


Add Fields to the Related List

As it is now, the related list of Line Items is not very informative—it only has the line item numbers. In this step, improve the related list by adding some new fields.

1. Click Related List Properties (the wrench icon above the Line Items section), add Merchandise and Quantity to the

Selected Fields list, then click OK. When you return to the page layout editor, the related list preview should now appear similar to this:

SFDC: Modify a Page Layout

3.       That's it—you're done modifying the page layout. At the top of the page, in the toolbox, click Save.

Try Out the App

Check out the results of your work.

1. Click the Invoices tab to return to your app, and then click an invoice that has at least one line item.

2. Notice the rearranged fields in the Invoice Detail area, as well as the new fields in the Line Items related list

SFDC: Modify a Page Layout


Edit a Mini Page Layout

When you are in the Warehouse app, notice the Recent Items sidebar. Specifically, move over a recent invoice and notice that you get a mini page popup that previews the invoice information.

It's easy to change this default mini page layout as well.

1.       Return to the page layout editor for Invoice.

2.       Click Mini Page Layout at the top of the palette.

3.       Add Invoice Number, Owner, and Status to the list of selected fields, and then click Save. The improved popup should look more like:

SFDC: Modify a Page Layout

**This document is referred from salesforce help tutorials

Updated 07-Sep-2019
I am a content writter !

Leave Comment

Please enter subject.
Please enter comments message.


Liked By