In the library management system, we have so far created different objects to collect data on media and customers. In this exercise, we will continue working on the same application and create tabs for the objects.

Create object tabs for all the objects created in Chapter 2, Creating a Database on Force.com. To create a Custom Object tab, perform the following steps:

The tabs will be the starting point for the user in the journey of that object. When the user logs in to Salesforce, they will navigate to the object tab and come across the List View of their recently viewed records.

The following screenshot shows the list view layout of the Opportunity object:

We can choose the fields that are displayed on the list view and remove the unnecessary ones. The list view gives a glimpse of multiple records at a time; it is important to show valid and relevant data, which the users can further drill down after they click on the name.

When the users click on the name of the record, they are shown the Detail View of the record. The following screenshot shows the detail page for sample records:

We will take a look at the layout editor in detail in the next section.

When the user clicks on the Edit button on the detail view, they are taken to the edit view of the record. The edit view provides an input form for different types of fields. The edit view follows the pattern of the detail view and only editable fields are shown in this view. The edit view cannot be customized separately from the detail view.

The following screenshot shows the edit view for the same opportunity:

Using the page layout editor, we can customize the data they can see on the Detail View. We can highlight the important data at the top of the page for easy access. We can logically group different fields in sections so that it all looks aesthetically pleasing. Using the page layout editor, we can also mark a few fields as read-only for users. However, we need to keep in mind that the page layout editor can only hide or show fields on the UI. The user can still access the field from the API and data loader if they have access to it.

To open the page layout editor, go to Setup | Create | Objects | Custom Object name | Page Layouts.

Normally, every object will be assigned a single default page layout that is accessible to all the people. Some standard objects have multiple page layouts, for example, the case object has a separate Close Case Layout. The account object has separate page layouts for marketing, sales, and service. To modify a page layout, make sure that you identify which profile the page layout is accessible from to prevent data visibility problems. The following screenshot shows the enhanced page layout editor:

At the top of the page, we will see the panel that contains the elements that can be added to the page:

The sidebar on the left-hand side allows us to select from the different categories of elements, and the main panel on the right-hand side lists the elements that can be added on the page.

We can select between Fields, Buttons, Action, Expanded Lookups, Related Lists, and Report Charts. All the elements have a specific position on the page layout, which we will see in the next section.

To add a new element to the page, simply drag it from this panel onto the layout; the relevant section is highlighted in green.

We will take a look at each of them in detail in the upcoming sections.

The next part of the page layout editor is the highlight panel. We can drag the quick actions onto the highlight panel. These actions are visible on the Salesforce1 Mobile view:

The quick actions are available in the Salesforce classic view, and the Salesforce1 actions will be visible in the new Lightning Experience, as shown in the following screenshot:

The main panel displays the fields in two columns and is grouped together by sections. We can add multiple sections that can logically group the fields for convenience and better user experience. The blue dot on the field indicates that the fields are required to save the record. A red star against the field indicates that the fields are required on the page layout.

We can create the field as required on the page layout that was not previously marked as required during field creation. However, doing so will make the fields required only on this particular page layout and the user will be able to insert the record without any data in the field. The lock item indicates that the field is uneditable on the page; this field will not be displayed on the Edit layout:

Apart from adding Fields and Buttons, the advance page layout editor also helps us group different fields in sections and add blank spaces for the alignment. The following screenshot shows Section and Blank Space in the editor:

Section and Blank space are explained as follows:

Field options

When we add fields on the page layout, they can be made Required or Read-Only by setting their properties. The Field Properties dialog box shown in the following screenshot can be accessed by clicking on the wrench symbol on the desired field:

As shown in the preceding screenshot, we can set the field to Required or Read-Only on the page layout. As mentioned in the previous chapter, if the field is not universally required (set as required during the creation of the field), it can be made required on the page layout.

Note

It should, however, be noted here that a field marked as required will be required only on this page layout; it will not be required if the data is filled from the backend or through the API or any other page layout. This option is useful if we have a single page layout that requires this field.

We can also set the field as read-only in the same option. The field appears uneditable on the page only and the user can still fill the value from the other page layouts or the backend.