Learning Objectives

After completing this unit, you'll be able to:

Every org has a unique set of business needs. If your users frequently need to access other pages in or outside your org, you can add custom buttons and links directly to object and record detail pages.

Custom buttons and links help you integrate Salesforce data with external URLs, applications, your company’s intranet, or other back-end office systems.

When your users have all the information they need on hand, they can be even more productive with Salesforce.

Custom links can link to an external URL, such as www.google.com, a Visualforce page, or your company’s intranet. Custom buttons can connect users to external applications, such as web pages, and launch custom links.

You can choose the display window properties that determine how the target of a link or button is displayed to your users. Custom links can include Salesforce fields as tokens within the URL. For example, you can include an account name in a URL that searches Yahoo: http://search.yahoo.com/bin/search?p={!Account_Name}.

If you want the button or link to launch a custom page or other code, consider a Visualforce page. If you don’t know how to use Visualforce pages yet, don’t worry. We don’t address them here, but you can learn about them in a different module.

In Lightning Experience, custom buttons and links live on your page layouts and appear in different areas of a Lightning page.

There are three primary types of custom buttons and links that you can create.

We’ll explore all three of these options.

A Note for Screen Reader Users

If you're still in the Salesforce Classic interface from the last unit, locate a link near the top of your Salesforce page labeled Switch to Lightning Experience. Go ahead and activate that link.

We'll start off back in the Lightning Experience interface, then switch to Classic as we begin working with Page Layout Editor a little later on.

Create a Custom List Button

You’ve read what they can do, now find out how to create one. For each type, you must define the action that occurs when a user clicks it. First, the custom list button.

A custom list button is a button that you can add to a related list. When you create a list button for an object, you can add that button to that object’s related list when the related list appears on other objects. Because Energy Audits are tied to accounts with a lookup relationship field, an Energy Audits related list automatically appears on account records.

For example, earlier in the module you entered audit information for “GenePoint 5-year review.” When you view the GenePoint account record, then select the Related tab and scroll to the end of the record page, you see an Energy Audits related list heading displaying that audit.

Maria wants to add a custom button to that Energy Audits related list to let users navigate directly to the Ursa Major Solar energy audit guidelines PDF. She’s already uploaded the PDF as a file, but she needs its URL in order to have the custom button point to it. Here’s how that works.

  1. From the App Launcher button near the top of the page, search for Sales and select the Sales app.
  2. Activate the link for the Files tab from the list of links in the Global Navigation menu.

Here, Maria can see the guidelines PDF she uploaded.

  1. Upload a file of your own to follow along with. You will find the Upload Files button beneath the heading level 1 on the page.
  2. Back on the Files page, navigate the table of available files and move to the end of the row where the file you just uploaded is located. Press ENTER on the Show More Actions button there and select Share from the menu that appears.
  3. In the Public Link Sharing area near the bottom of the page, click the Create Link button. On the following page, press ENTER on Create to confirm you wish to generate the link.

This generates a public URL for the file that you can share with others, or in this case, add as a URL to a custom button or link. In this example, the URL is https://ursamajorsolar.salesforce.com/sfc/p/R00000008nD1/a/R000000007LK/8Z8auAJBSeSCzqQ8Kv9ofolIWi_jP13oR3LUUYuXc3A

  1. Activate the Copy Link button near the bottom of the page to copy your public link to the clipboard, then activate the Done button.
  2. From Setup, select the Object Manager tab, then select Energy Audit from the table of objects.
  3. Activate the Buttons, Links, and Actions tab located beneath the heading level 1. Then, press ENTER on the button labeled New Button or Link.
  4. Name the button Audit Guidelines.
  5. After the description field, there is a grouping of three radio buttons for display Type. Choose the option for List Button.
  6. Paste the file URL from your clipboard into the text box labeled Custom Button or Link Editor.

You might be thinking to yourself: “OK, whoa! What’s all that formula-looking stuff in the function combo boxes? What do I do with that?” That’s a version of Salesforce’s formula editor, and you use it to define the properties of the button or link. For example, if your content source is URL as in this case, this section is where you put the URL you want the button or link to point to. And, you can add merge fields and operators to enhance the behavior of the button or link by including data from Salesforce.

For more information on merge fields and operators, check out the Salesforce Help.

  1. Activate the Save button, then press ENTER on OK in the pop-up that appears.

The button won’t appear on the Energy Audits related list until Maria adds it. That’s next.

Screen reader users, we'll need to hop back into Salesforce Classic now.

  1. Activate the View Profile button and then activate the Switch to Salesforce Classic link.
  2. Click the Setup link near the top of the page.
  3. Locate the heading level 2 called Build, and activate the Customize link located underneath.
  4. Activate the Accounts link, and once the information expands below it, activate the link for Page Layouts.
  5. From the table of page layouts farther down the page, locate the Accounts page layout in the bottom row. Press ENTER on the edit link in the cell to the left at the start of that row.

Navigate all the way down the end of the layout to the table for the Energy Audits related list. You can find this section easily by locating a checkbox labeled "Overwrite users' custom related lists." The section begins after this checkbox.

  1. Locate the table cell containing Energy Audit and press ENTER on it. Then, navigate down to the Edit Properties button and press ENTER.
  2. Near the bottom of the page is a Custom Buttons section not marked by a heading. Instead, you will find two combo boxes labeled Available Buttons and Selected Buttons.
  3. Add the Audit Guidelines button to the Selected Buttons list, then press ENTER on  OK.
  4. Activate the Save button.
  5. Since the Salesforce Classic interface looks so different when viewing records, let's go ahead and activate the link for Switch to Lightning Experience at the top of the page. We'll return to the Classic interface in a moment.
  6. Navigate back to the Sales app, select Accounts from the Global Navigation menu, and select the GenePoint account. You may need to switch your list view to All Accounts to find it.
  7. Look for a heading level 2 labeled Tabs near the top of the record and ensure  the Related tab below it is selected. Navigate down by heading to the Energy Audits heading at level 2. You should find the new Audit Guidelines button on the Energy Audits related list.

