---
schema_version: "1"
id: 98445d7626e37cbdf4f39c00b1719a3a6e7bf9a289871640267bb38b88c9d774
title: Create Visualforce Dashboard Components
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/salesforce-pages-developers-guide/guides/pages/quick-start/pages-quick-start-basic-dashboard-components.md
canonical_url: https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-quick-start-basic-dashboard-components.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 8282e446a41960f4d2506c82dd68242684ecf9a4873716f8bc6dea744e4a867e
products:
  - Visualforce Developer Guide
  - Platform Developer Content
---

# Create Visualforce Dashboard Components

Use Visualforce pages as dashboard components. A dashboard shows data from source reports as visual components, such as charts, gauges, tables, metrics, or Visualforce pages. The components provide a snapshot of key metrics and performance indicators. Each dashboard can have up to 20 components.

## Before You Begin

|Required Editions|
|-----------------|
|Available in: Salesforce Classic ([not available in all orgs](https://help.salesforce.com/s/articleView?id=sf.overview_edition_lex_only.htm))|
|Available in: all editions|

**note:** Visualforce pages as dashboard components are only available in Salesforce Classic. In Lightning Experience, you can create a custom tab and use that as a dashboard for your custom lightning components.

To be included in a dashboard, a Visualforce page must use a custom controller, use a standard or custom list controller, or not have a controller. You can’t add a Visualforce page with a standard controller to a dashboard. Only Visualforce pages that meet these requirements appear as options in the Data Sources tab.

Visualforce dashboard components aren’t supported when third-party cookies are disabled. See [Visualforce Limitations in Salesforce Classic When Third-Party Cookies are Blocked](https://help.salesforce.com/s/articleView?id=003786014&type=1).

1.  Create a Visualforce page called `VFDashboard`.

    The Visualforce page uses a standard list controller, so you can add it to a dashboard. It displays a list of the cases associated with your org.

    <!-- otherprops: apex_page set_clipboard -->
    ```markup
    <apex:page standardController="Case" recordSetvar="cases">
        <apex:pageBlock>
            <apex:form id="theForm">
                <apex:panelGrid columns="2">
                    <apex:outputLabel value="View:"/>
                    <apex:selectList value="{!filterId}" size="1">
                        <apex:actionSupport event="onchange" rerender="list"/>
                        <apex:selectOptions value="{!listviewoptions}"/>
                    </apex:selectList>
                </apex:panelGrid>
                <apex:pageBlockSection>
                    <apex:dataList var="c" value="{!cases}" id="list">
                    {!c.subject}
                    </apex:dataList>
                </apex:pageBlockSection>
            </apex:form>
        </apex:pageBlock>
    </apex:page>
    ```

2.  [Build a Salesforce Classic dashboard](https://help.salesforce.com/s/articleView?id=analytics.dashboards_create.htm&type=5).

3.  Add the Visualforce page to a dashboard.


    1.  Click the **Dashboards** tab.

    2.  On the dashboard where you want to add the Visualforce page component, click **Edit**.

    3.  From the Components tab, drag **Visualforce Page** onto your dashboard.

    4.  From the Data Sources tab, click the **Visualforce Pages** dropdown, and drag `VFDashboard` onto the component that you just added to the dashboard.

    5.  Optionally, enter a header or footer to display on the Visualforce dashboard component.

    6.  Save your changes.

    ![A Visualforce dashboard displaying a view of all open cases.](https://developer.salesforce.com/media/salesforce-pages-developers-guide/pages_quick_start_basic_visualforce_dashboard.png)

    For a more complex example that uses a custom list controller, see [Create Advanced Visualforce Dashboard Components](https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/advanced/pages-quick-start-advanced-dashboard-components.md).


**See Also**  


-   [*Salesforce Help*: Reports and Dashboards: What’s Different or Not Available in Lightning Experience](https://help.salesforce.com/s/articleView?id=xcloud.lex_considerations_intro.htm&type=5)
-   [*Salesforce Help*: Add a Dashboard Component in Salesforce Classic](https://help.salesforce.com/s/articleView?id=analytics.dashboards_add_component.htm&type=5)