---
schema_version: "1"
id: e5fb81d5288e7034dd2acf13a50666397e29f787cb8cee8e5c8df360177c742d
title: Add Static Images to Messaging Components
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/service/264-0-0/messaging_components_images_static.md
canonical_url: https://help.salesforce.com/s/articleView?id=service.messaging_components_images_static.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 7ef5403890296da8af38d8de4697e9d9efc662c732d66af409df8ac491f5dedb
description: If you want a messaging component to always show the same image or images, define the images in the Messaging Component Builder using constants. Standard constants are auto-created, while you create custom constants manually.
products:
  - Service Cloud
  - Digital Engagement
release: "264"
---
# Add Static Images to Messaging Components

If you want a messaging component to always show the same image or images, define the images in the Messaging Component Builder using constants. Standard constants are auto-created, while you create custom constants manually. 

### Required Editions

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small edition">
        <colgroup>
          <col style="width:50%">
          <col style="width:50%">
        </colgroup>
        <tbody>
          <tr class="">
            <td class="slds-cell-wrap" colspan="2" style="vertical-align:top;"><a href="https://help.salesforce.com/s/articleView?id=service.messaging_editions.htm&amp;type=5&amp;language=en_US" target="_blank">View supported editions.</a></td>

          </tr>
          <tr class="">
            <td class="slds-cell-wrap" style="vertical-align:top;">
              <a name="messaging_components_images_static__d1218e840"><!-- --></a><span style="vertical-align:text-bottom;display:inline-block;"><img style="margin-bottom:0;" id="messaging_components_images_static__d1218e840" src="https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-service-support_channels-264-0-0-production-enus/f3c4b3d2-ff86-4f7c-9fe2-3d8b23d35109/resources-global/_corporate/images/checkmark.png" alt="Checkmark"></span>
              <strong>This article applies to:</strong>
            </td>

            <td class="slds-cell-wrap" style="vertical-align:top;">Enhanced In-App Chat, Enhanced Web Chat v1, Enhanced Web Chat v2, Enhanced
              WhatsApp, Enhanced Facebook Messenger, Enhanced Apple Messages for Business, Enhanced
              LINE, and Bring Your Own Channel</td>

          </tr>
          <tr class="">
            <td class="slds-cell-wrap" style="vertical-align:top;">
              <span style="vertical-align:text-bottom;display:inline-block;"><img style="margin-bottom:0;" src="https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-service-support_channels-264-0-0-production-enus/f3c4b3d2-ff86-4f7c-9fe2-3d8b23d35109/resources-global/_corporate/images/crossmark.png" alt="X icon"></span>
              <strong>This article doesn’t apply to:</strong>
            </td>

            <td class="slds-cell-wrap" style="vertical-align:top;">Standard and Enhanced SMS channels</td>

          </tr>
        </tbody>
      </table> <table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small permission">
        <colgroup>
          <col style="width:50%">
          <col style="width:50%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="colgroup" class="slds-cell-wrap" colspan="2" style="text-align:center;vertical-align:top;" id="d159484e98">User Permissions Needed</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="User Permissions Needed" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e98 ">To create messaging components:</td>

            <td class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e98 ">
              <p>Customize Application AND View Setup and Configuration </p>
              <p>OR</p>
              <p style="margin-bottom:0;">System
                Administrator </p>
            </td>

          </tr>
          <tr class="">
            <td data-label="User Permissions Needed" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e98 ">To send and receive messages in Messaging:</td>

            <td class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e98 ">Messaging Agent</td>

          </tr>
        </tbody>
      </table>

