Adding a Button to the Main CRM Ribbon in 2011

I find one of the most frequently requested enhancements to CRM is the addition of a button to the main menu that will launch an external URL.   Common examples of what customers want a button to provide access to include: the organisation’s intranet, a corporate reporting tool, a timesheet application,  quoting tool, an inventory inquiry screen.

So here’s a quick run through on how to add a button to CRM that will appear right next to the Advanced Find button in both the web client and the Outlook client which when clicked will launch a predefined URL…

Desired end result:

image

 

Step 1 – Create a new Solution called Ribbon

image

 

Step 2 – Click Add Existing and select the Application Ribbon component

Note: in my previous blog on customising the ribbon we added to our solution the CRM entity whose ribbon we wanted to change.  Here we want to change the global ribbon so we place the Application Ribbon in our Solution instead

image

 

Step 3 – Click Export Solution and save the ZIP file to your desktop

image

 

Step 4 – Navigate to the exported Solution file, unzip it into a folder of the same name, and then navigate to the unzipped files

image

 

Step 5 – Open the customisation.xml file in Visual Studio

image

 

Step 6 – In Visual Studio, add the following 4 schemas (from ..sdk\schemas) – to add intellisense:

image

 

Now before we can start coding our changes we need to determine the location Id of where we want our button added…

 

Step 7 – Navigate to the sdk folder location below and open the file applicationribbon.xml in Visual Studio:

..sdk\samplecode\cs\client\ribbon\exportribbonxml\exportedribbonxml

[UPDATE: 14 Dec 2011 – The latest SDK did not include the ribbon definition XML files forcing you to build and run an app from source code provided in order to generate them for your self.  I provide instructions on this process here]

Step 8 – Do a Find for…

<Group Id="Mscrm.HomepageGrid.{!EntityLogicalName}.MainTab.

… and then scan down under that Group until you find the Advanced Find button.  Now scan back up and take note of the Controls Id value which the Advanced Find button sits under:

image

Ok, so how did I know to do a Find for:   "<Group Id="Mscrm.HomepageGrid.{!EntityLogicalName}.MainTab."

Easy:

  • I want my button to appear on the grid ribbon, this is referred to as “HomepageGrid”
  • I’m wanting to make a global change, that’s why I opened the applicationribbon.xml rather than a specific entity’s ribbon xml, so I need to look for a global ribbon definition, these are defined using the {!EntityLogicalName} parameter.
  • And I’m wanting my button added to the main tab, the one that takes on the entity name
  • Therefore I am looking for a Tab with a name that starts with “Mscrm.HomepageGrid.{!EntityLogicalName}
  • If you scan through the Tabs that follow this naming convention you’ll see it’s pretty obvious the one we want is called MainTab. 
  • Stringing those bits altogether gives you:  Mscrm.HomepageGrid.{!EntityLogicalName}.MainTab and sure enough under there I see all the various groups and buttons that match what I see on the UI.

Step 9 – Close applicationribbon.xml and return your focus to your exported customization.xml file open in Visual Studio. 

 

Step 10 – Replace “<CustomActions />”  with the XML below.

<CustomActions> 
  <CustomAction Id="Sample.{!EntityLogicalName}.MainTab.LaunchURL.CustomAction" 
                Location="Mscrm.HomepageGrid.{!EntityLogicalName}.MainTab.ExportData.Controls._children" 
                Sequence="71"> 
    <CommandUIDefinition> 
      <Button Id="Sample.{!EntityLogicalName}.MainTab.LaunchURL.Button" 
              Command="Sample.all.MainTab.LaunchURL.Command" 
              LabelText="Launch URL" 
              ToolTipTitle="Launch URL" 
              ToolTipDescription="Click to launch external URL" 
              TemplateAlias="o3" 
              Image16by16="$webresource:new_star16x16" 
              Image32by32="$webresource:new_star32x32" /> 
    </CommandUIDefinition> 
  </CustomAction> 
</CustomActions>

Note:

  • The Location specified is the Controls Id we determined earlier
  • The TemplateAlias matches that specified for the Advanced Find button (this ensures the button will be sized and positioned how I want it)
  • The Sequence is 1 higher than that specified for the Advanced Find button (this places my button just after the Advanced Find button)
  • The button label will be “Launch URL”
  • The button icons will be sourced from webresources called “new_star16x16” and “new_star32x32” (you’ll need to upload these webresources, I won’t cover that here, change the XML to match your webresources names or remove the mention of the Icons – the specification of button icons is optional)
  • When clicked the button will perform the action defined by

    "Sample.all.MainTab.LaunchURL.Command"  (we will add this content in our next step)

     

Step 11 – Replace “<CommandDefinitions />” with the XML below:

<CommandDefinitions> 
  <CommandDefinition Id="Sample.all.MainTab.LaunchURL.Command"> 
    <EnableRules /> 
    <DisplayRules /> 
    <Actions> 
      <Url Address ="http://gtcrm.wordpress.com/" />                
    </Actions> 
  </CommandDefinition> 
</CommandDefinitions>

Note:

 

Step 12 – Save you changes, exit Visual Studio, select the 3 unzipped solution files and zip them up

  • I like to follow the naming convention and version numbering that CRM used at export, and I achieve this via WinZip’s context menu, I just modify the filename afterwards to increment the version number
  • Make sure the structure of your zip file matches the format CRM exports solutions in – i.e. no additional folder layers

 

Step 13 - Import the Solution, Publish, refresh your browser

image

 

Done.  Smile 

You should now see a new button beside your Advanced Find labelled “Launch URL” with a Star icon, and when clicked a browser window should pop and my blog should display.

image

 

One caveat; this button will appear only sometimes on the Ribbon.  Because the ribbon is contextual there are actually several ribbons you need to customise if you want your button always visible.  i.e. the button will appear when your focus is on a main CRM data entity like Account or Contact but not when you are on something like Dashboards or Solutions.  You may find it appears enough of the time that this single customisation, or this plus customising the Dashboard ribbon is sufficient.

11 thoughts on “Adding a Button to the Main CRM Ribbon in 2011

  1. Steve

    Thanks Gareth, this was useful. Can I launch an external application instead of a URL? (For CRM on-premise or online)

    Reply
  2. Steve

    Great, thanks!
    JScript code in case it’s of some use to someone else:

    function runme() {
    var objShell = new ActiveXObject(“WScript.Shell”);
    var szCmd = “C:\\Windows\\System32\\Notepad.exe”;
    // Or, if you want a command shell to launch your app, use: var szCmd = “%COMSPEC% /k C:\\Windows\\System32\\Notepad.exe”;
    alert(szCmd);
    objShell.Run(szCmd);
    objShell.Quit;
    }

    Reply
  3. Pingback: CRM 2011: Add Custom Ribbon Button on (Application Ribbon) Advanced Find « sliong

  4. Clint

    Thanks for all this Garett. Do you think you could post an example of having that button I added to the ribbon open a particular saved view? If I have it open the page of the URL I get when manually opening the saved view, it opens advanced query, but uses the default view.

    thanks again!
    clint

    Reply
  5. Pingback: Adding Activate Buttons to Microsoft CRM Activity Ribbons | Roman's Blog

  6. Sonika

    I am facing one issue. using my solution I am able to add button. But When I delete my solution it is not getting removed.

    What should I do that.

    Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s