> 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: Wix Bookings: Calendar Page ## Article: Wix Bookings: Calendar Page ## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/supported-wix-app-dashboard-pages/wix-bookings/wix-bookings-calendar-page.md ## Article Content: # Wix Bookings: Calendar Page The Bookings Calendar page has 3 dashboard plugin slots: 1 dashboard, and 2 dashboard menu. [Slots](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/supported-wix-app-dashboard-pages/about-dashboard-page-slots.md) are the placeholders in the UI for plugins. The slot ID is the value for the required `extends` field when configuring the plugin in the [App Dashboard](https://dev.wix.com/apps). ## Location in dashboard Booking Calendar > Calendar ## Dashboard plugin slots The Order page features a dashboard plugin slot. ### Slot 1: Pre-collect payment modal > **Note:** > > This is a [Wix eCommerce slot](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/supported-wix-app-dashboard-pages/wix-e-commerce/about-wix-e-commerce-dashboard-page-slots.md) that appears on a Wix Bookings dashboard page. The Collect Payment button menu has items that open a modal when selected. This dashboard menu plugin slot displays a custom modal after the site owner selects a menu item and before the default modal appears. The slot is rendered in the modal's overlay. ![](https://wixmp-833713b177cebf373f611808.wixmp.com/images/wix-bookings-calendar-page-md_build-apps-portal_develop-your-app_extensions_dashboard-extensions_dashboard-plugins_supported-wix-app-dashboad-pages_assets_bookings-calendar-page-pre-collect-modal.gif) #### Sample use case Add a menu item that allows site owners to add things to an order such as additional services, notes, or booking fees like insurance. #### Configuration Use the following slot ID for the `extends` property in your dashboard plugin's configuration in your app's dashboard: **slot ID**: `b92f0e25-535f-4bef-b130-8e5abc85b2fe` For example: ```json { "hostingPlatform": "BUSINESS_MANAGER", "extends": "b92f0e25-535f-4bef-b130-8e5abc85b2fe", "description": "Pre-Collect Payment Modal Dashboard Plugin in the Bookings Calendar.", "title": "Bookings Calendar Pre-Collect Payment Modal Plugin", "height": 400, "iframeUrl": "https://www.example.com", "componentName": "My Bookings Calendar Pre-Collect Payment Modal Dashboard Plugin" } ```
**Important:** The hosting platform must be "BUSINESS_MANAGER".
#### Interaction between the dashboard page and your plugin Apps built by Wix pass parameters via dashboard slots for you to utilize in your plugin's functionality. Learn how to [interact with and retrieve parameters from the dashboard page](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/about-dashboard-plugin-extensions.md). This slot passes the following parameters: | Name | Type | Description | | ------------------------ | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `orderId` | String | Order ID. | | `onSuccess()` | `()=>Promise` | Callback to progress to the next modal (default or plugin modal) after a successful order update. Returns a promise indicating when the host UI update is complete. | | `onCancel()` | `()=>void` | Callback to progress to the next modal (default or plugin modal) without any changes. | | `menuOption` | Object | The menu item that was selected. | | `menuOption.key` | String | Key of the menu item that was selected. Supported values: `CHARGE_WITH_CREDIT_CARD`, `RECORD_ORDER_MANUAL_PAYMENT`, `CHARGE_WITH_INVOICE`, `EXTENSION` | | `menuOption.componentId` | String | Component ID of the extension that was clicked. Only applies when the `EXTENSION` menu item key is implemented by another slot. | ### Multiple plugins in the same slot This plugin slot can host multiple plugins. The plugins are displayed sequentially, one modal after the other, before the default modal appears. ## Dashboard menu plugin slots The Bookings Calendar page features 2 dashboard menu plugin slots. ### Slot 2: More actions menu This dashboard menu plugin slot is located in the more actions menu in the booking calendar. ![](https://wixmp-833713b177cebf373f611808.wixmp.com/images/wix-bookings-calendar-page-md_build-apps-portal_develop-your-app_extensions_dashboard-extensions_dashboard-plugins_supported-wix-app-dashboad-pages_assets_bookings-calendar-menu-plugin.png) #### Sample use case Add a meeting notes and agendas plugin to the Bookings Calendar's more action menu, enabling site owners to add notes and set agendas for events. #### Configuration Use the following slot ID for the `extends` property in your dashboard menu plugin's configuration in your app's dashboard: **slot ID**: `f3ad314d-0704-48e5-86b5-81acaf43e036` For example: ```json { "hostingPlatform": "BUSINESS_MANAGER", "extends": "f3ad314d-0704-48e5-86b5-81acaf43e036", "description": "Dashboard Menu Plugin on the Wix Bookings Calendar page.", "title": "Calendar Menu Plugin", "action": { "navigateToPage": { "pageId": "36bceb0e-5ac3-4b12-a40d-df0bf5e8dc89", "relativeUrl": "?home" } }, "componentName": "My Calendar Dashboard Menu Plugin" } ```
__Important:__ The hosting platform must be "BUSINESS_MANAGER".
#### Interaction between the dashboard page and your plugin Apps built by Wix can pass data, such as an ID, from the dashboard page to your plugin through a designated slot. Learn how to use the Wix SDK to interact with and retrieve data from the dashboard page. Learn how to use the Wix SDK to [interact with and retrieve data from the dashboard page](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/about-dashboard-plugin-extensions.md). ### Slot 3: Collect Payment button menu > **Note:** > > This is a [Wix eCommerce slot](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/supported-wix-app-dashboard-pages/wix-e-commerce/about-wix-e-commerce-dashboard-page-slots.md) that appears on a Wix Bookings dashboard page. This dashboard menu plugin slot is located in the Collect Payment button's menu which appears when the booking on the calendar is clicked. ![](https://wixmp-833713b177cebf373f611808.wixmp.com/images/wix-bookings-calendar-page-md_build-apps-portal_develop-your-app_extensions_dashboard-extensions_dashboard-plugins_supported-wix-app-dashboad-pages_assets_bookings-ecom-order-payment.png) #### Sample use case Add a menu item enabling site owners to accept your custom payment method for bookings. This allows site owners to charge their clients through your app. #### Configuration Use the following slot ID for the `extends` property in your dashboard menu plugin's configuration in your app's dashboard: **slot ID**: `bb4aa225-86d8-47fe-87d1-f519b1b93473` For example: ```json { "hostingPlatform": "BUSINESS_MANAGER", "extends": "bb4aa225-86d8-47fe-87d1-f519b1b93473", "description": "Collect Payment Dashboard Menu Plugin in the Bookings Calendar.", "title": "Bookings Calendar Collect Payment Button's Menu Plugin", "action": { "openModal": { "componentId": "36bceb0e-5ac3-4b12-a40d-df0bf5e8dc89", "componentParams": {} } }, "componentName": "My Bookings Calendar Collect Payment Button Dashboard Menu Plugin" } ```
**Important:** The hosting platform must be "BUSINESS_MANAGER".
#### Interaction between the dashboard page and your plugin Apps built by Wix pass parameters via dashboard slots for you to utilize in your plugin's functionality. Learn how to [interact with and retrieve parameters from the dashboard page](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/about-dashboard-plugin-extensions.md). This slot passes the following parameters: | Name | Type | Description | | --------------------- | ------------------- | ---------------------------------------------------------------------------------------------- | | `orderId` | String | Order ID. | | `onSuccessCallback()` | `()=>Promise` | Callback to notify the host when you are done handling the flow associated with new menu item. | ### Multiple plugins in the same slot These menu plugin slots can host multiple plugins. The menu plugins are displayed vertically and ordered by date created, with the most recently created plugin displayed at the bottom. ## Wix APIs You can implement logic in your plugin using the Wix Bookings APIs: - [SDK](https://dev.wix.com/docs/sdk/backend-modules/bookings/introduction.md) - [REST](https://dev.wix.com/docs/rest/business-solutions/bookings/about-wix-bookings.md) ## Slot IDs | Slot | ID | Parameters | | --------------------------- | -------------------------------------- | ------------------------------------------------------------------------------------------------ | | Pre-collect payment modal | `b92f0e25-535f-4bef-b130-8e5abc85b2fe` | `orderId`, `onSuccess()`, `onCancel()`, `menuOption`, `menuOption.key`, `menuOption.componentId` | | More actions menu | `f3ad314d-0704-48e5-86b5-81acaf43e036` | | | Collect Payment button menu | `bb4aa225-86d8-47fe-87d1-f519b1b93473` | `orderId`, `onSuccessCallback()` | ## See also - [About Dashboard Page Slots](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/supported-wix-app-dashboard-pages/about-dashboard-page-slots.md) - [About Dashboard Plugin Extensions](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/about-dashboard-plugin-extensions.md) - [Add Self-hosted Dashboard Plugin Extensions](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/self-hosting/supported-extensions/about-self-hosted-app-extensions.md) - [About Dashboard Menu Plugin Extensions](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/dashboard-menu-plugins/dashboard-menu-plugin-extensions.md) - [Add Dashboard Menu Plugin Extensions](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/dashboard-extensions/dashboard-plugins/dashboard-menu-plugins/add-dashboard-menu-plugin-extensions.md)