How to Use HTML Web Resource in Dynamics CRM

HTML Web Resources are one of the most powerful customization options available in Dynamics CRM and Dynamics 365. They allow developers to create custom user interfaces using HTML, CSS, and JavaScript and embed them directly into forms, dashboards, and applications.

By using HTML Web Resources, organizations can extend standard Dynamics 365 functionality and deliver richer user experiences tailored to their business requirements.

What is an HTML Web Resource?

An HTML Web Resource is a custom HTML page stored inside Dynamics CRM that can contain HTML, CSS, JavaScript, images, and external libraries.

Create custom forms and pages
Display dynamic content
Embed external applications
Integrate JavaScript functionality
Build interactive user interfaces

Benefits of HTML Web Resources

Flexible UI customization
Enhanced user experience
Custom business logic implementation
Support for third-party libraries
Reusable components across forms

Create an HTML Web Resource

Navigate to Solutions.
Select Web Resources.
Click New.
Enter a unique Name.
Select Type as HTML.
Upload your HTML file.
Save and Publish.

Sample HTML Web Resource:

<html>
<body>
    <h2>Welcome to Dynamics 365</h2>
    <button onclick="alert('Hello CRM')">
        Click Me
    </button>
</body>
</html>

Add HTML Web Resource to a Form

Open the desired form.
Select a tab or section.
Insert a Web Resource component.
Select the HTML Web Resource.
Configure display settings.
Save and Publish the form.

Pass Data to HTML Web Resource

Parameters can be passed from Dynamics 365 forms to HTML Web Resources using query string parameters and JavaScript.

var recordId = Xrm.Page.data.entity.getId();

The record information can then be used inside the HTML page for custom processing.

Important: Avoid using deprecated Xrm.Page methods in new implementations. Use formContext whenever possible.

Common Use Cases

Custom dashboards
Embedded reports
Interactive charts
Third-party integrations
Custom data visualization
Advanced business workflows

Best Practices

Keep HTML pages lightweight.
Use responsive design principles.
Minimize external dependencies.
Follow Dynamics 365 security guidelines.
Test across different browsers.
Use modern JavaScript practices.

Key Takeaways

HTML Web Resources extend Dynamics CRM functionality.
They support HTML, CSS, JavaScript, and external libraries.
Can be embedded directly into forms and dashboards.
Ideal for creating custom user experiences.
Following best practices improves maintainability and performance.