Tuesday 14 February 2012

10 Easy steps to an improved default object home page

Around a year and a half ago, I wrote this rant of a post, outlining my frustrations with the default object home view pages. I am not alone in my frustration, an entry on the Salesforce ideas site to address this problem is proving quite popular. Given the apparent demand for an alternative, I started to look at the default landing page again and think about ways to improve it.



The common complaint concerning the page is that is has a very counter intuitive feel to it. When the page is loaded, our eyes are drawn straight away to view selection box in the top left hand corner and the list of objects directly below it. Where the confusion starts is that the selected view has no bearing on the displayed objects. The list of objects is the collection of items the user has recently viewed, edited or created, controlled by the tiny combo box on the far right hand side of the page.

The only way to access objects in the form of a view is to click the "Go" button by the view combo box. This page, as seen below, shows the data in a tabular form that is fully editable, where the sort order can be varied easily through clicking on the column headers. The view of the data can be changed easily through the same combo box as on the main screen.

After seeing the views page, I reasoned that I would much prefer this page as a home page for my objects than the standard view. There are no conflicting page elements, and I am not forced to see a recent items list, instead I have complete control over the view of the data.


After this realisation, I attempted to build a new homepage based on the tabular data summary that could be used for both standard and custom objects.

This actually turned out to be a lot simpler than anticipated, placing the enhanced list Visualforce component in a page provides a simple way to build view pages for an object. My only addition was a link to the default object page, just in case I ever required a recent view or one of the extended tool links. Assign this page to a tab, replace the original tab, and the user experience is much improved.

To set up a alternative default tab for a standard or custom object, simply follow these steps:

1) Open the current standard tab for your object, and note down the three characters at the mid section of the URL in the navigation bar of your internet browser. For example, Contact is '003' and Lead is '00Q'. I am going to create an alternative standard tab for the Account object, so the object code is '001'.



2) Create a new Visualforce page, by navigating to (Setup -> App Setup -> Develop -> Pages) and clicking on the New button. Call your new page "Alternative" + object label + "Homepage", such as "AlternativeContactHomepage" or "AlternativeMyCustomObjectHomepage". In the account example this would be "AlternativeAccountHomepage".


3) Erase the default body content created automatically by Salesforce, copy the following Visualforce code and place it in the body definition entry section. Don't save the page yet, a few attribute values within the tags need to be populated first.

<apex:page>
  <apex:sectionHeader title=""/>
  <apex:enhancedList type="" height="600" rowsPerPage="50"/>
  <br/>
  <apex:outputLink value="//o">
    See Recent Items / Extra Options
  </apex:outputLink>
</apex:page>


4) Inside the apex section header tag, enter the plural version of the object name. Enter the API name of the object in the type attribute of the apex enhanced list tag. Finally, place the object three character code recorded during step 1 in between the two forward slash characters in the value attribute of the apex output link.

For a standard object, such as Account, this page code should look like this:

<apex:page >
  <apex:sectionHeader title="Accounts"/>
  <apex:enhancedList type="Account" height="600" rowsPerPage="50"/>
  <br/>
  <apex:outputLink value="/001/o">
    See Recent Items / Extra Options
  </apex:outputLink>
</apex:page>

For a custom object, such as My Custom Object (with a three digit code of a01), the page code should look like this:

<apex:page >
  <apex:sectionHeader title="My Custom Objects"/>
  <apex:enhancedList type="My_Custom_Object__c" height="600" rowsPerPage="50"/>
  <br/>
  <apex:outputLink value="/a01/o">
    See Recent Items / Extra Options
  </apex:outputLink>
</apex:page>

To finish, click the Save button to save your new page.



5) Navigate to the tabs definition page (Setup -> App Setup -> Create -> Tabs). Click on the New button in the Visualforce Tabs section. Place the object name as it appears on the existing default object tab (i.e. Contacts or My Custom Objects). In the API name, enter the same. Choose a tab style (may I personally recommend Big Top or Saxophone :-D ), then click Next.



6) On the next page, select the users you want to provide the new tab view to, and click Next.


7) On the final page, select the applications that you want to add the alternative tab to (probably where the standard tab exists currently). Click Save to finish.



8) The new tab should now be visible in the apps you have selected. However, you may have noticed that the standard tab is still visible in your applications. As you can see below, I still have the Accounts standard tab, and the Accounts alternative tab visible, both called "Accounts".



The standard tabs need to be removed for clarity. To do this, navigate to the Apps setup page (Setup -> App Setup -> Create -> Apps). Click the edit link next to one of the apps that contains both of the tabs.



9) On the edit screen, Under the tab selection panel, move the old standard tab from the right hand side column to the left. Move the new alternative tab (at the end of the list) up the tab order to replace the old standard tab. Click Save to confirm your changes.





10) Finally, Click on your new tab to view your new object home page!


The new object home page is largely the same as the view page found by clicking the "Go" button on the original screen. You can use this interface to easily navigate through large amounts of objects. The current view of the data can be simply altered using the combo box in the top left hand corner of the page. You can order the view by different fields, and use the A-Z links in the top right hand corner to skip to specific alphabetic subsets of your data.


At the bottom of the page, you will find a link back to the old home page. This is useful in case you actually decide once in a while that you want to see your recent items or follow one of the default links for a standard object.

So there you have it, a much improved standard landing page for all of your objects. This is still far from ideal I admit, but I believe it is a definite step in the right direction. Most importantly I feel using this kind of view is intuitive. There is no longer all the confusion of recent views, especially debilitating for new users.

If you have any problems, questions or improvement suggestions, please add a comment below... Happy tabbing!


NOTE: If you want to remove the standard tab from being accessed entirely by a set of users, simply navigate the user profile settings (Setup -> Administration Setup -> Manage Users -> Profiles). Click the edit link next to a profiles you want to alter. Find the section where standard tab access is defined, and in the combo box next to the standard object tab, select the "tab hidden" option. Any user with this profile will now not be able to view the old standard tab, only the new alternative tab.

Standard Profile User Interface:



Enhanced Profile User Interface: