• Skip to main content
  • Skip to header right navigation
  • Skip to site footer

My Online Training Hub

Learn Dashboards, Excel, Power BI, Power Query, Power Pivot

  • Courses
  • Pricing
    • Free Courses
    • Power BI Course
    • Excel Power Query Course
    • Power Pivot and DAX Course
    • Excel Dashboard Course
    • Excel PivotTable Course – Quick Start
    • Advanced Excel Formulas Course
    • Excel Expert Advanced Excel Training
    • Excel Tables Course
    • Excel, Word, Outlook
    • Financial Modelling Course
    • Excel PivotTable Course
    • Excel for Customer Service Professionals
    • Excel for Operations Management Course
    • Excel for Decision Making Under Uncertainty Course
    • Excel for Finance Course
    • Excel Analysis ToolPak Course
    • Multi-User Pricing
  • Resources
    • Free Downloads
    • Excel Functions Explained
    • Excel Formulas
    • Excel Add-ins
    • IF Function
      • Excel IF Statement Explained
      • Excel IF AND OR Functions
      • IF Formula Builder
    • Time & Dates in Excel
      • Excel Date & Time
      • Calculating Time in Excel
      • Excel Time Calculation Tricks
      • Excel Date and Time Formatting
    • Excel Keyboard Shortcuts
    • Excel Custom Number Format Guide
    • Pivot Tables Guide
    • VLOOKUP Guide
    • ALT Codes
    • Excel VBA & Macros
    • Excel User Forms
    • VBA String Functions
  • Members
    • Login
  • Blog
  • Excel Webinars
  • Excel Forum
    • Register as Forum Member

Embedding Excel Dashboards in a Web Page

You are here: Home / Excel Dashboard / Embedding Excel Dashboards in a Web Page
May 26, 2022 by Mynda Treacy

Embedding Excel dashboards in a web page is a great way to securely share reports. All you need to do is save your file on OneDrive or SharePoint and get the embed code. There are different approaches required depending on whether you have OneDrive Personal, or OneDrive for Business or SharePoint. The latter two offer more security and bigger file sizes.

Watch the Video

Subscribe YouTube

Embedding Excel Dashboards in a Web Page - Written Instructions

First, I recommend that you define a name for the cells containing the dashboard in your workbook as this will enable you to specify just that cell range to be displayed in the web page.

OneDrive for Business or SharePoint Process

Locate your file on OneDrive for Business or SharePoint and click the Share icon:

Embedding Excel Dashboards in a Web Page for files saved on OneDrive for Business

Next, click on the default setting (1) to customise the link. My default is ‘anyone with the link can view’ but yours might be different:

Setting permissions for embedding Excel Dashboards in a Web Page

IMPORTANT: If you’re embedding the workbook in a web page, then you’ll want to set the permissions to ‘Anyone with the link’ (2).

It’s possible that your SharePoint admin has blocked the option to allow anyone with the link to view the workbook. If so, you will need to consult your administrator.

TIP: If you want to prevent the workbook from being downloaded, check the ‘block download’ button in Other Settings (3).

Once you’ve chosen the settings, click Apply and then copy the link:

OneDrive for Business share link

It should look something like this:

https://yourdomain.sharepoint.com/:x:/g/personal/your_account_name/Ebb8wJNS4c9Ek7v2AE_BasEBSva-RhFqnL9pKJONWkFXYZ?e=auWtrP

Embed Code

To use this link in a web page you need to wrap it in iframe HTML tags like so:

<iframe src="https://yourDomain.sharepoint.com/:x:/g/personal/your_account_name/Ebb8wJNS4c9Ek7v2AE_BasEBSva-RhFqnL9pKJONWkFXYZ?e=auWtrP&action=embedview&wdbipreview=true "></iframe>

Iframe Size Parameters

We can add further parameters to the iframe that control how the dashboard is displayed in the web page.

For example, with the following additions you can specify the iframe size in pixels to suit your dashboard so there are no scroll bars:

