Embed a Grid(s) onto a Record Detail Page (Using GridBuddy Lightning Components)
To use GridBuddy Lightning Components, My Domain has to be enabled.
Step 1: Create your grids
Decision time:
If you want to embed multiple grids in a tabbed format onto a record detail page, continue to Step #2.
If you want to embed a single grid onto a record detail page, skip to Step #3
Step 2: Create the tabbed page with all the grids that you want to appear
I. Click the Grid Wizard
II. Click “Managed Tabbed Pages
III. Click ‘new’ to create a new tabbed page
IV. Enter a title for the page.
V. Keep ‘global buttons’ & ‘Salesforce header’ checked
VI. Click ‘add tab’ to add a grid from the ‘content’ dropdown menu. These grids will appear
as a tab on the page in the order that you select them here.
VII. Add fpf (filter by parent field) and fpv (filter by parent value) parameters to dynamically
filter it by the record it is embedded on. For example:
For example:
- Standard objects:...&fpf=AccountId&fpv={!Account.Id}
- Custom objects:...&fpf=Account__c&fpv={!Account.Id}
- FPF tells the grid to look for a certain field on the grid
- FPV tells the grid that once it finds the FPF field, to filter it by the page it's embedded onto.
- On an Account record, if I’ve embedded a Contact grid, my FPF/FPV would be: fpf=AccountId&fpv={recordId}
- The grid looks for the AccountId field and filters it by recordId of the page it's embedded onto
- Note: The "GridBuddy Grid" Lightning Component only supports an fpv of {recordId}. If you want to use something other than recordId in the FPV, use the "GridBuddy Tabbed Page" Lightning component instead.
- On an Account record, if I’m embedding an Account grid from another datasource, my FPF/FPV would be: fpf=Id&fpv={recordId}
VIII. Click ‘save’
Step 3: Embed a grid onto the record detail page
I. Confirm that My Domains is enabled for this org
II. Scroll down to “Custom – Managed” in the left menu
III. You can select either “GridBuddy Grid” (to embed a single grid) or “GridBuddy Tabbed
Page” (to embed a managed tabbed page).
IV. Drag the GB component of your choice into the body of the page, wherever you would
like the grid to be.
V. Click on the GB component you just placed. This will open the Page > ‘GridBuddy Grid’
pane or the ‘GridBuddy Tabbed Page’ pane on the right side of the screen
VI. “GridBuddy Tabbed Page” Lightning Component:
a. In the GridBuddy Tabbed Page pane, select the page name from the dropdown menu.
This list will show you the tabbed pages you have built in Managed Tabbed Pages
b. Set the component height
c. Click ‘save’ and then click ‘back’ to load the page with your new tab and
embedded grid(s) on it
VII. “GridBuddy Grid” Lightning Component:
a. In the GridBuddy Grid pane, select the grid name from the dropdown menu on the right.
This list will show you all grids that you have built in this org.
b. Set optional filter parameters. This will filter the grid so that it only shows results related
to the page it is embedded on.
i. Note: If you do not place filter parameters on the grid, it will show you complete results
(vs. results only relevant to the detail page where you’ve embedded it)
ii. For example, to pull only relevant Contacts onto an Account page, you could use these
parameters on a Contact grid: fpf=AccountId&fpv={recordId}
c. Set the component height
d. Click ‘save’ and then click ‘back’ to load the page with your new embedded grid(s) on it.