First, let’s review the differences between standard and custom image constants. While this article focuses on image constants, the same principles apply for text and URL constants. All constants are found on the same tab in the Messaging Component Builder.

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small ">
        <colgroup>
          <col style="width:20%">
          <col style="width:20%">
          <col style="width:20%">
          <col style="width:20%">
          <col style="width:20%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d159484e155">Type</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d159484e158">How It’s Created</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d159484e161">Examples</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d159484e164">Editable?</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d159484e167">Deletable?</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="Type" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e155 ">Standard image constants</td>

            <td data-label="How It’s Created" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e158 ">When you upload an image during the New Component setup flow, a standard constant is
              created for it.</td>

            <td data-label="Examples" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e161 ">
              <ul>
                <li>When you create an enhanced link and upload an image to show with the link, the image
                  is saved as a standard constant.</li>

                <li>When you create a payment messaging component and upload an image to show with it, the
                  image is saved as a standard constant.</li>

              </ul>
            </td>

            <td data-label="Editable?" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e164 ">Yes, from the Constants tab in the Messaging Component Builder.</td>

            <td data-label="Deletable?" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e167 ">No, but you can replace an original uploaded image by editing its standard constant.
              You can also choose not to use the constant.</td>

          </tr>
          <tr class="">
            <td data-label="Type" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e155 ">Custom image constants</td>

            <td data-label="How It’s Created" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e158 ">Add custom constants after finishing the New Component setup flow. Use the ImageAsset
              type.</td>

            <td data-label="Examples" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e161 ">
              <ul>
                <li>After creating a question with options, add a custom image constant to show with the
                  question.</li>

                <li>After creating a form messaging component, add a custom image constant to show with the
                  form link.</li>

              </ul>
            </td>

            <td data-label="Editable?" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e164 ">Yes, from the Constants tab in the Messaging Component Builder.</td>

            <td data-label="Deletable?" class="slds-cell-wrap" style="vertical-align:top;" headers="d159484e167 ">Yes, from the Constants tab in the Messaging Component Builder.</td>

          </tr>
        </tbody>
      </table>

Now, review the process for adding static images to a messaging component.

![Five steps of adding static images: Create messaging component, add one or more component formats, add or edit image constants on constants tab, set format properties to reference constants, and agent sends component.](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-service-support_channels-264-0-0-production-enus/f3c4b3d2-ff86-4f7c-9fe2-3d8b23d35109/support_channels/images/messaging/image_process_constants.png)

1. Create the messaging component in Setup.
    1. From Setup, enter Messaging Components in the Quick Find box, and then select **Messaging Components**.
    2. Click **New Component**.
    3. Complete the flow to create your component. When the component is created, the Messaging Component Builder opens.
2. Add one or more [supported formats](https://help.salesforce.com/s/articleView?id=service.messaging_component_formats.htm&release=264.0.0&type=5 "With messaging components, you can send structured content such as questions with options in enhanced Messaging channels and Enhanced Chat. Learn the purpose, format, and setup process of each component type.") to the component.
    1. From the Details tab in the Messaging Component Builder, click **Add Format** and select a format.
    2. For each format that you add, click its name in the navigation menu and check the properties pane to determine how many images it can include. For example, look for properties named Initial Image or Confirmation Image.
3. Manage your constants on the Constants tab.
    1. If you uploaded an image while creating the component, it’s shown as a standard constant in the Constant section. To change a constant’s name or update its image file, click **Edit**.
    2. To include other images, add them in the Custom Constant section. Use the ImageAsset type.
        
        ![Messaging Component Builder with Custom Contant section highlighted](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-service-support_channels-264-0-0-production-enus/f3c4b3d2-ff86-4f7c-9fe2-3d8b23d35109/support_channels/images/messaging/images_constants_1.png)
4. Update each format’s image properties to use image constants.
    1. Click a format name in the navigation menu, such as List Selector.
    2. For each image property, select the **Constant** type and select an image constant. If you don’t want to include an image, leave the type as None.
        
        ![Messaging component with List Selector format shown, and the Initial Image Configuration property highlighted](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-service-support_channels-264-0-0-production-enus/f3c4b3d2-ff86-4f7c-9fe2-3d8b23d35109/support_channels/images/messaging/images_constants_2.png)
5. To send the component during a messaging session, service reps can select it from a list in the messaging component action and click **Send**. If you configured an image property to use an image constant, the customer sees the image in the messaging component.

![Note](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-service-support_channels-264-0-0-production-enus/f3c4b3d2-ff86-4f7c-9fe2-3d8b23d35109/images/icon_note.png)

Note In some list formats such as List Selector and Card Carousel, you can show an image with each list option. To add images to your list options, edit each item in the Options section of the Constants tab when viewing your messaging component. Then, reference that constant in the format’s image property for its list options.

#### See Also

- [Add Dynamic Images to Messaging Components](https://help.salesforce.com/s/articleView?id=service.messaging_components_images_dynamic.htm&release=264.0.0&type=5 "If you want a messaging component to show different images depending on the situation, define the images in the Messaging Component Builder by using parameters or sObject formulas. Adding dynamic images to messaging components is more advanced than adding static images, but it’s an effective way to personalize messages sent to customers.")
- [Send Messaging Components in Messaging Sessions](https://help.salesforce.com/s/articleView?id=service.messaging_send_components.htm&release=264.0.0&type=5 "Messaging components let you send structured content, such as a question with clickable options, to customers in enhanced Messaging channels and Enhanced Chat. Admins create messaging components ahead of time so that service reps can quickly select and send them during messaging sessions.")