Creating a Result Block that Shows Office Graph Suggestions, Part 1

Elio Struyf

by Elio Struyf on 3/3/2015

Share this:

Article Details

Date Revised:

Applies to:
Display Template, Elio Struyf, Office Graph, search center, search results, SharePoint

There are already various blog posts that show the power and value of Office Graph and Delve for your organization, but not everyone will go to the Delve page to find their results. More users probably use the SharePoint search center to find their documents. I wanted to bring these two search experiences closer together by integrating Office Graph results (Figure 1) via a result block into the SharePoint search center. From the moment a user searches for something, my solution automatically queries Office Graph to retrieve the top three results (depending on the settings of the result block).

  A result block from Office Graph.

Figure 1: Office Graph result block

In this article I’ll explain how you can achieve this on your Office 365 environment.

What is required to create a result block?

If you have ever set up a result block in your search center, you know that it all comes down to specifying a new query rule in which you configure a query or result source from which you want to retrieve the results. It is not different when you want to retrieve results from Office Graph.

Now there is one major problem—you cannot retrieve results from Office Graph directly using search keywords. When you want to retrieve results from Office Graph, you must pass the GraphQuery property. You cannot use the query builder to add this GraphQuery.

Together with Mikael Svenson, we tried to create a new result source for Office Graph via XML, PowerShell, etc…, but in the end nothing worked; the result source we tried to create does not seem to take the GraphQuery property into account.

Important: There is also a Local SharePoint Graph result source available. This result source is not available in the result sources list, but it will show up in the query builder. Unfortunately, you cannot use the result source because it always returns errors when trying to retrieve search results.

So what do you do when you cannot do a direct call to Office Graph via a query or result source? You find another solution to solve it.

I created a display template that includes some JavaScript code that will do REST calls to retrieve results from Office Graph. You can download the display template from GitHub together with two additional display templates used for rendering of your Office Graph results and the hover panel. You can use this link to download the Office Graph Result Block Templates from GitHub.

Important: Update the script references in the OfficeGraph_Results.html and item_OfficeGraph_Results.html files first, then upload these files to the master page gallery on your site. Search for the text, "Check if the location is the same in your environment" and change the reference underneath it. I placed these templates in a folder named OfficeGraph in the master page gallery.

This approach requires some configuration on your site, which I will explain in the next section.

Query rule and result block configuration

Setting up a result block all starts by creating a new query rule for a specific context (Figure 2). Your search center will, by default, use the Local SharePoint Results result source, so this will also be the result source to use for adding the Office Graph result block.

  In site collection administration you'll manage query rules.

Figure 2: Manage query rules

Let’s create a new query rule and then define when to add the result block by specifying query conditions (Figure 3). In this setup the result block should always be visible so the default query condition, “Query Matches Keyword Exactly” set by SharePoint should be removed. Once removed, SharePoint notifies you that the query rule will get triggered on each search query.

  Add a new query rule to site collection administration.

Figure 3: Creating a new query rule

Note: Currently the query rule is created for the Local SharePoint Results result source. If you want your query rule to get triggered for additional result sources (for example, if you have a result source setup for specific content in your tenant), you can specify additional result sources in the Context section. You can even allow your custom query rule to get triggered on all the result sources.

In the Actions section you can choose to add promoted results or a result block. Click Add Result Block and in the dialog box that opens you can configure the query. Figure 4 shows how to configure the result block.

  Add a result block that Office Graph will use.

Figure 4: Result block configuration

  • Title: Change the title to something like Office Graph suggestions for "{subjectTerms}".
  • Configure Query: I changed it to a * query. You need to be sure that you always retrieve results because the real results are coming from Office Graph.
  • Items: Set the number of items you want to return from the Office Graph results.
  • Block display order: Set the block to always show above the core results.
  • Item Display Template: Set the Item display template to Office Graph Results, which I earlier suggested that you download. You can find this display template here: Office Graph Result Block Templates.

Once you configure the result block, store your query rule and it will redirect you to the list of query rules (Figure 5) where your new query rule will be available.

  You can use the query rule you created called Office Graph suggestions in search center.

Figure 5: Office Graph suggestions query rule

Office Graph result block

Once you have created the query rule, you can go to your search center and do a search query. If everything is configured correctly, you should get a result that is similar to Figure 6.

  SharePoint search center showing Office Graph results in a block above the standard search results.

Figure 6: Office Graph suggestions

If you move your mouse pointer to hover over a results item from the Office Graph suggestions, the hover panel will show the Delve-like result (Figure 7).

  Use your mouse pointer to hover over a result and you'll see a hover panel present a Delve-like board.

Figure 7: Office Graph result with hover panel

You can refine the results (Figure 8 shows PDFs by Alex Darrow), which will also refine the Office Graph results.

  You can refine the results returned from Office Graph.

Figure 8: Office Graph result refinement

Part 2: technical implementation

In part two of this article I will explain in more detail how I created these templates and how they work together.

Topic: Enterprise Search

Sign in with

Or register