Posts Tagged Getting Started Pane

Creating a Getting Started Pane in CRM 2011

Objective: Update the Account “Getting Started” help pane (Also known as Help Visor).

In CRM 2011 there is a great new feature called the “Getting Started Pane”. If you look at any of the system entities you will see Microsoft have created and tailored a pane with useful content for each entity. Recently I was asked how do you create one of these panes for a custom entity? Today I am going to explore the steps needed to do this and make it available in your CRM 2011 system.

One thing to note straight away is this process involves customizing HTML and adding JavaScript custom actions. This task would suit a dev type with the support of a functional person who can provide the actual content. You will need the CRM 2011 SDK kit to assist you.

Here are the steps to create a new custom help pane. In this example we will link to a video online, add a new video thumbnail and add in 2 custom content links:

1)      In CRM 2011 you will need a solution ready with your custom entity. For this example I have a custom entity called “Interests”.

2)      Firstly export your Solution with the custom entity and ensure a Site Map has been added as a Solution Component. Save the customizations file on your development machine, we will use this again later.

3)      In the CRM 2011 SDK kit find the Help Visor Template under “\SDK\Resources\GetStartedPaneTemplate”.

4)      Copy the “HelpVisor” folder to your development machine.

5)      In this example will use English (1033) only, so will not be creating new language folders.

6)      In the HelpVisor folder open up the HelpVisorTemplate.htm file in the 1033 Folder and edit it with an editor (like Visual Studio).

7)      To replace the video image you need to add an image to the “image” folder of size 104 x 76px.

8)      In the HelpVisorTemplate.htm  file locate the “VideoContainer” tags and update the image directory to point to your custom image. For my entity “Interests” I am using a bicycle image called “bike.jpg”. I have also changed the video link to point to a CRM 2011 video on YouTube just as an example. You could have a prepared content video and link to that in a Production system. You can also refine whether the video popups up in a new window/tab or is embedded.

9)      Add in “TitleSection” description and a “DescriptionSection” description, in my example I have used “Getting Started with Interests”

10)   By default your Visor has column and row placeholders. These will need to be edited and replaced with your content and actions.  Each link can be an action item or redirect you to a detail page where you have specific information. Below I have added in a custom action for “Business Interests”. In a Production system you could add many of these references liniking to custom pages you deploy within your HelpVisor solution. Better yet you may link to content on your corporate network.

11)   Once complete your Visor should look something like this:

We are now ready to upload this to the “Interests” entity in CRM.

12) Using the Web Resources Utility tool found in the SDK kit. I highly recommend reading the “read me” file associated with the Web Resource utility, it looks and feels a bit like the Plug-in Registration tool, but there are a few more complexities. E.g. Resources must match the file structure for relative links to work correctly.

For example:


DynamicXrmSolutions _/Scripts/HelpVisor.js

DynamicXrmSolutions _/1033/HelpVisorTemplate.htm

DynamicXrmSolutions _/1033/Content/Content1.htm

Whatever you choose for your naming convention, make sure you note the path to the “redir.htm” file as this is needed in the sitemap.

13) Upload & Publish the files in the HelpVisor folder as Web Resources.

You will see the Resources appear in your Web Resources list in CRM almost immediately

14)  The next step is to update the Site Map and make reference to the new Help Visor. Open the Customizations file you exported earlier and do a search for the “SubArea” with your entity name. In my example the entity schema name is called “dxrms_interests”

The tag we need to modify is the “GetStartedPanePath”. Update the Web Resource URL to point to your root path (As noted when you uploaded the Web Resources linking to the redir.htm file.

15)  Once this is complete, save your customizations file. Add it back into the Solution Zip file you exported (So far it seems you cannot upload a Customizations file separately outside of a .zip or cab .file). Import your Customizations and Publish your Solution. You will also need to refresh your browser to see the changes. You should now see the Getting Started Pane appearing above your custom entity!

Side note: I looked in customizing the system entity Help visors, but this appears to be unsupported. You would need to pull down the entity help visor .htm file from the CRM website and right there I feel we are in unsupported territory. I would be interested to hear other peoples thoughts on this and Microsoft’s stance.

, , , , , , ,