Modifying Profile Page In Dynamics 365 Portal

Introduction

In this article, we are going to discuss how we can customize Dynamics 365 portal profile page.

Requirement

Let’s say we have the following requirements to change a profile page

1. Hide Parent account
2. Hide Manage access
3. Change the Text to “Please make sure your personal information is up to date”
4. Hide Email confirmation
5. Hide Preferred Language
6. Hide How can we contact you
7. Add a Cancel button to redirect to the portal home page.
   

Solution

We can implement 1, 2, 3, 4, 5, and 7 requirements by writing a simple Jquery on the profile page and 4 and 6 can be handled by the portal site setting. Let’s first disable 4 and 6.

1. Navigate to Portals->Site Settings
2. Add the following site settings, if not available otherwise, make sure they are set to false.
   
   

Now, we need to find out the IDs of the fields that we want to hide. To know the ID of the control, we can open the profile page right-click on the control that we want to hide, and select Inspect. For example, here is the ID of language lookup.

Some of the controls won’t have it so we need to hide them using other attributes.

To change the text, we can navigate to the Profile page content page and make changes under the HTML tab.

To hide 1, or 2 links we can use the following jQuery code.

$('a[title="Parent account"]').hide();
$('a[title="Manage access"]').hide();

To hide language lookup we can use the following jQuery

$('#adx_preferredlanguageid').closest('td').hide()

Now, we need to add a cancel button. First, check the Update button ID so that we can put our button next to it. After that, we can use the following code to add a Cancel button

$('#ContentContainer_MainContent_MainContent_ContentBottom_SubmitButton').after('<input type="button" value="Cancel" onclick="OnCancelClick()" id="CancelButton" class="btn btn-primary"/>')

After all the steps are complete, the jQuery code should look like the one below.

$(document ).ready(function() {  
    //hide language lookup based on lookup id  
    $('#adx_preferredlanguageid').closest('td').hide();  
    //hide Parent account and Manage access links  
    $('a[title="Parent account"]').hide();  
    $('a[title="Manage access"]').hide();  
    //Add cancel button next to update button  
    $('#ContentContainer_MainContent_MainContent_ContentBottom_SubmitButton').after('<input type="button" value="Cancel" onclick="OnCancelClick()" id="CancelButton" class="btn btn-primary"/>');  
});  

//Navigate to home page on Cancel Click  
function OnCancelClick()  
{  
    window.location.href="/";  
}

We need to place this code under the Custom Javascript section under Advanced like below.

Finally, save your changes and check the profile page in the portal and it should look like below.

Stay tuned for more Dynamics 365 Contents.