• DataZoe

Power BI Buttons - Page Navigation with Icons

I find buttons to have a variety of uses in Power BI! This button technique shows you how to add an icon based button for page navigation that makes it easy to change the icons later. This technique I used lately in my submission for the Power BI Challenge #9 with the left icon navigation panel. The panel itself is the design idea from numerro.io but this technique is a modification I implemented after seeing Haven Consulting's video on button animations.


Page navigation with icons

I've seen icons used in many reports, and they are usually added as Insert --> Images. You can then also attach an action to that image, like a button. The problem with this approach is when you want to change out that icon, you have to delete the old one and start all over. With buttons you can simply change the image in the fill section in a couple clicks and move on!


Another perk of this approach is that you can have it set to be 20% transparency for default state, then 0% transparency for hover state. So when your mouse moves over it, it has that visual darkening effect bringing the users attention to it.




Once you set it up with the transparency and where you want on the report, and the action (page navigation in this case), the icon can be changed out by simply clicking that X behind the image name and specifying a new image. All the other settings stay.


Page navigation can also simply go nowhere, so you can set the tooltip to specify that you are on the page, which I do by adding "(Here)" to the end.



This approach can be modified in many ways, such as changing the background behind a transparent image and choosing different images for the states. They are surprisingly customizable for a variety of scenarios!

103 views0 comments

Recent Posts

See All