Embed your list of files in a website or intranet

Google Data Studio report is compatible with all website builders and embedding your report is simple and easy.

In this article, we will focus on Google site embedding. But this method cas also be used for other CMS Webpages, see the last section of this article for further information.

And don't hesitate to check our 3min video tutorial!

Share the report

The easiest way to share your report (dashboard) is by letting anyone with the link access your Data Studio report.

Remember: Use caution when using link sharing, as this may expose your data to a wider audience than you intended:

If the report is shared publicly, then anyone viewing your page can see the embedded report.
If the report is shared with specific users, groups, or domains, then only those people can see the embedded report. These viewers must be logged into a Google account.

Sign in to Data Studio.
View or edit the report you want to share.
In the top-right, click Share. The Sharing with others dialog appears.
Click Manage access.
On the right, use the drop-down menu to select Anyone with the link can view:

Info: Click here to learn more about other link-sharing options that best meet your needs.

Note: If you are a Google Workspace user, your link sharing options may be restricted to users in your domain.

Embed your report using the URL or the HTML code

Method 1: using the embed URL

Edit the report you want to embed.
Select File > Embed report, or in the upper right, click Embed:
Click Enable embedding. A dialog box appears: Enable embedding dialog.

To embed a specific page of your report, navigate to that page before generating the embed link.

Select Embed URL.
Click COPY TO CLIPBOARD.

To embed a specific page of your report, navigate to that page before generating the embed code.

In your Google Site, select Embed in the Insert section
Paste the Data Studio link you copied in Step 5 under the BY URL tab. A live preview displays
Click insert:

You are all set!

Note: when embedding your report by URL, Google Site will displays white borders. If you don't want these or want to personalize even more your embedded report, we recommend to use HTML code. See next section to learn more!

Method 2: using the embed HTML code

To keep your iframe responsive, set the display mode of your report on Fit to width:

Select File > Embed report, or in the upper right, click Embed:
Click Enable embedding. A dialog box appears: Enable embedding dialog.

Tip: To embed a specific page of your report, navigate to that page before generating the embed link.

Select Embed Code.
Click COPY TO CLIPBOARD.

6. In your Google Site, click on Insert and select Embed

7. SelectEmbed Code, and paste the Data Studio code you copied in Step 3 under the Embed code tab.

By default, the generated HTML code will be the following:

<iframe width="600" height="450" src="https://datastudio.google.com/embed/reporting/ed563560-0974-4041-b617-54dbcf4d2af5/page/q4q9B" frameborder="0" style="border:0" allowfullscreen></iframe>

To automatically adjust the size of your iframe, change the width and height attributes to 100% in the code:

<iframewidth=100% height=100% src="https://datastudio.google.com/embed/reporting/ed563560-0974-4041-b617-54dbcf4d2af5/page/q4q9B" frameborder="0" style="border:0" allowfullscreen></iframe>

8. Then, click Insert:

Your report is now embedded in your Google Site!

Use the attribute border in the iframe tag to personalize the color, width, type of the borders! For example: style="border:1px solid black;"

Embed your report on a CMS Webpage

You can embed your report in any CMS Webpage allowing HTML iframes. The steps remain the same as explained earlier in this article:

From your Data Studio report, click on Share and select Embed report
Check enable embedding
Click on copy the clipboard
Edit the HTML source of the page in which you want to embed the report. Paste the iframe code where you want the report to appear.