Friday 6 December 2013

Visualforce: Overriding an Existing Page with a Visualforce Page

Make each section for an account display in a tab, such as contacts, opportunities

Create a Visualforce page:
goto setup - develop - pages - new
type tabbedaccount for the label and name for the page and then copy this code:

<apex:page standardController="Account" showHeader="true" 
      tabStyle="account" >
   <style>
      .activeTab {background-color: #236FBD; color:white; 
         background-image:none}
      .inactiveTab { background-color: lightgrey; color:black; 
         background-image:none}
   </style>
   <apex:tabPanel switchType="client" selectedTab="tabdetails" 
                  id="AccountTabPanel" tabClass='activeTab' 
                  inactiveTabClass='inactiveTab'>   
      <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="CombinedAttachments" />
      </apex:tab>
   </apex:tabPanel>
</apex:page>

Now that you've created a page to display an account with tabs, you can use this page to override the detail view for all accounts.
From Setup, click Customize | Accounts | Buttons, Links, and Actions.
Click Edit next to View.
For Override With select Visualforce Page.
From the Visualforce Page drop-down list, select tabbedAccount.
Click Save.
Click the Account tab, and select any account. The detail for the account is now displayed with tabs.

1 comment:

  1. My tabbedAccount vf page is not available in Dropdown

    ReplyDelete