Flexcards (Managed Package)

For the managed package runtime, build customer-centric, industry-specific UI components and applications on the Salesforce platform with Flexcards. Display Salesforce object information along with distinct, clickable actions that change according to the context in which they appear and based on the information that they contain.

This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see Omnistudio Help.

• Flexcard Designer (Managed Package)
  For the managed package runtime, the Flexcard Designer is a declarative tool with a drag interface and WYSIWYG editing that makes it easy to build user interface (UI) Lightning web components without code. Build interfaces rich in information and with actions relevant to your customer's context. You can also create the look and feel of your Flexcard by styling individual elements from graphic user interfaces (GUIs) built into the designer.
• Get Started with Flexcards (Managed Package)
  For the managed package runtime, Flexcards provide a set of components for building UI components and applications on the Salesforce platform. Here are some key resources to help you navigate the Flexcard Designer and guide you through common tasks.
• Managed and Unmanaged Components in Managed Packages (Managed Package)
  For the managed package runtime, managed Flexcard components visible in the Lighting App and Community Builders and shipped in the managed package in your org, work as-is. As in, you can add them to a Lightning or Community page without having to use the Flexcard Designer.
• Flexcard Designer Changes and Enhancements (Managed Package)
  For the managed package runtime, changes in functionality affect how you must configure your Flexcard and how your Flexcard performs.
• Flexcard Designer Considerations (Managed Package)
  For the managed package runtime, the Flexcard Designer doesn’t support all functions, features, and data sources available in the Vlocity Cards Designer.
• Create a Flexcard (Managed Package)
  For the managed package runtime, configure basic settings and data source options when creating a Flexcard in the Flexcard Designer. After creating a Flexcard you can update additional options and start building your user experience.
• Activate, Configure, and Publish Flexcards (Managed Package)
  For the managed package runtime, after creating a Flexcard, activate it to generate a custom-generated LWC, which you can then add to a Lightning or Experience page.
• Run Flexcards Outside of Salesforce with OmniOut (Managed Package)
  For the managed package runtime, run Flexcards off-platform on third-party websites with OmniOut for Flexcards. Display Flexcards and connect to Salesforce from a content management system's (CMS) external website. Run a Flexcard on your external site by adding the component to the OmniOut project, integrating OmniOut into your application, and deploying your application to your CMS.
• Flexcard Elements (Managed Package)
  For the managed package runtime, build a Flexcard in the Flexcard Designer by dragging elements from the Build panel onto the canvas. Each element can be styled and properties configured within the Designer. For example, add an action link styled as a button with or without an icon.
• Flexcard States (Managed Package)
  For the managed package runtime, Flexcards have states. Each state displays a list of fields, a data source, and one or more actions. You can also associate a state with one or more flyouts, which show supplemental data displayed as a modal or popover.
• Work With Data in the Flexcard Designer (Managed Package)
  For the managed package runtime, in the Flexcard Designer, you can get data from a variety of data sources and view the data JSON returned. You can then display the data automatically using specific elements, such as a datatable, or manually using variables.
• Set Up a Flexcard in the Flexcard Designer (Managed Package)
  For the managed package runtime, configure optional settings for your Flexcard in the Setup panel of the Flexcard Designer. For example, update a data source, create an event listener, add session variables, and so on.
• Style Flexcard Elements (Managed Package)
  For the managed package runtime, configure the look and feel of a Flexcard by styling individual elements, fields inside elements, and entire states. From the Style panel in the Flexcard Designer, design backgrounds, text, and borders; adjust heights, widths, and spacing inside and between elements; apply classes and inline styles; make your element responsive; and more.
• Pass Concatenated Strings As Values in Flexcards (Managed Package)
  For the managed package runtime, pass concatenated strings as the value for supported Flexcard element properties. For example, pass a breadcrumbs path like {Parent.parentPath}>{Parent.type}>{Name} in the Value property of an Attribute of a child Flexcard.
• Set a Private Variable at Runtime in a Flexcard (Managed Package)
  For the managed package runtime, set a private variable in a Flexcard to define and evaluate its value only at runtime, when the Flexcard is accessed in Preview or on a record page. Use the Set Values action to set the value of the Flex.varname private variable. You can then create a condition to display or hide content depending on the variable's value.