<iframe width="500" height="200" frameborder="0" scrolling="no" src="https://yourDomain.sharepoint.com/:x:/g/personal/your_account_name/Ebb8wJNS4c9Ek7v2AE_BasEBSva-RhFqnL9pKJONWkFXYZ?e=auWtrP&action=embedview&wdbipreview=true "></iframe>

Dashboard Presentation Parameters

You can also control how the dashboard appears with the following parameters which get appended to the end of the URL with an ampersand:

URL Parameter Effect Default
wdHideSheetTabs=True Hides the sheet tabs that are displayed at the bottom of all sheets in a workbook. False
wdAllowInteractivity=True Lets you interact with the data if your workbook has a table or PivotTable that can be sorted and filtered. True
Item=itemName Displays a specific item. If your workbook includes a chart, table, PivotTable, or named range, and you want to display only one of the items in your web page, use the Item parameter to specify that item. Not set
ActiveCell=CellName Specifies the active (selected) cell in the embedded workbook when the web page opens. You can specify the active cell by cell reference (such as A1) or by name. You can also use this parameter to define the active sheet by selecting a cell in that sheet. If you don't specify the active cell, the last saved view will be shown. The last saved view will be shown.
wdHideGridlines=True Hides worksheet gridlines for a cleaner look. False
wdHideHeaders=True Hides the column and row headers. False
wdDownloadButton=True Includes the Download button so viewers can download their own copy of the workbook.
 

In my code (below) I’ve included the following:

  • Allowed interactivity so the Slicers work
  • Hidden the sheet tabs and headers
  • Specified the item name as the defined name: dashboard
  • Set the active cell to one at the bottom of the defined name area so it’s not displaying in the top left by default
  • I already have gridlines turned off in the Excel file page set up, so no need for this
  • I don’t want people to be able to download the file, so I’ve omitted this as well as set it in the sharing permissions

My final code looks like this:

<iframe width="500" height="200" frameborder="0" scrolling="no" src="https://yourDomain.sharepoint.com/:x:/g/personal/your_account_name/Ebb8wJNS4c9Ek7v2AE_BasEBSva-RhFqnL9pKJONWkFXYZ?e=auWtrP&action=embedview&wdbipreview=True&wdAllowInteractivity=True&wdHideSheetTabs=True
&Item=dashboard&wdHideHeaders=True&ActiveCell=A35"></iframe>

Excel Web App for OneDrive for Business or SharePoint

When you load the web page, you’ll see that the bottom of the embedded dashboard has a black bar called the viewer bar. The viewer bar contains some icons that will differ depending on whether your file is saved on OneDrive for Business/SharePoint or OneDrive Personal, as well as what sharing options you allowed:

Excel Web App Viewer Bar

In OneDrive for Business or SharePoint, with the settings I applied in this example, the viewer bar contains the following icons:

  1. The Excel icon on the far left opens Office.com.
  2. The next icon to the right enables the user to refresh the connection to the source file and get updates, although this didn't work for me! You can also refresh the web page to get updates.
  3. The last icon on the right enables you to give Microsoft feedback about the embedded spreadsheet, although when I click it for OneDrive for Business/SharePoint embedded files, nothing happens!

IMPORTANT: if you use incognito mode or Safari, you will not be able to see embedded workbooks saved on OneDrive for Business or SharePoint without logging in, so it’s best to avoid those options.

OneDrive Personal Process

The process for files saved on OneDrive Personal accounts is slightly different. Start by right-clicking the file in OneDrive, then select Embed:

embedding excel dashboards in the web with OneDrive Personal files

The embed pane will open on the right. Click the ‘customize how this embedded workbook will appear to others’ link at the bottom:

customizing embedding OneDrive Personal files

In the customize screen you can select what you want to show. In this example file I have:

  1. defined a name called Slicer_chart that I want to display
  2. I’ve deselected ‘include a download link (however, you’ll see that this is useless with the iframe code, but more on that later)
  3. And I’ve allowed people to sort and filter
  4. Set the starting cell to one that’s hidden behind the Slicer.

customizing embedding excel dashboards in the web with OneDrive Personal files

Note: at step 5 you can choose from an iframe embed code format, or JavaScript by clicking the links above the code snippet.

