Multi-Tabular Related List (Stacked)
Follow these steps to create a Multi-Tabular related list where the tabs are stacked vertically:
- Click Conga Grid Setup.
- Select Global Defaults from the object list.
- Click the Global Setup tab.
- Click New MultiTab Page.
- Enter a Label. The Name field will automatically populate based on the Label.
- (Optional). Enter a Description.
- (Optional). Select the Show the Side Bar option if you want to display the Configure menu in the grid. This option is disabled by default.
- (Optional). Select the Show Header option if you want to display the field (column) headers in the grid.
-
(Optional). Select the Add Page to AG Users Permission Set option if you want to automatically add the resulting Visualforce page to the Conga Grid Users permission set.
- Click OK. The New Conga Grid MultiTab Page screen appears.
- From the Select Object drop-down list, choose an object for the first tab in the MultiTab Conga Grid℠.
- From the Default View drop-down list, select an existing Conga Grid view for the selected object. Leave it blank for no view. Or, select Create new view for this Page to automatically create a view which you can later redefine when you load the tab.
-
Choose whether or not to enable various properties for this tab. Refer to the pertinent help topics for details on each feature.
- Click Add Another Tab. Repeat steps 11 through 13. Add as many different tabs as you need.
- Click Save and Finish. A Visualforce Page Created screen appears.
- Click View VF Page.
-
Click Edit. The Visualforce Markup code should look similar to the following. This example has tabs for Accounts and Contacts.
-
Change the first several lines to the code shown below. Specifically, you will:
- Add <apex:pageBlock> on line 2.
- Press ENTER to make line 3 blank.
- Remove <li>Contacts</li>.
- Change <div id="tabstrip"> to <div class="tabstrip"> on line 4.
- Press ENTER to make line 14 blank.
- Add </div> on line 15.
- Add </apex:pageBlock> on line 16.
- Press ENTER to make line 17 blank.
- Add <apex:pageBlock> on line 18.
- Copy lines 4 and 5, and paste them into lines 19 and 20.
- Change line 20 to the appropriate object (Contacts, in this example).
-
Change the first several lines to the code shown below. Specifically, you will:
- Add </apex:pageBlock> to line 31.
- Press ENTER to make line 32 blank.
- Change lines 34-36 to the code shown below. Change the pound signs to periods.
- Click Save.
The following example shows a stacked Multi-Tabular related list: