How to Publish a Power BI Report and Embed It in a Website

This is a complete beginner-to-intermediate guide to sharing your Power BI dashboards with the world.

Introduction

You've built a beautiful Power BI report — data is clean, visuals are sharp, and the insights are clear. But right now it only lives on your laptop. Publishing is what takes your work from a local file to a live, shareable dashboard that anyone with a link (or a browser) can interact with.

In this article, you'll learn the full journey:

• What Power BI publishing actually means
• How to set up a Workspace
• How to upload and publish your .pbix file
• How to generate an embed code
• How to drop that embed into any website

By the end, you'll have a live, interactive Power BI report running inside a webpage — just like the big data teams do it.

What Is Power BI Publishing?

Power BI Desktop is where you build reports. Power BI Service (the cloud platform at app.powerbi.com) is where you share and manage them.

Publishing is the bridge between the two. When you publish from Desktop, your .pbix file is uploaded to the Power BI Service, where it becomes a live dataset and report that others can view, interact with, and embed.

Power BI Desktop (.pbix)
        ↓ Publish
Power BI Service (cloud)
        ↓ Embed code
Your Website / Blog / App

Power BI Service also handles scheduled data refresh, row-level security, collaboration through Workspaces, and embedding into external platforms — all without writing backend code.

Prerequisites

Before you start, make sure you have:

• Power BI Desktop installed (free download)
• A Microsoft account (work, school, or personal with Power BI sign-up)
• A completed .pbix report ready to publish
• For public embed: A Power BI Pro or Premium Per User (PPU) license (required for workspace publishing)

Note on Licensing: The free Power BI license lets you build and publish to My Workspace. To publish to a shared workspace or embed publicly, you need Power BI Pro (≈$10/month).

Step 1: Create a Workspace

A Workspace in Power BI Service is like a shared project folder — it holds your reports, datasets, and dashboards, and can be shared with teammates.

How to Create One

1. Go to app.powerbi.com and sign in.
2. In the left sidebar, click "Workspaces".
3. Click "+ New workspace" at the bottom of the panel.
4. Fill in the workspace Name (e.g., Electronics Sales Dashboard) and optional Description.
5. Expand Advanced to set a contact list — people listed here receive notifications about workspace activity.

Fig 1: The Advanced settings panel during workspace creation — the Contact list field

1. Click Apply. Your workspace now appears in the left sidebar.

Tip: Pin frequently used workspaces to the top of the list by hovering over the workspace name and clicking the pin icon.

Fig 2: Pinning a workspace for faster daily access

Step 2: Upload and Publish Your Report

There are two ways to publish — directly from Power BI Desktop (recommended), or by uploading the .pbix via the browser.

Method A: Publish from Power BI Desktop (Recommended)

1. Open your .pbix file in Power BI Desktop.
2. Go to the Home tab in the ribbon.
3. Click the "Publish" button on the right side of the ribbon.

Fig 3: The Publish button in the Power BI Desktop Home ribbon

1. Sign in with your Microsoft account if prompted.
2. A "Select a destination" dialog appears. Choose the workspace you just created — you can search by name.

Fig 4: Choosing your target workspace in the Publish to Power BI dialog

1. Click Select. Power BI Desktop uploads your file to the cloud.
2. A success dialog appears with a direct link to your live report.

Fig 5: Publish success — click the link to verify your live report in the browser

1. Click the link to open and verify your report in the browser.

Method B: Upload via Browser

If you prefer not to open Desktop:

1. Navigate to your workspace in Power BI Service.
2. Click "+ New" → "Upload a file" → "Local file".
3. Select your .pbix file. Power BI automatically creates both a dataset and a report.

Step 3: Generate the Embed Code

With your report live in Power BI Service, you can now generate an embed code to place it on any website.

Important: "Publish to web" creates a public link — no login required to view it. Never use this for sensitive or confidential data.

Steps

1. Open your published report in Power BI Service.
2. Click "File" in the top menu → "Embed report" → "Publish to web (public)".

Fig 6: Accessing "Publish to web" from the File menu in Power BI Service

1. A dialog appears reviewing what "Publish to web" means. Click "Create embed code".

Fig 7: The embed code creation prompt

1. A warning appears confirming the report will be publicly accessible. Click "Publish" to confirm.

Fig 8: Public sharing confirmation — only proceed if your data is safe to share publicly

1. The Success dialog appears. You'll see:
   • A shareable link to send directly to anyone
   • An HTML embed snippet (<iframe> tag) to paste into your website
   • Options to set the Size and Default page of the embedded view

Fig 9: The embed code dialog — copy either the link or the full iframe HTML

1. Copy the <iframe> code. It looks like this:

<iframe 
  title="Electronics Sales Dashboard" 
  width="1140" 
  height="541.25" 
  src="https://app.powerbi.com/reportEmbed?reportId=XXXX&autoAuth=true&ctid=XXXX" 
  frameborder="0" 
  allowFullScreen="true">
</iframe>

