🥐Add Copilot into Rich Text Control

Hello, my friends,

Did you use the Copilot on Email form?

Both my client and I have tested this solution and found it effective. Copilot can enhance these suggestions by making them clearer, more concise, and more engaging.

Subsequently, I discovered that this Copilot functionality can be integrated with the Rich Text Editor control for any desired entity, enhancing its functionality.

1. How to add the Rich Text Editor control?

I created a custom entity called "Devices" in my Sales Hub app. After that, I created a field "Note" - with type: Multiple lines of text

Okay.. firstly, I will add the Rich Text Editor control for the field "Note" on the Device's main form without any customizations.

The original Rich Text Editor control (green box) has no Copilot button.

2. Customize Rich Text Editor Control - Add Copilot button

2.1 Create Web Resource - add Copilot to rich text editor control

Now, I will create the Web Resource to add the Copilot button in the Rich Text Editor control on the Device Main form.

In my solution, I created a web resource as below. You can find the sample code from MS Link.

My sample code as below:

// JavaScript
{"defaultSupportedProps": {
    "extraPlugins": "copilotrefinement",
    "toolbarLocation": "bottom",
    "toolbar":[{ "items": ["CopyFormatting","FontSize", "Bold", "Italic", "Underline", "BGColor", "CopilotRefinement"]}]
}
}

2.2 Add Web Resource into Rich Text Editor control on the form

Finally, we need to add this web resource for the Rich Text Editor control on entity Form - as my sample is Device form. Then Save and Publish the form.

Testing now...

Check the result now... ☺️

At present, the Copilot feature for Rich Text Editor control is limited to refining paragraphs, but there is hope that this functionality will become more robust soon.

Thank you for reading & Hoping well. 🎉 🥅 [NTD]yns.asia