Add Recipe

  

Recipes by Category

App Distribution (13) Bundle logic, interface and services for distribution. App Logic (52) The Apex programming language, workflow and formulas for logic. Collaboration (7) The Salesforce Chatter collaboration platform. Database (29) Data persistence, reporting and analytics. Integration (57) Web Service APIs and toolkits for integration. Security (22) Platform, application and data security. Tools (17) Force.com tooling User Interface (38) Visualforce MVC and metadata-drive user interfaces. Web Sites (13) Public web sites and apps with optional user registration and login.
Beta Feedback
Cookbook Home » Creating Tabbed Accounts

Creating Tabbed Accounts

Post by Developer Force  (2010-07-16)

Status: Certified
Level: novice

Problem

In Salesforce.com, all the information for an account displays on a single page. If there's a lot of information, you might end up doing a lot of scrolling. You'd like a different way to display the information for accounts.

Solution

Using a Visualforce page, you can make each section for an account display in a tab, such as contacts, opportunities, and so on.

To create a tabbed view for account, first you have to create a Visualforce page. Then you have to override the standard account view to use the page.

To create the Visualforce page:
  1. In Salesforce.com click Setup | Develop | Pages.
  2. Click New.
  3. In the Label text box, enter Tabbed Account View.
  4. In the Name text box, enter tabbedAccount.
  5. In the Description text box, enter Displays account information in tabs.
  6. In the Body text box, delete the existing Visualforce markup and enter the following instead:
    <apex:page standardController="Account" showHeader="true" 
               tabStyle="account" >
       <apex:tabPanel switchType="client" 
                      selectedTab="tabdetails" 
                      id="AccountTabPanel">
          <apex:tab label="Details" name="AccDetails" 
                    id="tabdetails">
             <apex:detail relatedList="false" title="true"/>
          </apex:tab>
          <apex:tab label="Contacts" name="Contacts" 
                    id="tabContact">
             <apex:relatedList subject="{!account}" 
                               list="contacts" />
          </apex:tab>
          <apex:tab label="Opportunities" name="Opportunities" 
                    id="tabOpp">
             <apex:relatedList subject="{!account}" 
                               list="opportunities" />
          </apex:tab>
          <apex:tab label="Open Activities" name="OpenActivities" 
                    id="tabOpenAct">
             <apex:relatedList subject="{!account}" 
                               list="OpenActivities" />
          </apex:tab>
          <apex:tab label="Notes and Attachments" 
                    name="NotesAndAttachments" 
                   id="tabNoteAtt">
             <apex:relatedList subject="{!account}" 
                               list="NotesAndAttachments" />
          </apex:tab>
       </apex:tabPanel>
    </apex:page>
  7. Click Save.

To override the standard account view:

  1. Click Setup | Customize | Accounts | Buttons and Links.
  2. In the Standard Buttons and Links related list, click Override next to View.
  3. For Content Type select Visualforce Page.
  4. For Content Name select tabbedAccount.
  5. Click Save.

Discussion

To see your changes, select the Account tab, then select an account to view. Across the top of the page you should see a list of tabs: Details, Contacts, Opportunities, Open Activities and Notes and Attachments.

The tabbed display looks like the following:Account Detail Page Displayed as Tabbed View

Share

Recipe Activity - Please Log in to write a comment

This could be useful but it make it really hard to find cases and solutions and what about chatter, where has that gone in this model.  Can tabs be added in for those things as well?

Thanks

Patricia

by Patricia Scanlan  (2012-02-15)

good

voted as verified by sridhar sridhar  (2011-12-14)

Is there a way to isolote this view for particular user profiles?

by de Guzman  (2011-03-12)

X

Vote to Verify a Recipe

Verifying a recipe is a way to give feedback to others and broaden your own understanding of the capabilities on Force.com. When you verify a recipe, please make sure the code runs, and the functionality solves the articulated problem as expected.

Please make sure:
  • All the necessary pieces are mentioned
  • You have tested the recipe in practice
  • Have sent any suggestions for improvements to the author

Please Log in to verify a recipe

You have voted to verify this recipe.