Walkthrough 2: Display an external webpage in your agent application

 

Applies To: Dynamics 365 (online), Dynamics 365 (on-premises), Dynamics CRM 2013, Dynamics CRM 2015, Dynamics CRM 2016

This walkthrough demonstrates how to display a webpage or external URL in your agent application. In this walkthrough, you’ll learn how to display the Unified Service Desk Administration Guide, which is available online at http://technet.microsoft.com/library/dn499779.aspx, in the client application.

Prerequisites

In This Walkthrough

Step 1: Create a hosted control to display the webpage

Step 2: Create a toolbar container type of hosted control

Step 3: Add a toolbar and attach it to the toolbar container

Step 4: Add a toolbar button and action calls to display the webpage

Step 5: Add the controls to the configuration

Step 6: Test the application

Conclusion

Step 1: Create a hosted control to display the webpage

In this step, you’ll create a hosted control of Standard Web Application type to display the webpage.

  1. Sign in to Microsoft Dynamics 365.

  2. Go to Settings > Unified Service Desk.

  3. Click Hosted Controls.

  4. Click New.

  5. On the New Hosted Control page, specify the following values:

    Field

    Value

    Name

    Contoso Help

    Display Name

    Contoso Help

    USD Component Type

    Standard Web Application

    Allow Multiple Pages

    No

    Hosting Type

    Internal WPF

    Application is Global

    Checked

    Display Group

    MainPanel

    Standard Web Application hosted control

  6. Click Save.

Step 2: Create a toolbar container type of hosted control

Toolbar Container hosted controls are used to hold and display the toolbars in Unified Service Desk. In this section, you’ll create a Toolbar Container type of hosted control that appears in the toolbar region of the client application.

  1. Sign in to Microsoft Dynamics 365.

  2. Go to Settings > Unified Service Desk.

  3. Click Hosted Controls.

  4. Click New.

  5. On the New Hosted Control page, specify the following values:

    Field

    Value

    Name

    Contoso About Toolbar Container

    USD Component Type

    Toolbar Container

    Display Group

    AboutPanel

    Toolbar Container hosted control

  6. Click Save.

Step 3: Add a toolbar and attach it to the toolbar container

In this step, you’ll create a toolbar, and attach the toolbar to the toolbar container hosted control created in step 2. This is done to display the toolbar in your agent application.

  1. Sign in to Microsoft Dynamics 365.

  2. Go to Settings > Unified Service Desk.

  3. Click Toolbars.

  4. Click New.

  5. On the New Toolbar page, type Contoso About Toolbar in the Name box, and then click Save.

  6. Attach the toolbar to the toolbar container hosted control created in step 2. On the nav bar, click the down arrow next to Contoso About Toolbar, and click Hosted Controls.

  7. On the next page, click Add Existing Hosted Control, type Contoso About Toolbar Container in the search bar, and then press ENTER or click the search icon.

  8. From the search results, select Contoso About Toolbar Container.

  9. Click Save.

Step 4: Add a toolbar button and action calls to display the webpage

In this step, add a button on the toolbar and attach an action call to the button so that when the button is clicked, the specified webpage is displayed in the hosted control that you created in step 1.

  1. After you save the toolbar in step 3, the Buttons area becomes available. In the Buttons area, click + on the right corner to add a button.

  2. On the New Toolbar Button page, specify the following values.

    Field

    Value

    Name

    Contoso Show Help

    Button Text

    Show Help

    Create a new toolbar button

  3. Click Save to save the record, and enable the Actions area.

  4. Add two action calls to specify the URL of the webpage to navigate to for the hosted control that you created in step 1. Additionally, create another action call to on the Contoso Global Manager hosted control to display the hosted control created in step 1 in the agent application.

    In the Actions area, click + on the right corner to add an action call.

  5. In the search box in the Actions area, press ENTER or click the search icon.

  6. In the search results box, click New in the lower right corner to create an action call for this toolbar button.

    Choose New to create an action call

  7. On the New Action Call page, specify the following values:

    Field

    Value

    Name

    Contoso Action Call: Display Help

    Order

    1

    Hosted Control

    Contoso Help

    Action

    Navigate

    Data

    url=https://technet.microsoft.com/library/dn499779.aspx

    Create an action call in Unified Service Desk

  8. Click Save. The new action call is added to the Contoso Show Help button.

  9. Add another action call to the button to set the focus on the hosted control that displays the webpage in the client application. In the Actions area, click + in the right corner to add an action call.

  10. In the search results box, click New in the lower right corner to create an action call for this toolbar button.

  11. On the New Action Call page, specify the following values.

    Field

    Value

    Name

    Contoso Action Call: Display Help Hosted Control

    Order

    2

    Hosted Control

    Contoso Global Manager

    Action

    ShowTab

    Data

    Contoso Help

    Create an action call in Unified Service Desk

  12. Click Save. The new action call gets added to the Contoso Show Help button. You can see both action calls added to the toolbar button.

    Action calls added to the toolbar button

Step 5: Add the controls to the configuration

In this step, add the action calls, hosted controls, and toolbar that you created in this walkthrough to Contoso Configuration to display these controls to the user who is assigned to the configuration. Contoso Configuration was created in Walkthrough 1: Build a simple agent application.

Add the following to Contoso Configuration.

Control name

Control type

Contoso Action Call: Display Help

Action Call

Contoso Action Call: Display Help Hosted Control

Action Call

Contoso Help

Hosted Control

Contoso About Toolbar Container

Hosted Control

Contoso About Toolbar

Toolbar

To add a control to the configuration:

  1. Sign in to Microsoft Dynamics 365.

  2. On the nav bar, click Microsoft Dynamics 365, and then select Settings.

  3. Go to Settings > Unified Service Desk.

  4. Click Configuration.

  5. Click Contoso Configuration to open the definition.

  6. On the nav bar, click the down arrow next to Contoso Configuration, and select Action Calls.

  7. On the next page, click Add Existing Action Call, type “Contoso Action Call” in the search bar, and then press ENTER or click the search icon.

  8. Both action calls are displayed in the search results. Add both of them.

  9. Similarly, add both of the hosted controls and the toolbar by clicking the down arrow next to Contoso Configuration, and clicking Hosted Controls and Toolbars respectively.

  10. Click Save.

Step 6: Test the application

Start the Unified Service Desk client application, and sign in to the Dynamics 365 instance where you configured Unified Service Desk using the same user credentials that you assigned to the Contoso Configuration in Walkthrough 1: Build a simple agent application. For information about connecting to a Dynamics 365 instance using the Unified Service Desk client application, see TechNet: Connect to CRM instance using the Unified Service Desk client

Your agent application will now have a Show Help button at the top-right corner:

Show Help button in Unified Service Desk

Clicking Show Help displays the specified web URL within the Unified Service Desk application.

Help displayed in the client application

Conclusion

In this walkthrough, you learned how to display a webpage in Unified Service Desk client application. You also learned how to filter access to Unified Service Desk controls using configuration.

See Also

Walkthrough 1: Build a simple agent application
Walkthrough 3: Display Microsoft Dynamics 365 records in your agent application
Walkthrough 4: Display a Microsoft Dynamics 365 record in a session in your agent application
Walkthrough 5: Display enhanced session information by displaying session name and overview data
Walkthrough 6: Configure the Debugger hosted control in your agent application
Walkthrough 7: Configure agent scripting in your agent application
Walkthrough 8: Use Parature knowledge base within your agent application
Unified Service Desk configuration walkthroughs

Unified Service Desk 2.0

© 2017 Microsoft. All rights reserved. Copyright