> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Add a Dashboard Page

## Article: Add a Dashboard Page

## Article Link: https://dev.wix.com/docs/develop-websites/articles/coding-with-velo/frontend-code/dashboard-admin-pages/add-a-dashboard-page.md

## Article Content:

# Add a Dashboard Page

[Dashboard pages](#LINK-PLACEHOLDER) allow you to create a custom back office for you and your [collaborators](https://support.wix.com/en/article/roles-permissions-overview) to efficiently manage your business operations and dynamic content. You can add functionality to your dashboard pages using the [Wix Dashboard API](https://dev.wix.com/docs/velo/api-reference/wix-dashboard/introduction.md), allowing your code to interact with the dashboard environment. 

<!-- 
You can view the dashboard's page code With the Wix IDE or your local IDE, your dashboard page is automatically added to your page code files in your IDE after you add the dashboard page in the editor and save your site.  -->
> **Note:** In your local IDE, run `wix dev` to open the editor to add a dashboard page to your site. 


<!-- 
You can use the [Wix Dashboard API](https://dev.wix.com/docs/velo/api-reference/wix-dashboard/introduction.md) which allows your code to interact with the dashboard environment.  -->



## Add a dashboard page to your site

Dashboard pages can only be added to your site in the editor and can be viewed in your site's dashboard after publishing your site. 

**Add a dashboard page in Wix Studio**

1. Click the **Pages** ![pages icon](https://wixmp-833713b177cebf373f611808.wixmp.com/images/200b9d74a1d550b51058678b2df28b0b.png) icon on the left sidebar. 
1. Click the **Add New Page** ![add page](https://wixmp-833713b177cebf373f611808.wixmp.com/images/2c36935a6e84dbf551dc5f7301ae6bc3.png) icon and then click **Add** under Dashboard Page.
    <div style="text-align:left">
  
      <img src="https://wixmp-833713b177cebf373f611808.wixmp.com/images/01fc1a38efdb8c4be7ba87211e9245f3.png" style="max-width:40vw" />
  
    </div>

    If the **Introducing Dashboard Pages** panel appears, click **Add Dashboard Page**. 
1. Find your new dashboard page in the **Dashboard Pages tab**.
1. Click on the **More Actions** ![show more](https://wixmp-833713b177cebf373f611808.wixmp.com/images/506abdf364c2f86a8f34670cbcac015b.png) icon and then select **Rename** to give your new page a name. 
    <div style="text-align:left">
  
      <img src="https://wixmp-833713b177cebf373f611808.wixmp.com/images/2d669bf9d98550446ab3f90df21ddec6.png" style="max-width:40vw" />
  
    </div>

1. Use Wix elements, datasets, and code to build your dashboard pages. 
1. Publish your site. 
1. Navigate to the dashboard to see your page. 


**Add a dashboard page in Wix Editor**

1. Click **Add** on the left side of the editor. 
1. Click **Page** and then click the add ![add page](https://wixmp-833713b177cebf373f611808.wixmp.com/images/9048bd9c78a9635f34d1875af5d678d8.png) icon next to the **Dashboard Page**.

    <div style="text-align:left">
  
      <img src="https://wixmp-833713b177cebf373f611808.wixmp.com/images/642ea7ea347474bda3ac24caf2cf6b96.png" style="max-width:40vw" />
  
    </div>

    This action opens the **Site Pages and Menu** tab. 
    If the **Introducing Dashboard Pages** panel appears, click **Add Dashboard Page**.

1. In the **Dashboard Pages** panel, give your new page a name.
    <div style="text-align:left">
  
      <img src="https://wixmp-833713b177cebf373f611808.wixmp.com/images/20ba0094f801252f028c8136e78e3241.png" style="max-width:40vw" />
  
    </div>
1. Use Wix elements, datasets, and code to build your dashboard pages. 
1. Publish your site. 
1. Navigate to the dashboard to see your page. 

## Add functionality to your dashboard page

Use the [Wix Dashboard API](https://dev.wix.com/docs/velo/api-reference/wix-dashboard/introduction.md) to interact with your dashboard pages, such as displaying toast notifications or navigating users to other pages in the dashboard.

To use the Wix Dashboard API, import the relevant functions from `wix-dashboard`:
```js
import { <function> } from 'wix-dashboard';
```

The code example below displays a toast notification at the top of the dashboard page after a product is updated:
```js
import { showToast } from "wix-dashboard";

$w.onReady(function () {

  $w("#updateButton").onClick(() => {
    const config = {
      message: "Product updated successfully!",
      type: "success",
    };
    
    showToast(config);
  });
});
```
 
## See also
- [About Dashboard Pages](https://dev.wix.com/docs/develop-websites/articles/coding-with-velo/frontend-code/dashboard-admin-pages/about-dashboard-pages.md)
- [wix-dashboard API](https://dev.wix.com/docs/velo/api-reference/wix-dashboard/introduction.md)