{"id":35143,"date":"2023-06-20T15:28:00","date_gmt":"2023-06-20T09:58:00","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=35143"},"modified":"2023-07-18T17:14:38","modified_gmt":"2023-07-18T11:44:38","slug":"customer-360-component-in-microsoft-dynamics-365-customer-service","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2023\/06\/customer-360-component-in-microsoft-dynamics-365-customer-service\/","title":{"rendered":"Customer 360 component in Microsoft Dynamics 365 Customer Service"},"content":{"rendered":"<p>In this blog, we will learn about the new feature introduced by Microsoft in the 2023 Release Wave 1. The customer 360 component allows users to visualize the customer data on the case form. Previously, using the quick view form we could visualize the data but couldn\u2019t edit the same. In the customer 360 component, however, we can edit the information of related accounts or contact and can configure the column attributes.<\/p>\n<p><strong><u>Steps to add Customer 360 component on Case form:<\/u><\/strong><\/p>\n<p>In any entity that supports Customer lookup, you can use the following steps to display customer records.<\/p>\n<ul>\n<li><strong>Add the Customer 360 component to the Account and Contact form<\/strong><\/li>\n<\/ul>\n<ol>\n<li>In Power Apps, Select the environment which contains your solution<\/li>\n<li>From the left Navigation pane, Select tables -&gt; Select Account -&gt; In Data experience, Select Forms<\/li>\n<\/ol>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35160\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/1Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"1361\" height=\"657\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/1Microsoft-Dynamics-365-Customer-Service.jpeg 1361w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/1Microsoft-Dynamics-365-Customer-Service-300x145.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/1Microsoft-Dynamics-365-Customer-Service-1024x494.jpeg 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/1Microsoft-Dynamics-365-Customer-Service-768x371.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/1Microsoft-Dynamics-365-Customer-Service-660x319.jpeg 660w\" sizes=\"(max-width: 1361px) 100vw, 1361px\" \/><\/p>\n<p>3. Select the existing main form or create a new main form.<\/p>\n<p>(Note: Remove\/Hide all the elements on a form)<\/p>\n<p>4. In the form designer or from the ribbon bar, click on Components.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35158\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/2Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"847\" height=\"165\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/2Microsoft-Dynamics-365-Customer-Service.jpeg 847w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/2Microsoft-Dynamics-365-Customer-Service-300x58.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/2Microsoft-Dynamics-365-Customer-Service-768x150.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/2Microsoft-Dynamics-365-Customer-Service-660x129.jpeg 660w\" sizes=\"(max-width: 847px) 100vw, 847px\" \/><\/p>\n<p>5. On the bottom side, click on Get More Components to import the component; if it is already imported, it will display under the More Components category.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35157\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/3Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"313\" height=\"183\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/3Microsoft-Dynamics-365-Customer-Service.jpeg 313w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/3Microsoft-Dynamics-365-Customer-Service-300x175.jpeg 300w\" sizes=\"(max-width: 313px) 100vw, 313px\" \/><\/p>\n<p>6. After clicking on Get More components, search for Customer 360 and click on Add.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35156\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/4Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"812\" height=\"393\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/4Microsoft-Dynamics-365-Customer-Service.jpeg 812w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/4Microsoft-Dynamics-365-Customer-Service-300x145.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/4Microsoft-Dynamics-365-Customer-Service-768x372.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/4Microsoft-Dynamics-365-Customer-Service-660x319.jpeg 660w\" sizes=\"(max-width: 812px) 100vw, 812px\" \/><\/p>\n<p>7. Drag the Component on the form and the window will appear.<\/p>\n<p>You can select the attributes which you want to see within the component. You can select up to seven attributes and three composite attributes.<\/p>\n<p><strong>Enable Editing field<\/strong> \u2013 This dropdown menu allows users to specify whether they are allowed to edit the fields in the component.<\/p>\n<p><strong>Show Border<\/strong> \u2013 This field allows you to configure whether to show a border or not. By default, it is set as NO.<\/p>\n<p><strong>Margin Start<\/strong> \u2013 This field allows you to pick a Margin start. If show border is enabled then this value is ignored.<\/p>\n<p><strong>Show Static Header<\/strong> \u2013 In the control header, the account and contact name are displayed when a customer is selected from a customer lookup. If you want to show a static header, set this field to yes.<\/p>\n<p><strong>Enable Rich Text Editor for Multiline text fields<\/strong> \u2013 If this field is enabled, All multiline text fields value will be rendered and edited in Rich text Format.<\/p>\n<p><strong>Custom Rich Text Editor Configuration URL<\/strong> \u2013 Specify this field to add advanced configuration for the rich text editor control.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35155\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/5Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"305\" height=\"637\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/5Microsoft-Dynamics-365-Customer-Service.jpeg 305w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/5Microsoft-Dynamics-365-Customer-Service-144x300.jpeg 144w\" sizes=\"(max-width: 305px) 100vw, 305px\" \/> <img decoding=\"async\" class=\"alignnone size-full wp-image-35162\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/6Microsoft-Dynamics-365-Customer-Service-1.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"297\" height=\"627\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/6Microsoft-Dynamics-365-Customer-Service-1.jpeg 297w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/6Microsoft-Dynamics-365-Customer-Service-1-142x300.jpeg 142w\" sizes=\"(max-width: 297px) 100vw, 297px\" \/><\/p>\n<p><a href=\"https:\/\/www.inogic.com\/product\/mailchimp-dynamics-365-crm-integration-marketing-4-dynamics\/\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" class=\"alignnone size-full wp-image-35425\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/Map-My-Relationship.gif\" alt=\"\" width=\"800\" height=\"200\" \/><\/a><\/p>\n<p>8. You can also configure where to show the component. (Web, Mobile, Tablet)<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35153\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/7Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"277\" height=\"233\" \/><\/p>\n<p>9. Now click on the Done button -&gt; Save and Publish the form.<\/p>\n<p><u>Note<\/u>: Once you click on done, you cannot edit the first attribute.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35164\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/8Microsoft-Dynamics-365-Customer-Service-2.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"797\" height=\"382\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/8Microsoft-Dynamics-365-Customer-Service-2.jpeg 797w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/8Microsoft-Dynamics-365-Customer-Service-2-300x144.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/8Microsoft-Dynamics-365-Customer-Service-2-768x368.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/8Microsoft-Dynamics-365-Customer-Service-2-660x316.jpeg 660w\" sizes=\"(max-width: 797px) 100vw, 797px\" \/><\/p>\n<p>10. Repeat the same steps to add components to the contact form.<\/p>\n<p><strong>2. Add the Customer or Account Form with the Customer 360 Component to the Case form.<\/strong><\/p>\n<p>1. In the same environment, from the left Navigation pane, Select tables -&gt; Select Case -&gt; In Data experience, Select Forms.<\/p>\n<p>2. Select the existing main form or create a new main form.<\/p>\n<p>3. From the left Navigation pane, Clear the Show only unused table columns checkbox.<\/p>\n<p>4. Drag the Customer field on the form.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35151\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/9Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"883\" height=\"391\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/9Microsoft-Dynamics-365-Customer-Service.jpeg 883w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/9Microsoft-Dynamics-365-Customer-Service-300x133.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/9Microsoft-Dynamics-365-Customer-Service-768x340.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/9Microsoft-Dynamics-365-Customer-Service-660x292.jpeg 660w\" sizes=\"(max-width: 883px) 100vw, 883px\" \/><\/p>\n<p>5. In the properties section of customer lookup, scroll down and expand components.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35150\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/10Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"905\" height=\"430\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/10Microsoft-Dynamics-365-Customer-Service.jpeg 905w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/10Microsoft-Dynamics-365-Customer-Service-300x143.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/10Microsoft-Dynamics-365-Customer-Service-768x365.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/10Microsoft-Dynamics-365-Customer-Service-660x314.jpeg 660w\" sizes=\"(max-width: 905px) 100vw, 905px\" \/><\/p>\n<p>6. Click on add component \u2013&gt; Select Form -&gt; Click on Related form.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35149\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/11Microsoft-Dynamics-365-Customer-Service-ink.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"281\" height=\"247\" \/><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35148\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/12Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"925\" height=\"440\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/12Microsoft-Dynamics-365-Customer-Service.jpeg 925w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/12Microsoft-Dynamics-365-Customer-Service-300x143.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/12Microsoft-Dynamics-365-Customer-Service-768x365.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/12Microsoft-Dynamics-365-Customer-Service-660x314.jpeg 660w\" sizes=\"(max-width: 925px) 100vw, 925px\" \/><\/p>\n<p>7. Select the related tables and form with component 360 and click on Add button.<\/p>\n<p>8. Repeat steps 6 &amp; 7 to add the Contact entity and form.<\/p>\n<p>9. Save and Publish the form.<\/p>\n<p>Note: Make sure you add these forms to your application. You can add the\u00a0<strong>Customer 360<\/strong>\u00a0card to a custom form in the Customer Service workspace and Omnichannel for Customer Service.<\/p>\n<p>When the User selects contact in the Customer field:<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35147\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/13Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"902\" height=\"440\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/13Microsoft-Dynamics-365-Customer-Service.jpeg 902w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/13Microsoft-Dynamics-365-Customer-Service-300x146.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/13Microsoft-Dynamics-365-Customer-Service-768x375.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/13Microsoft-Dynamics-365-Customer-Service-660x322.jpeg 660w\" sizes=\"(max-width: 902px) 100vw, 902px\" \/><\/p>\n<p>When the user selects an account in the customer field:<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35146\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/14Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"884\" height=\"427\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/14Microsoft-Dynamics-365-Customer-Service.jpeg 884w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/14Microsoft-Dynamics-365-Customer-Service-300x145.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/14Microsoft-Dynamics-365-Customer-Service-768x371.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/14Microsoft-Dynamics-365-Customer-Service-660x319.jpeg 660w\" sizes=\"(max-width: 884px) 100vw, 884px\" \/><\/p>\n<p>If enable editing field is set as yes then you can edit the field: &#8211;<\/p>\n<p>Click on the edit icon -&gt; All the fields are editable now -&gt; Edit the field and click on the save button.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-35145\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/15Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"379\" height=\"367\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/15Microsoft-Dynamics-365-Customer-Service.jpeg 379w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/15Microsoft-Dynamics-365-Customer-Service-300x291.jpeg 300w\" sizes=\"(max-width: 379px) 100vw, 379px\" \/> <img decoding=\"async\" class=\"alignnone wp-image-35144\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/16Microsoft-Dynamics-365-Customer-Service.jpeg\" alt=\"Microsoft Dynamics 365 Customer Service\" width=\"347\" height=\"365\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/16Microsoft-Dynamics-365-Customer-Service.jpeg 391w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2023\/06\/16Microsoft-Dynamics-365-Customer-Service-285x300.jpeg 285w\" sizes=\"(max-width: 347px) 100vw, 347px\" \/><\/p>\n<p><strong>Conclusion<\/strong><\/p>\n<p>Using this Component control, you can configure attributes of related accounts and contact information and can easily edit the information without switching entities.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this blog, we will learn about the new feature introduced by Microsoft in the 2023 Release Wave 1. The customer 360 component allows users to visualize the customer data on the case form. Previously, using the quick view form we could visualize the data but couldn\u2019t edit the same. In the customer 360 component,\u2026 <span class=\"read-more\"><a href=\"https:\/\/www.inogic.com\/blog\/2023\/06\/customer-360-component-in-microsoft-dynamics-365-customer-service\/\">Read More &raquo;<\/a><\/span><\/p>\n","protected":false},"author":11,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[18],"tags":[2713],"class_list":["post-35143","post","type-post","status-publish","format-standard","hentry","category-dynamics-365-v9-2","tag-microsoft-dynamics-365-customer-service"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/35143","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/comments?post=35143"}],"version-history":[{"count":0,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/35143\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media?parent=35143"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/categories?post=35143"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/tags?post=35143"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}