You can manually adjust the width and height values. Adding 56px to the height accounts for Power BI's bottom navigation bar and prevents cut-off.

Fig 10: The raw iframe embed code — width and height are fully customizable

Step 4: Embed the Report on a Website

You now have an <iframe> snippet. Here's how to use it across different platforms.

Option A: Plain HTML Website

Paste the iframe directly into your HTML file:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My Sales Dashboard</title>
  <style>
    .report-container {
      width: 100%;
      max-width: 1140px;
      margin: 0 auto;
      padding: 20px;
    }
    iframe {
      width: 100%;
      height: 541px;
      border: none;
      border-radius: 8px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
  </style>
</head>
<body>
  <div class="report-container">
    <h2>Electronics Sales Report</h2>
    <iframe 
      title="Electronics Sales Dashboard" 
      src="https://app.powerbi.com/reportEmbed?reportId=YOUR_ID&autoAuth=true&ctid=YOUR_CTID" 
      allowFullScreen="true">
    </iframe>
  </div>
</body>
</html>

Option B: WordPress

1. Open the WordPress block editor.
2. Add a Custom HTML block.
3. Paste your <iframe> code and preview before publishing.

Option C: Dev.to

Dev.to supports raw HTML in its editor — paste the <iframe> code directly into the article body and it will render. Medium does not support iframes natively; use the shareable link instead, or link to your hosted HTML page.

Making the Embed Responsive

The default iframe has a fixed width. For mobile-friendly layouts, use this CSS wrapper:

.pbi-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
}

.pbi-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

<div class="pbi-container">
  <iframe 
    src="https://app.powerbi.com/reportEmbed?reportId=YOUR_ID&autoAuth=true"
    allowFullScreen="true">
  </iframe>
</div>

Recommended iframe sizes for common aspect ratios:

Ratio	Size	Dimensions (W × H)
16:9	Small	640 × 416 px
16:9	Medium	800 × 506 px
16:9	Large	960 × 596 px
4:3	Small	640 × 536 px
4:3	Medium	800 × 656 px

Managing Your Embed Codes

Power BI tracks all your active embed codes. To view or revoke them:

1. Click the Settings gear icon in Power BI Service → "Manage embed codes".

Fig 11: Accessing embed code management from the Settings menu

1. You'll see all active embed codes for reports in that workspace. You can retrieve (copy) or delete any code.
2. Deleting a code instantly breaks the embed on any website using it — useful if you need to revoke public access quickly.

Key Insights and Takeaways

1. Power BI Desktop ≠ Power BI Service
Desktop is your local editor; Service is your cloud publisher. Publishing syncs your work to the cloud — it doesn't auto-update. Re-publish from Desktop whenever you make changes.

2. Workspaces are your project folders
Use separate workspaces for different projects or clients. The default "My Workspace" is personal and cannot be shared — use a new workspace for any collaboration or embedding.

3. "Publish to web" = fully public
There's no login wall on public embeds. Never publish sensitive financials, personal data, or confidential information this way. For private sharing, use Power BI's App feature or Secure Embed (requires Pro license).

4. Dataset and report are separate objects
When you publish a .pbix, Power BI creates two items: a dataset (your data model) and a report (your visuals). This matters when refreshing data or building multiple reports from the same dataset.

5. Data refresh requires a gateway for local sources
If your data lives in local Excel files or databases, you'll need a Power BI Gateway for scheduled refresh. Cloud sources (SharePoint, Azure, web APIs) refresh directly without a gateway.

6. The embed URL is customizable
Append parameters to control the embed experience:

?filter=Table/Column eq 'Value'     → pre-filter to a specific value
&pageName=ReportSection123          → open a specific report page
&navContentPaneEnabled=false        → hide the page navigation pane

Quick Reference Checklist

[ ] Report built and saved as .pbix in Power BI Desktop
[ ] Signed in to Power BI Service (app.powerbi.com)
[ ] Workspace created for the project
[ ] Report published from Desktop (Home → Publish)
[ ] Report visible and verified in workspace
[ ] Embed code generated (File → Embed → Publish to web)
[ ] iframe copied and pasted into website/blog
[ ] Embed tested and rendering correctly
[ ] .pbix uploaded to GitHub repository
[ ] Article published on Dev.to / Medium / personal blog
[ ] GitHub link sent to [e-mail]
[ ] Article link sent to [e-mail]

Conclusion

Publishing a Power BI report and embedding it into a website is one of the most impactful skills you can add to your data toolkit. It transforms a static analysis into a live, interactive experience that non-technical stakeholders can explore on their own — no Power BI license, no downloads, no fuss.

The workflow is simple once you've done it once:
Build in Desktop → Publish to Service → Generate embed code → Paste into your site.

As you grow in Power BI, explore row-level security, scheduled refresh, and the Power BI REST API for programmatic embedding — but the fundamentals you've just learned will carry you through most real-world scenarios.

If you found this helpful, follow me for more data science content covering Power BI, Excel, SQL, and hands-on projects from the African data science community.