Tuesday, April 29, 2014

SalesForce.com: List Views on the Home Page

You can easily add a list view to your Home Page to view accounts, contacts, or leads.  We’ll use the Leads object in this example:

  1. Go to Setup | Develop | Pages | New.
  2. You can name it: LeadsListView.
  3. Clear contents in Visualforce Markup section and Copy and Paste:

<apex:page showHeader="false" tabStyle="Lead">
    <apex:includeScript value="//code.jquery.com/jquery-2.0.3.min.js"/>
    <apex:listViews type="Lead"/>
    <script type="text/javascript">
        jQuery('a').each(
            function(){
                if(this.className.indexOf('listItem') == -1)
                    this.target = '_blank';
            }
        );  
        navigateToUrl =
            function(a){
                window.top.location.href = a;
            };        
    </script>
</apex:page>

*Notice the text written in Blue. If you choose to use another object other than Leads you can replace Lead with the API Name of the Object's List View that you’re interested in.

If that is done then create a Home Page Component:

1.      Go to Setup | Customize | Home | Home Page Components
2.      Click on New
3.      You can name it: Leads
4.      Type: HTML Area
5.      Click Next
6.      Component PositionWide (Right) Column
7.      Next step: From the Formatting Controls bar, check the option - Show HTML.
8.      Now paste this code: <iframe frameborder="0" src="/apex/LeadsListView" style="width:100%; height:300px"></iframe>.
9.      Notice the src attribute in step 8. All the Visualforce Pages can be accessed with the URL: https://ap1.salesforce.com/apex/NameOfTheVisualforcePage and hence the URL of our VF page will be: /apex/LeadsListView.
10.  Save it.

Now, you have to add the same to the Home Page Layout.
  1. Go to Setup | Customize | Home | Home Page Layouts
  2. Click Edit
  3. From the Select Wide Components to Show check the option Leads
  4. Click Next
  5. Decide the sort order for the Wide Area Components
  6. Save

The list view should now be on your Home Page!

(Right-click on the Image, or frame and select Open image, or frame in new tab to view it larger).