---
schema_version: "1"
id: 8622e7903c5b7fef24e5ba11d6a26fcd3b75d2d53b8537200bd10d6531778bb6
title: Add a Flexcard to an Experience 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_add_a_flexcard_to_an_experience_page.md
canonical_url: https://help.salesforce.com/s/articleView?id=xcloud.os_add_a_flexcard_to_an_experience_page.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 4fdc1bf139c5723ab41614e4d584c33ff7a635ed7be1346c609f9bf915fd20ee
description: For the managed package runtime, after creating and activating your Flexcard, publish the generated component to an Experience page from the Experience Builder.
products:
  - Omnistudio
release: "264"
---
# Add a Flexcard to an Experience Page (Managed Package)

For the managed package runtime, after creating and activating your Flexcard, publish the generated component to an Experience page from the Experience Builder.

![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).

Before You Begin

- Activate your Flexcard. See [Activate a Flexcard (Managed Package)](https://help.salesforce.com/s/articleView?id=xcloud.os_activate_a_flexcard.htm&release=264.0.0&type=5 "For the managed package runtime, activate a Flexcard to generate an LWC and publish it to a Lightning page or Experience Builder site. After you activate a Flexcard, you can’t edit it or add elements to it.").

1. To access the Experience Builder, see [Navigate Experience Builder](https://help.salesforce.com/s/articleView?id=experience.community_designer_ui.htm&type=5&language=en_US).
2. Click the lightning bolt icon to open the Components pane.
3. From the list of **Custom Components** in the Components pane, find the name of your generated Flexcard LWC and drag it to the canvas area.
    
    ![Important](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio_for_managed_packages-264-0-0-production-enus/aa2554ec-624a-4ee6-8da4-6435670e6e62/images/icon_important.png)
    
    Important
    
    If you don't see your Flexcard, confirm that it is active and available to Experience Builder sites by selecting the appropriate **Target**.
4. To view record data on a Flexcard that uses the `{recordId}` context variable to pass the ContextId to a data source, enter {!recordId} in **recordId**. See [Access the ContextId of a Flexcard on an Experience Site (Managed Package)](https://help.salesforce.com/s/articleView?id=xcloud.os_access_the_contextid_of_a_flexcard_on_an_experience_site.htm&release=264.0.0&type=5 "For the managed package runtime, on an Experience site, to view record data on a Flexcard that uses the {recordId} context variable in an Input Map to pass a ContextId to an Apex Remote, Omnistudio Data Mapper, or Integration Procedure data source, you must add and configure a recordId property. Add the recordId property in your Flexcard's configuration file, then configure the property on the Experience page.").
5. (Optional) Beginning Winter '22, if your Flexcard defines an attribute that creates a public property, set the public property value from the properties pane in the Experience Builder. For example, if the attribute defined in the Flexcard is `AccountRecordLimit`, and the **Label** is Record Limit, look for **Record Limit** in the Experience Builder properties pane. See [Create a Public Property for a Flexcard LWC in the Flexcard Designer (Managed Package)](https://help.salesforce.com/s/articleView?id=xcloud.os_create_a_public_property_for_a_flexcard_lwc_in_the_flexcard_designer.htm&release=264.0.0&type=5 "For the managed package runtime, in the Flexcard Designer, define an attribute that creates a public property whose value is set in the Lighting App Builder and Experience Builder. Call the attribute within the Flexcard as a session variable ({Session.AttName}) where merge fields are supported, such as in a Text element and a data source parameter.").
6. To preview, click **Preview**. See [Preview Your Experience Builder Site](https://help.salesforce.com/articleView?id=community_designer_preview.htm&type=5&language=en_US).