DEV Community

Cover image for Practical Implementation of Power BI Report Embedding in Modern Website(Step-by-Step Guide)
Gabriel Njoroge
Gabriel Njoroge

Posted on

Practical Implementation of Power BI Report Embedding in Modern Website(Step-by-Step Guide)

Last Week at LuxdevHQ we dealt with Power BI Concepts like Data Modelling, Power BI Queries, Joins, Charts, Dashboards, and reporting. These processes lead to a proper data analysis. Besides that, there is need to publish the reports online. The importance of publishing reports online cannot be underestimated
in the digital landscape we are in. It is advantageous and of immense value to orgazisations and business that want to thrive in the digital space.
The Importance of Publishing Power Bi Reports Online

  • It eases team work as people can view reports from anywhere
  • The reports can be accessed from any device
  • Data Access is real time
  • It enhances collaboration as multiple users can share insights.

Thus I saw the need to come up with a Step by Step guide to publishing Power BI Reports and Embedding it in a Website

Steps
Log in to your Power BI Account. It should show your credentials on the top right corner of you screen as follows:

Log in Power BI Crdentials

Open a New tab on your Preferred Browser(Google chrome) and type Power BI Service. Sign in with your Power BI Credentials and it will lead you to a Landing page as follows.

Power BI Service Landing Page

Click on Workspaces, Add a new workspace and fill in your name in the form below:

Workspace form to fill in name

Upload your Assignment/Project and Click Apply.

Go Back to Power BI on the Project you working on and Click
on Publish as highlighted by the pointer:

Publish

Go back to Power BI Service, Select on Workspaces and Click on your project/assignment. It should lead to a window as shown below

Select on Project/Assignment working on

Click on File, Publish to Web. Then Once again Click on File, Embed Report, Website/Portal. It shall guide you to a dialog box where you copy the part named "HTML to paste on a website" as shown below

Copy Iframe Code

Create a folder in your machine, Open folder in your preferred
text editor(VS Code),create file and give it a name e.g(Index.html)

Paste code(Iframe) on the file as shown below

It contains file and iframe code

Save your job, Go back to the folder that contains the file we
created(Index.html) and open.It will open in your Web browser and you will have successfully
Published your Power BI Report and Embedded it on a Website as shown:

Report Published Online successfully

Top comments (0)