--- schema_version: "1" id: 1253223a1832eb94cb6046c492dad174bfb205f35f975619e486eb141633f487 title: Creating a Custom Cards Apex Page (Managed Package) collection: admin version: current locale: en-us portal_url: https://docs.salesforce.com/admin/current/en-us/xcloud/264-0-0/os_creating_a_custom_cards_apex_page.md canonical_url: https://help.salesforce.com/s/articleView?id=xcloud.os_creating_a_custom_cards_apex_page.htm&release=264.0.0&type=5 source_site: help.salesforce.com content_type: documentation content_hash: 792c613b40380a9c2c6c8856d7fcebedd657148fae0111eb81a9542035950539 description: For the managed package runtime, to create a custom Cards Apex page, create a Visualforce Apex page, add your Angular app to the page, add some common scripts, and add your layout name. products: - Omnistudio release: "264" --- # Creating a Custom Cards Apex Page (Managed Package) For the managed package runtime, to create a custom Cards Apex page, create a Visualforce Apex page, add your Angular app to the page, add some common scripts, and add your layout name. ![Managed Package app icon](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio_for_managed_packages-264-0-0-production-enus/aa2554ec-624a-4ee6-8da4-6435670e6e62/resources-global/_corporate/images/managedpackageicon.png) This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see [Omnistudio Help](https://help.salesforce.com/s/articleView?id=xcloud.os_omnistudio_standard.htm&language=en_US). 1. Create a Visualforce page and set the `apex:page` header as follows: ```java ``` 2. Add the following `html` tag: ```java ``` where the `ng-app` tag relates to your Angular application. If you are including CPQ, you can reference the `"hybridCPQ"` app directly, otherwise include your own app. 3. Add these resources to your page: ```java ``` Optionally, for CPQ apps, add HybridCPQ: ```java ``` 4. Include your layout name in the body of your page: ```java ``` Complete code: ```java

```