Maria, our Ursa Major Solar admin, wants to add a custom link that lets her users do a quick Google search on the accounts they’re viewing.

Let’s get started.

We should be in the Lightning Experience interface.

  1. From Setup, select the  Object Manager tab, then select the Account object from the table.
  2. Select the Buttons, Links, and Actions tab, then activate the button for New Button or Link.
  3. Name the link Google This Account.
  4. Make sure that the radio button for  Detail Page Link is selected for the display type, and leave the next two fields as-is.

Now it’s time to add the URL we want this link to point to.

  1. In the edit field for Custom Button or Link Editor, enter https://www.google.com/search?q={!Account.Name}
  2. Activate the Save button, then press ENTER on OK in the pop-up.

You can use Quick Save to save and continue editing. Saving validates the URL you defined if you set the content source to URL. Before you can use your custom buttons and links, you must add them to an object’s page layout. You can then see and use the button or link on a record detail page. Let’s do that next.

For screen reader users, we'll switch back to Salesforce Classic now. Activate the View Profile button and press ENTER on the link for Switch to Salesforce Classic under the Options heading.

  1. Activate the Setup link near the top of the page, then, under the Build heading, click the Customize link.
  2. From the list of links that appears, select Accounts.
  3. Another list of links appears below Accounts. Press ENTER on the link for Page Layouts.
  4. Navigate by heading level 3 until you locate the heading for Account Page Layouts. In that table of page layouts, locate the row for Account Layout. Activate the Edit link at the start of that row.
  5. Locate the checkbox called Overwrite users' custom related list. Directly above this checkbox is the table where custom links can be dragged from the palette onto the page.
  6. Next, locate the combo box labeled View. Select the option for Custom Links. If you look at the table beneath it now, you'll find the Google This Account custom link there.

However, the Custom Links section on our page canvas is currently empty. As mentioned in a previous unit, there is an accessibility blocker in the page layout editor when it comes to dropping elements into empty sections.

You have the theory of how to add a custom link to the page, so let's go ahead and activate the Save button to close the Page Layout Editor. This work is not tested in a challenge, so you can feel free to save and close. The challenge uses a custom button rather than a link.

Create a Custom Detail Page Button

Maria wants to add a custom button to account pages that shows the account’s location on Google Maps. Let's stick to the Salesforce Classic interface for this part.

  1. From the Setup link near the top of the page, locate the heading level 2 entitled Build.
  2. Below this, activate the Customize link and then the Accounts link.
  3. From the options that expand below Accounts, activate the link for Buttons, Links, and Actions. Next, activate the button for New Button or Link.
  4. Locate the heading level 1 called Account Custom Button or Link. The creation wizard is located beneath this heading. Name the button Map Location.
  5. Select the radio button for  Detail Page Button from the Display Type grouping.
  6. Paste this URL into the Custom Button or Link editor field:

http://maps.google.com/maps?q={!Account_BillingStreet}%20{!Account_BillingCity}%20{!Account_BillingState}%20{!Account_BillingPostalCode}

This URL uses merge fields ({!Account_BillingStreet}) and passes the field information from the account record that the button is clicked from into the URL. So instead of {account_billing_street}, the link will instead have the actual account billing street from the account record's address.

  1. Activate the Save button, then press ENTER on OK in the pop-up window.

Now add it to the Account page layout.

  1. Navigate back up the page to the heading level 2 entitled Build. If the Customize link isn't already expanded with a list of objects below it, activate the Customize link and choose Accounts.
  2. From the options expanded below accounts, select the link for Page Layouts
  3. From the table of page layouts farther down the page, locate Account Layout in the bottom row and activate the Edit link to the left of that row.
  4. Locate an edit field called Page Layout Name. Below this, you will find text reading, "Buttons Section." This is where custom buttons will be dragged onto the page. Directly below the name of the section is an element entitled "detail Page Buttons. Press ENTER on that element.
  5. Locate the Edit Properties button at the top of the page layout and press ENTER.
  6. From the custom Buttons section at the bottom of this window, locate the two combo boxes for Available Buttons and Selected Buttons. Choose Map Location  from the Available Buttons combo box and use the Add link to move it  to the Selected Buttons combo box. Press ENTER on OK.
  7. Activate the Save button.

OK! Now let’s test it. Go ahead and activate the link for Switch to Lightning Experience at the top of the page.

  1. From the App Launcher, find and select Sales, then select the Accounts tab from the Global Navigation menu.
  2. Open an account record.

In the highlights panel at the top of the record page, not only do you see the fields from the object’s compact layout, but you also see an actions menu. The actions menu is a combination of the standard buttons, custom buttons, and actions from the page layout. (We’ll go over actions in the next unit.)

  1. Expand the actions menu, and select Map Location. Note that screen readers may have a difficult time accessing the bottom of the actions menu.

The browser opens a new window or tab that shows you the account’s address in Google Maps. Is Map Location not showing up in the actions menu even though you added the custom button to the page layout? This happens sometimes if you override the default settings of the "Salesforce Mobile and Lightning Experience Actions" section of a page layout. To fix it, add any missing buttons to the page layout as actions by dragging them from the "Mobile & Lightning Actions" category in the palette into the "Salesforce Mobile and Lightning Experience Actions" section.

Custom detail page buttons and links can do the same things. Consider where and how you want them to appear on your page, and that can help you decide which type to choose.

Resources

Click to return to the unit on Trailhead to access your challenge and proceed to the next step.