Once you’re happy with your settings, copy the code to your web page and adjust the height and width parameters as required.

Note: even though you may have selected no scrolling, you’ll find that the web app completely ignores this despite how big you make the dimensions, likewise for the area to display!

Excel Web App for OneDrive Personal

The icons in the Viewer Bar (the black bar at the bottom) are slightly different with OneDrive Personal files vs OneDrive for Business and SharePoint. They also differ depending on whether you used the Embed code or JavaScript.

OneDrive Personal Embed Code

We’ll look at the embed code experience and functionality first. You can see in the image below there are scroll bars even though I chose no scrolling. Also, the area visible when scrolling far exceeds cells in the specified defined name, so it appears there are some issues with the web app rendering the workbook correctly.

embedded excel dashboard in web page using iframe embed code

The viewer bar at the bottom also has some additional icons that differ to the OneDrive for business or SharePoint experience:

  1. Launches Excel Online but doesn’t open the workbook unless you are the owner, and you are logged in to your OneDrive account.
  2. Refreshes the connection to the workbook.
  3. Is a link to give Microsoft feedback about the web app.
  4. Enables you to get the URL to the workbook which will open it in Excel Online. You can also get the embed code here.
  5. Opens the file in Excel Online where you can download a copy of the file and then edit it as you wish.

OneDrive Personal JavaScript

The JavaScript code offers more protection with the viewer bar not including any way for the user to open the file in Excel Online (unless you’re the file owner) or download it:

embedded excel dashboard in web page using javascript embed code

  1. Launches Excel Online but doesn’t open the workbook unless you are the owner, and you are logged in to your OneDrive account.
  2. Link to give Microsoft feedback about the web app.
  3. Is supposed to give you the URL to the workbook which will open it in Excel Online and the embed code, but the link does nothing when clicked!

Notice that there’s no Refresh button, but if you refresh the browser page it gets the updated version of the file from OneDrive.

Embedding Excel Dashboards in a Web Page Limitations

With OneDrive for Business or SharePoint you can embed a file up to 10MB in size with up to 1000 concurrent viewers.

Heavy traffic on the embedded workbook might result in some viewers being throttled. And the availability of an embedded workbook can be impacted by the number of embedded workbooks in the data center or tenant.

With OneDrive Personal the limit is 5MB. I couldn’t find any documentation on the number of concurrent viewers, but I suspect it won’t be more than 1000, and could be less.

OneDrive Personal embedded workbooks using the Embed code are not secure, however OneDrive Personal embedded workbooks using the JavaScript are secure.

Below is a summary table of the differences:

embedded excel dashboard in web page limitations

More Excel Dashboard Posts

excel project management dashboard custom periods

Project Management Dashboard Dynamic Periods

Revolutionize Your Project Management with this Excel Dashboard. Use buttons to switch between viewing the progress by day, week and month.
excel infographic tools

Excel Infographic Tools

Excel infographic tools are many and varied. In this tutorial I take you through step by step building an Excel infographic.
ai dashboard design

AI Dashboard Design

AI dashboard design can give you some great ideas for design and color combinations, but it’s not smart enough to create useful reports…yet!
dark theme dashboards

Dark Themed Excel Dashboards

Dark Themed Excel Dashboards enable you to use formatting techniques that make your data pop and get your audience's attention.
excel dashboards custom backgrounds

Custom Excel Dashboard Backgrounds

Custom Excel Dashboard Backgrounds bring a level of polish and professionalism to reports and they’re super easy to create using PowerPoint
excel student performance dashboard

Excel Student Performance Dashboard

How to build an Excel student performance dashboard from scratch. Download the completed Excel file for reference.
5 Pro excel dashboard design tips

5 Pro Excel Dashboard Design Tips

Excel Dashboard Design Tips you can use in both Excel and Power BI to ensure your reports and quick and easy to read.
excel interactive personal finance dashboard

Interactive Personal Finance Dashboard

Excel Interactive Personal Finance Dashboard to help you visualise and keep track of and manage where you’re spending your money.

Non-financial Excel Dashboards

Step by step how to build Excel Dashboards with non-financial data. Uses Power Query and Power Pivot to visualise NASA data.

Secrets to Building Excel Dashboards in Under 15 Minutes

Learn how to build interactive, clean and focussed dashboards that communicate the important information you want readers to know.


Category: Excel Dashboard
Previous Post:conditional formatting tables and matrices in power biConditional Formatting in Power BI Tables and Matrices
Next Post:Custom Tooltips in Power BIcustom tooltips in power bi

Reader Interactions

Comments

  1. Issac Lee

    April 9, 2023 at 12:46 pm

    Hi!

    Thank you for your help in writing this great article and video! It really helps me a great deal!

    I have followed your instructions and managed to embed the javascript on my wix website. It is working well on all devices except on iPads.

    Can I know why there are not showing up on iPads? The viewer bar can be seen but not the embedded excel.

    Thank you for replying to my question as I have searched through the internet for hours and have not found a solution.
    Appreciate your kind reply! Thank you!

    Reply
    • Mynda Treacy

      April 10, 2023 at 4:39 pm

      From memory, Issac, the Excel web app doesn’t work on an iPad. You’d have to allow your users to open the file in Excel Online if they need to use iPads. i.e. you can’t embed it in a web page.

      Reply
      • Issachar Lee

        April 11, 2023 at 11:50 pm

        Thanks for the prompt reply!

        When it’s embedded using HTML, it will show on iPad. However, it does not show up when it’s embedded using JavaScript.

        I choose JavaScript as I do not wish for the excel to be accessed offline or downloaded.

        Hopefully there’s a solution!

        Thank you for your great tutorial tor educate me on this!

        Reply
        • Mynda Treacy

          April 13, 2023 at 9:00 am

          I don’t know of a solution for JavaScript embedding on the iPad, sorry.

          Reply
          • Issac Lee

            April 19, 2023 at 12:30 am

            It’s ok. Thank you so much for your help and guidance!

  2. Joshua Allmen

    March 16, 2023 at 9:44 am

    I got my Java code to work embedding an Excel file in a web page from a personal OneDrive.
    The Excel file interactivity is amazing.
    However, if I use the web browsers print function, the Excel window shows up blank.

    Is there some setting / html code in order to get the embedded Excel window to print?

    Reply
    • Philip Treacy

      March 16, 2023 at 10:13 am

      Hi Joshua,

      It’s probably because the Excel workbook is loaded in an iframe and as such isn’t actually part of the web page you are asking the browser to print. An iframe loads one web page inside another, the browser seems to only print the top level web page, not the iframe contents.

      There does seem to be some workarounds but they look like they require custom JavaScript programming. You can read more in this article trouble printing iframes

      Regards

      Phil

      Reply
      • Joshua Allmen

        March 17, 2023 at 5:05 am

        Thanks Phil. I am using my personal OneDrive for now (my company’s OneDrive does not allow sharing with all) and I was trying to avoid having the Excel file downloadable. So I used the Javascript code from Excel which uses the div code (secure) rather than the iframe code (I think the Excel file is downloadable under this method).

        I have tested code to get a div with simple text in it to print. But when I use my Excel div coding, it shows up blank at best. I can screen shot the web page and I myself would know how to print from a screen shot. But I do not know how to automate it for an end user with a single click (I have looked at some code for this too).

        Have you ever been able to get the div coding to print in these circumstances? Is there a solution that does not allow the end user to download the Excel file, but somehow gets the printer to print what the end user is seeing?

        Thanks for any help!

        Josh

        Reply
        • Philip Treacy

          March 29, 2023 at 9:26 am

          Sorry Josh I’ve never had to deal with this issue so don’t have a solution. Not sure why the browser isn’t just printing what is on screen.

          regards

          Phil

          Reply
  3. Krista

    January 25, 2023 at 5:16 am

    This was a really useful video. Are you able to embed sheets that have macros or userforms as well?

    Reply
    • Mynda Treacy

      January 25, 2023 at 9:37 am

      Glad it was helpful. VBA/Userforms are not executable on the web, so no point in embedding sheets that contain these features.

      Reply
  4. Stefan Andersson

    December 8, 2022 at 7:07 pm

    When I use the embed code on a webbpage an extra space is created above the Excel sheet, within the iframe. The space is also created in the prewiev box in the settings.
    Could it be a bug or something in Excel causing this?

    Reply
    • Mynda Treacy

      December 8, 2022 at 9:00 pm

      I haven’t noticed this with mine, so I suspect it’s in the Excel sheet or the range you’ve specified.

      Reply
      • Stefan Andersson

        December 9, 2022 at 7:43 am

        I can’t believe that the error is in the excel file itself, I get the same error in all different types of excel files, independent of each other, that I want to embed. Files that also worked before have suddenly got the error. Also, when I use the javascript instead, there is no error, then the embedded file appears as it should.

        Reply
  5. San Linn

    November 17, 2022 at 7:15 pm

    Hello, great job …thank you.
    I followed your advice and it works for Embeded code.
    However if i use JavaScript code and paste it into web, the script is appeared on the web instead of excel sheet.
    Can you please show me how to embed JavaScript on web? thank you.

    Reply
    • Philip Treacy

      November 18, 2022 at 11:42 am

      Hi,

      If the iframe code works then I don’t know why the JavaScript does not.

      If you are seeing the JS code on the web page, it sounds like it’s being treated as plain text. Is the JS code wrapped in

      <script><\script>

      tags?

      If you don’t get this fixed, please provide a link to a page with the issue so I can check it.

      Regards

      Phil

      Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Current ye@r *

