Satisfies MicrosoftDocs/dynamics-365-customer-engagement-pr#4759

Author: Mattp123

powerapps-docs/maker/common-data-service/display-custom-icons-instead.md

@@ -2,7 +2,7 @@
 title: "Display custom icons alongside values in list views with PowerApps | MicrosoftDocs"
 description: "Learn how to display custom icon graphics in a view"
 ms.custom: ""
-ms.date: 02/14/2019
+ms.date: 11/20/2019
 ms.reviewer: ""
 ms.service: powerapps
 ms.suite: ""
@@ -29,23 +29,24 @@ search.app:
 
  PowerApps environment administrators and customizers can add graphics to a view and establish the logic used to select a graphic based on the column value using JavaScript. The capability lets you customize list views that display icons alongside text or numerical values. 
 
+This example displays custom icons in a view for the opportunity entity, which is available with certain apps, such as Dynamics 365 Sales. You can display custom icons in views with other standard entities, such as the account or contact entity, as well as custom entities. 
+
 > [!div class="mx-imgBorder"] 
 > ![](media/icon-in-opportunity-view.png "All Opportunities view with Rating column displaying icons and text value")
   
-> [!NOTE]
->  Grid icons are only shown in the web interface. They are not shown in [!INCLUDE[pn_Outlook_short](../../includes/pn-outlook-short.md)] or the mobile app.  
+Custom icons in list views can display in Unified Interface, legacy web client, mobile app, and App for Outlook. 
 
-### Add custom graphics and JavaScript as web resources  
+## Add custom graphics and JavaScript as web resources  
 
 1.  Create the new graphic files needed for your customization. We recommend an icon size of 16x16 pixels (larger images will be scaled down).  
 
-2.  Write one or more JavaScript functions that establish which icons to show for which values (you'll typically need one function for each column you want to customize). Each function must accept a row data object and a language (LCID) code as input and return an array containing an image name and tooltip text. For an example function, see [Sample JavaScript function](#SampleJavascript), later in this topic.  
+2.  Write one or more JavaScript functions that establish which icons to show for which values (you'll typically need one function for each column you want to customize). Each function must accept a row data object and a language (LCID) code as input and return an array containing an image name and tooltip text. For an example function, see [Sample JavaScript function](#SampleJavascript), later in this article.  
 
-3.  Sign into your environment as an administrator and open solution explorer.  
+3.  Sign into your environment as an administrator and open [solution explorer](../model-driven-apps/advanced-navigation.md#solution-explorer).  
 
 4.  The **Default Solution** pop-up window opens. Navigate to **Components** > **Web Resources** here.  
 
-5.  Now, you'll upload your custom graphics, one at a time, as web resources. Select the **New** button in the toolbar to create a new web resource. Another pop-up window opens to help you create the resource. Do the following:  
+5.  Now, you'll upload your custom graphics, one at a time, as web resources. Select the **New** button in the toolbar to create a new web resource. Another pop-up window opens to help you create the resource. Follow these steps:  
 
     1.  Give the new resource a meaningful **Name**. This is the name that you'll use to refer to each graphic from your JavaScript code.  
 
@@ -89,7 +90,7 @@ search.app:
 
 14. Repeat these steps for each entity, view, and column as needed.  
 
-15. When you are ready, select **Publish All Customizations** to publish  your changes. Then, close the **Default Solution** window.  
+15. When you're ready, select **Publish All Customizations** to publish  your changes. Then, close the **Default Solution** window.  
 
 <a name="SampleJavascript"></a>   
 
@@ -156,7 +157,27 @@ function displayIconTooltip(rowData, userLCID) {
 
  <!-- This results in displaying icons with tooltips in the **Rating** column that depend on the value in each row. The result could look like this:  
   
- ![Custom column graphics example](../customize/media/custom-column-graphics-example.png "Custom column graphics example")  -->
+ ![Custom column graphics example](../customize/media/custom-column-graphics-example.png "Custom column graphics example")  --> 
+
+## Custom icon view display behavior
+### Primary fields 
+In the grid list view, custom icons applied to the entity primary field replace the default system-generated icon. 
+
+> [!div class="mx-imgBorder"] 
+> ![](media/mobile-primary-field-custom-icon-display.png "Primary field replaces default icon in the custom icon view")
+
+### Other fields 
+In the grid list view, custom icons applied to a field that isn't the entity primary field display as a secondary icon in addition to the default system-generated icon. 
+
+> [!div class="mx-imgBorder"] 
+> ![](media/card-form-not-primary-field.png "Not an entity primary field custom icon view")
+
+### Card forms
+Custom icons replace the default system-generated icon when the view is configured to use a card form. 
+
+> [!div class="mx-imgBorder"] 
+> ![](media/card-view-icon-display.png "Card view custom icon view")
+
 
  ### See also
 [Understand model-driven app views](../model-driven-apps/create-edit-views.md)