Add an Icon or an Image to a Flexcard

Add icons or images to a Flexcard from an existing library or use your own. Then, add actions, CSS classes, and configure their dimensions to fit your company or institution.

  1. From the App Launcher, find and select Flexcards.
  2. Expand a Flexcard and select a version.
  3. If needed, deactivate the Flexcard for editing the Flexcard.
  4. Drag the Icon or Image element from the elements panel to the canvas.
  5. Enter the icon name or image source information:
    1. To use a custom icon or image from an external source, enter the absolute URL of the image. Ensure that you add that URL to the trusted URLs list. See Manage Trusted URLs.
    2. To use an existing file, search for it by clicking the magnifier icon. When you upload a local image, Salesforce copies it to the Content Document library for reuse.
      Note
      Note

      Salesforce recommends using an image or icon as a static resource instead of uploading it.

    3. For images and icons, to use a file uploaded as a static resource (Image: Image source; Icon: Icon Source URL), enter /resource/resourceName, where resourceName is the name of the static resource.

      To create a static resource, see Define Static Resources.

      Note
      Note

      Images used in Flexcards on Experience Cloud pages must be static resources.

  6. Enter the remaining information as needed.
    Note
    Note For images, the Title field supports concatenated strings, including a combination of plain text and supported merge fields, such as {Label.AccountName} > {Name}.