Are you willing to customize contact related list on the Account detail page in Salesforce? This blog is just right for you! Today, we are going to tell you how to achieve it using Salesforce Lightning Component. In this blog, we are going to create a custom contact-related list component to add contacts that will be similar to the standard-related component.
But first, you need to know the concepts used to implement this solution-
1. lightning:card – A lightning:card applies a stylized container around a grouping of information. The information can be anything, a single item, or a group of items such as a related list. A lightning:card can have a title, body, actions, and a footer in it. The title, actions, and footer are optional.
2. $A.createComponent – To represent any lightning component dynamically in the client-side JavaScript code, you can use $A. createComponent() and to create multiple components, you can use $A. createComponents().
3. force:navigateToRelatedList – This event enables you to navigate to the related list specified by parentRecordId.
4. force:recordData – A force:recordData component defines the parameters for accessing, modifying, or creating a record using Lightning Data Service.
Code
ContactRelatedListLightningCmp
ContactRelatedListLightningCmp.js
ContactRelatedListCtrl
NewContactLightningCmp
NewContactLightningCmp.js
Conclusion
Thus, customizing contact related list on the Account detail page in Salesforce has never been easier than this! We hope that you liked this smart solution. If you try out this solution, then do share your experiences with us. We would love to receive your feedback! We will be back with another innovative solution for you next week. Till then, happy learning!
India 
USA
UK
Canada