Adding HELP buttons to Power BI reports

[benhoward00]

We all want our Power BI reports to be useful and inciteful, but I often see reports where the meaning of the data isn't obvious, or the process for using the report isn't straighforward.  This isn't always the fault of the report designer, often we're restricted by working on an existing report or with data sets whose definitions we're not able to change.  In these instances you might want to think of ways to provide general "how to" help features for end users and "specific" help regarding individual visualizations or data items.  In this article I discuss three ways to add help features to your Power BI report using images and bookmarks, and for good measure, I also link to relevant youtube videos that show you the features in action.

1.  Adding a HELP button to your report page.  

For this you need a couple of buttons, the first image is the main help button, and the second image is the same button but I changed the opacity slightly to signify that the button has been selected or pressed     .  The idea is that once the main button is pressed, this will "light up" help buttons for all of the other visuals.

1.1.  Add the main help button 

This won't trouble many users; once you've got your help button add it to the relevanant area on your report.  I've chosen to add it to the top of page, and I've also enabled the shadow feature so that it matches the rest of the visuals on the page.   Ideally at this stage you want to name the image, I'll typically choose something along the lines of "Main_hlp_btn"

1.2.  Add the "pressed" help button

Add the second help button to the report, making sure it is exactly the same position as the 1st button, and that it is exactly the same size.  This second button should sit exactly over the 1st button, but in this case I do not enable the shadow option.  Again, it's worth renaming this image, to something like "Main_hlp_pressed_btn"

1.3.  Create two bookmarks

Our next job is to create two bookmarks, one for when the help button is selected called "Main help selected" (this bookmark hides the non-pressed button), and one for when it it is not "No help selected" (it hides the pressed button) .  There isn't room in this blog to give an indepth tutorial on Bookmarks, instead I'll direct to Microsoft docs for further help. 

The screen shots below show the two bookmarks as they should exist at this phase of the process.

1.4.  Wire up the Actions from the two buttons to the relevant bookmark

With the bookmarks now created, it is time to wire up each of the bottons to the relevant bookmark, so that when I click on the Help button, I display the bookmark called Main help selected, as per the screen shot below.  At this stage you can also use the Action Tooltip, which pops up when you hover over the button.  

Conversly, set the "pressed" button to reference the other bookmark; I'll typically leave the Action Tooltip blank in this instance.

1.5 Add in the remaining help icons.  

Add the help button onto the visuals that you want to provide help to.  I always use the same buttons, becuase visual consistency is really important.  Once you've added them then update the bookmarks to either display or hide them.   Hint, rename all the new buttons at this stage, something I haven't yet got around to in this screen shot!! 

For each help button, you also need the corresponding "pressed" help button.

A YouTube video taking you through the Part 1 (above) is available here or below.

2. Adding simple help for individual visualisations

So now that the main page is wired up, we can concentrate on adding simple help for some of our visualisations.  When I think of "simple help", I'm typically thinking of of a paragraph of text, and so to display this, I'll use the text box.  

2.1  Add the text box to the report

Add the text box to the report, enter the text and size it appropriately and place it next to the relevant visual.  In my example I've just used some dummy text by way of example.

2.2 Create a bookmark to view this text and wire it up to the correct help button

This is a bit of a repeat of some of the first set of steps, but it goes like this.
2.2.1 Create a new bookmark, which displays the text box and the pressed help button; I called this bookmark BarChartHelpSelected.
2.2.2 Wire up this new bookmark to the action for pressing the help button on the bar chart.  Note that once again the Action Tooltip can be a great help here.  

2.2.3 Wire up the "pressed" help button so that it goes back to the "With Help" bookmark.

A YouTube video taking you through the Part 2 is available here or below.

3. Adding complex help

For any help which is more sophisticated than a simple text box, I tend to think of as "complex" help, and for this, I don't use bookmarks at all but rather page navigation.  The important trick here is to ensure that the visual you are providing help for is in exactly the same spot and is the same size on the new page.  Let's check this out.

3.1 Duplicate the existing page

The easiest way to ensure the correct sizing of the visual you want to provide help for is to duplicate the existing page, and then remove all of the other visuals.  Rename the page accordingly and hide it; hiding it isn't necessary, but I would recommend it otherwise the additional help pages just become a visual distraction.  In my case I am providing additional help to the Sales and Profit by Year, Quarter and Month visual, and I've renamed and hidden the page accordingly.

3.2 Create the relevant help information

It's now a simple case of adding in the relevant help information onto the page.  This could be additional text, images, annotations, links to videos, web pages, other visualisations etc.  The choice is limited by your imagination, but do try to be succint!

3.3 Add some way of getting back!

Now that you've navigated onto a new (hidden) page, you should provide a way for the user to get back to where they came from.  Again, consistency is needed here, so either use a button at the top of the page, again, linked up to either page navigation or a bookmark, or (my personal preference), use another "pressed help button" on the same visual.  This requires less navigation input from the user to get back.  

 

3.3 Wire up the Action for the help button 

Now it's just a question of wiring up the relevant help button to navigate to this page.

A YouTube video taking you through the Part 3 is available here or below.

4. Tidy Everything Up!

Finally tidy everything up!  What do I mean by that, well, it's likely that you've got a lot of bookmarks and images.  Make sure the images are named correctly, and find yourself a naming convention for buttons/images.  For example, my buttons all end with "_btn", my help pages with "_ help".  I also use the grouping function within the selection pane, it makes organising everything a lot easier. 

As a final peice of advice, try and create your report in the first instance so that it doesn't need any help added to it, but if you find your users need help (pilot feedback should tell you this) then add it in sympathetically and intuitively, and always follow the maxim, "less is more".

The published version of this report is available here.

Have fun,  Ben.