• Enable Tracking on a Flexcard (Managed Package)
  For the managed package runtime, enable user interaction tracking from a Flexcard action or child Flexcard element to publish tracked data with OmniAnalytics. The tracking feature sends tracked information from the Flexcard element to the Vlocity Tracking Service, which is then published by OmniAnalytics.
• Flexcard Designer Preview (Managed Package)
  For the managed package runtime, preview your Flexcard's appearance and test functionality before publishing it to a Lightning or Community page. Test how your Flexcard looks on multiple devices. Test the functionality of interactive elements such as actions. Debug your Flexcard's data output, events, and actions.
• View a Flexcard at Different Viewport Breakpoints (Managed Package)
  For the managed package runtime, adjust the size of your Flexcard's canvas to test for responsiveness. Use the Viewport Dropdown in the Flexcard Designer to mimic the sizes of a desktop, laptop, and smaller mobile devices.
• Download a Flexcard LWC from the Flexcard Designer (Managed Package)
  For the managed package runtime, download your Flexcard LWC from the Flexcard designer. Download your LWC to debug and inspect issues.
• Download an Off-Platform Flexcard LWC from the Flexcard Designer (Managed Package)
  For the managed package runtime, download an off-platform Flexcard LWC from the Flexcard designer. Download your LWC to inspect code.
• Create a Public Property for a Flexcard LWC in the Flexcard Designer (Managed Package)
  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.
• Add Custom Labels to Supported Fields on a Flexcard (Managed Package)
  For the managed package runtime, add custom labels to supported Flexcard element fields with the {Label} merge field. Custom labels are custom text values that can be accessed from Apex classes, Visualforce pages, or Lightning components. Add custom labels if your Flexcard supports multiple languages. The values can be translated into any language Salesforce supports.
• Pass Data from an LWC Omniscript to an Embedded Flexcard (Managed Package)
  For the managed package runtime, to populate data fields and perform actions on a Flexcard embedded in an LWC Omniscript, you can pass data from an Omniscript's data JSON to the Flexcard. Embed a Flexcard inside an LWC Omniscript with the Custom Lighting Web Component element.
• Reload a Flexcard After Updating an LWC Omniscript in a Flyout (Managed Package)
  For the managed package runtime, update information on a Flexcard after saving changes to an LWC Omniscript embedded in a flyout. Add a flyout action on a Flexcard that triggers an event, and create an event listener on the card to refresh. When the card you want to refresh hears the event, it executes a Card Reload action.
• Access the ContextId of a Flexcard on an Experience Site (Managed Package)
  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.
• Configure Community Profiles for Flexcards (Managed Package)
  For the managed package runtime, ensure that your users see Flexcards on Experience Builder sites by configuring user profile settings. Enable the appropriate interface first. Then configure custom object permissions and Apex class access.
• Flexcards Versioning and Cloning (Managed Package)
  For the managed package runtime, Flexcards supports versioning and cloning. You can create an identical copy of a Flexcard based on how you want to use the new version.
• Delete a Flexcard (Managed Package)
  For the managed package runtime, delete a Flexcard from the Flexcards home tab in your org. Once deleted it cannot be retrieved.
• Import a Flexcard (Managed Package)
  For the managed package runtime, import a Flexcard as a data pack from another environment into your org.
• Download Flexcard Sample Data Packs (Managed Package)
  For the managed package runtime, download sample Flexcard data packs with configured Flexcard elements and settings to import into your org. For example, download a Flexcard data pack that displays how to pass data from a parent Flexcard to a child Flexcard.
• Export a Flexcard (Managed Package)
  For the managed package runtime, export a Flexcard as a data pack to import to other environments. You can export one or more Flexcards from the Flexcards home tab or from within the Flexcard Designer.
• Flexcards Context Variables (Managed Package)
  For the managed package runtime, global and local context variables are available to a Flexcard to provide context to data sources, actions, and other components. All variables are case sensitive.
• Flexcards Troubleshooting Considerations (Managed Package)
  For the managed package runtime, when working within the Flexcard Designer, you may run into issues that require some troubleshooting to resolve. Before contacting support, consider these troubleshooting articles.