Blog, Customization, Development

Creating Model Driven Apps Side Panels like a boss

If you use model-driven applications regularly you might notice a “Copilot” Side Pane that appears immediately after your app (Sales/Service/Marketing/Something Else) is loaded:

I decided to investigate and share how to create a similar functionality in this blog post.


There are 3 components that make this solution complete:

  • Html/JS webresource that will be shown in the panel (I will use my Entity Navigator page as an example, you can use any page you want to embed in that panel)
  • JS webresource that will load and configure the side panel
  • Global Ribbon button that will not be visible to a user and will serve a load trigger role in this solution


The whole idea of this script is to load and configure the Side Panel leaving no traces. Here is the code with the comments:


Create an empty solution and add “Application Ribbons” (Add Existing -> More -> Other -> Application Ribbons) into it:

Once that’s done – open this new solution using “Ribbon Workbench”, locate “Mscrm.GlobalTab” in the “Home” ribbon, and add a button to it (I added my button nearby “Copilot” button):

Add a command where the key element is a “Custom” enable rule that references the WebResource resource created on the previous step:

Save and publish the ribbon. If everything is done right you will see your panel automatically loading.


You can find the source code and solution in this GitHub repository –

Cover photo by Luke Peters on Unsplash

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.