Leave this field empty

Sidebar

More results...

launch excel macros course excel vba course

Featured Content

  • 10 Common Excel Mistakes to Avoid
  • Top Excel Functions for Data Analysts
  • Secrets to Building Excel Dashboards in Less Than 15 Minutes
  • Pro Excel Formula Writing Tips
  • Hidden Excel Double-Click Shortcuts
  • Top 10 Intermediate Excel Functions
  • 5 Pro Excel Dashboard Design Tips
  • 5 Excel SUM Function Tricks
  • 239 Excel Keyboard Shortcuts

100 Excel Tips and Tricks eBook

Download Free Tips & Tricks

Subscribe to Our Newsletter

Receive weekly tutorials on Excel, Power Query, Power Pivot, Power BI and More.

We respect your email privacy

239 Excel Keyboard Shortcuts

Download Free PDF

mynda treacy microsoft mvpHi, I'm Mynda Treacy and I run MOTH with my husband, Phil. Through our blog, webinars, YouTube channel and courses we hope we can help you learn Excel, Power Pivot and DAX, Power Query, Power BI, and Excel Dashboards.

Blog Categories

  • Excel
  • Excel Charts
  • Excel Dashboard
  • Excel Formulas
  • Excel PivotTables
  • Excel Shortcuts
  • Excel VBA
  • General Tips
  • Online Training
  • Outlook
  • Power Apps
  • Power Automate
  • Power BI
  • Power Pivot
  • Power Query
microsoft mvp logo
trustpilot excellent rating
Secured by Sucuri Badge
MyOnlineTrainingHub on YouTube Mynda Treacy on Linked In Mynda Treacy on Instagram Mynda Treacy on Twitter Mynda Treacy on Pinterest MyOnlineTrainingHub on Facebook
 

Company

  • About My Online Training Hub
  • Disclosure Statement
  • Frequently Asked Questions
  • Guarantee
  • Privacy Policy
  • Terms & Conditions
  • Testimonials
  • Become an Affiliate

Support

  • Contact
  • Forum
  • Helpdesk – For Technical Issues

Copyright © 2023 · My Online Training Hub · All Rights Reserved. Microsoft and the Microsoft Office logo are trademarks or registered trademarks of Microsoft Corporation in the United States and/or other countries. Product names, logos, brands, and other trademarks featured or referred to within this website are the property of their respective trademark holders.

Download A Free Copy of 100 Excel Tips & Tricks

excel tips and tricks ebook

We respect your privacy. We won’t spam you.

x