Can You Embed Tableau into a Website?

Yes, you can absolutely embed an interactive Tableau dashboard directly into your website. Doing so is a powerful way to share live data stories, make complex information more accessible, and allow your audience to engage with your insights directly. This article will walk you through exactly how to do it, step-by-step, along with best practices for a seamless experience on your site.

Graphed

Still Building Reports Manually?

Watch how growth teams are getting answers in seconds — not days.

Watch the Demo

Why Embed Tableau Dashboards on Your Website?

Before diving into the “how,” it’s worth understanding the “why.” Embedding a dashboard isn’t just about making a webpage look good, it offers tangible benefits for sharing data with internal teams, clients, or the public.

• Tell a Dynamic Data Story: Static images of charts are a thing of the past. An embedded, interactive dashboard lets users filter, hover, and click to explore the data for themselves. You can guide them through a narrative while still giving them the freedom to dig into the details that matter most to them.
• Increase Transparency and Trust: Sharing performance data builds credibility. A marketing agency can embed a live campaign performance dashboard for a client, or a non-profit can show a real-time view of its fundraising progress. This level of transparency fosters trust and keeps everyone aligned.
• Automate Reporting: Once embedded, the dashboard updates automatically whenever its underlying data source refreshes. Say goodbye to the weekly routine of exporting PNGs and updating your website manually. Set it up once, and your website will always display the freshest insights.
• Boost User Engagement: Interactive content keeps visitors on your site longer. A blog post explaining industry trends becomes far more compelling when paired with an embedded Tableau visualization that lets users explore the data for your state or industry.
• Centralize Information for Your Team: For internal use, you can embed key performance indicators (KPI) dashboards into a company intranet or private webpages. This gives your sales, marketing, or operations teams a single source of truth they can access anytime without needing to log in to Tableau directly.

Getting Started: What You Will Need

The process is straightforward, but you’ll need two things ready to go before you begin:

1. A Published Tableau Dashboard: Your dashboard can't be sitting on your local computer. It needs to be published to a Tableau platform so it's accessible via the web. You have three main options:
2. Access to Your Website's Backend: You'll need the ability to edit the HTML of your webpage. Most Content Management Systems (CMS) like WordPress, Squarespace, or Webflow have an easy way to add HTML snippets or custom code blocks.

How to Embed a Tableau Dashboard: A Step-by-Step Guide

No matter which Tableau platform you're using (Public, Cloud, or Server), the core steps for getting an embed code are nearly identical. For this example, we’ll use a dashboard on Tableau Public, which is the most common entry-point for many users.

Step 1: Navigate to Your Published Dashboard

Open your web browser and go to the URL of the Tableau dashboard you want to embed. You should see your visualization displayed in the Tableau interface.

Graphed

Still Building Reports Manually?

Watch how growth teams are getting answers in seconds — not days.

Watch the Demo

Step 2: Find and Click the 'Share' Button

Look for the ‘Share’ icon, usually located at the bottom right of the dashboard view, near the download and full-screen options. It looks like three connected dots. Clicking this button will open up a share dialog box, which gives you options to share a link or get the embed code.

Step 3: Copy the 'Embed Code'

Inside the share dialog, you will see a field labeled “Embed Code.” This is what you need. It’s an HTML snippet that starts with <iframe>. Tableau conveniently provides a “Copy Embed Code” button that copies the entire snippet to your clipboard.

Here’s an example of what that code might look like:

<div class='tableauPlaceholder' id='viz1633549200000' style='position: relative'>
<noscript><a href='#'><img alt='Dashboard Title ' src='https://public.tableau.com/static/images/Da/DashboardName/Dashboard1_rss.png' style='border: none' /></a></noscript>
<object class='tableauViz'  style='display:none,'><param name='host_url' value='https%3A%2F%2Fpublic.tableau.com%2F' /> 
<param name='embed_code_version' value='3' /> 
<param name='site_root' value='' /><param name='name' value='DashboardName/Dashboard1' /> 
<param name='tabs' value='no' /> 
<param name='toolbar' value='yes' /> 
<param name='static_image' value='https://public.tableau.com/static/images/Da/DashboardName/Dashboard1/1.png' /> 
<param name='animate_transition' value='yes' /> 
<param name='display_static_image' value='yes' /> 
<param name='display_spinner' value='yes' /> 
<param name='display_overlay' value='yes' /> 
<param name='display_count' value='yes' /> 
<param name='language' value='en-US' /> 
</object>
</div>                
<script type='text/javascript'>var divElement = document.getElementById('viz1633549200000'), var vizElement = divElement.getElementsByTagName('object')[0], vizElement.style.width='100%',vizElement.style.height=(divElement.offsetWidth*0.75)+'px', var scriptElement = document.createElement('script'), scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js', vizElement.parentNode.insertBefore(scriptElement, vizElement),</script>

Don't be overwhelmed by the code! You don't need to understand it fully. Just copy the whole block.

Graphed

Still Building Reports Manually?

Watch how growth teams are getting answers in seconds — not days.

Watch the Demo

Step 4: Paste the Embed Code into Your Website

Now, go to the content editor for the page on your website where you want the dashboard to appear. Where you paste this code will depend on your platform:

• On WordPress (Gutenberg Editor): Add a new block and search for “Custom HTML.” Paste the code directly into this block and click preview.
• On Squarespace: Add a content block and choose the “Code” block. Paste your code snippet here.
• On Webflow: Add an “Embed” element from the Components panel and paste the code inside.
• On any plain HTML page: Simply paste the code into the body of your HTML file where you want the dashboard to appear.

After you save or publish the page, your interactive Tableau dashboard should appear right on your website!

Customizing Your Embedded Dashboard

The standard embed code works fine, but you can customize the experience by making small tweaks to it. These adjustments are made by adding parameters to the URL inside the embed code.

Adjusting Width and Height

By default, Tableau's embed script tries to be responsive. However, you can manually set the width and height of the <object> element for more control. For example, to make the dashboard fluid with your site's design, you might set the width to 100%:

vizElement.style.width='100%',
vizElement.style.height='800px',

Graphed

Still Building Reports Manually?

Watch how growth teams are getting answers in seconds — not days.

Watch the Demo

Controlling Interactivity and Appearance

You can control features like the toolbar, tabs, and reverting actions by modifying certain <param> tags. For example:

• <param name='toolbar' value='no' />: Hides the default Tableau toolbar at the bottom of the visualization. Set value='yes' or value='top' to show it.
• <param name='tabs' value='yes' />: If your Tableau workbook has multiple dashboards or sheets as tabs, this will display them. Set value='no' to hide them.
• <param name='device' value='desktop' />: You can force a specific layout. Use 'tablet' or 'phone' if you've designed device-specific layouts in Tableau and want to ensure a certain one loads.

Bonus Tips and Best Practices

Embedding dashboards is easy, but making them performant and user-friendly on a website takes a little more thought.

1. Optimize for Web Performance

A complex dashboard with a huge dataset can significantly slow down your webpage's load time. Before embedding:

• Simplify your visuals: Do you really need all ten of those filters? Reduce the number of marks, charts, and calculations to the essentials.
• Use a data extract: If possible, publish your dashboard with a Tableau Data Extract (.hyper file) instead of a live connection to a database. Extracts are much faster for web-based viewing.
• Aggregate your data: Pre-aggregate your data to the level of detail necessary for the viz. Displaying daily totals is much faster than running calculations on millions of individual rows every time the page loads.

2. Always Design for Mobile

A dashboard that is clear on a 24-inch monitor can be completely unusable on a smartphone. Use Tableau's "Device Layouts" feature in Tableau Desktop to create specific phone and tablet versions of your dashboard. When a user visits your website on a mobile device, Tableau will automatically serve the appropriate layout.

3. Understand Security Implications

• Tableau Public is PUBLIC: Never, ever upload sensitive or proprietary company data to Tableau Public. Anyone on the internet can find, view, and download it.
• Tableau Server/Cloud for Secure Data: When embedding dashboards from these platforms, data security is maintained. Users who visit the webpage will often be prompted to log in to Tableau to see the dashboard, unless you have configured a guest user or another authentication method. This ensures that only authorized viewers can access your internal business data.

Final Thoughts

Embedding Tableau dashboards is a fantastic way to bring live, interactive data directly to your website's audience. By choosing the right platform, grabbing the ready-made embed code, and pasting it into your site, you can transform a static page into a dynamic, engaging data hub in just a few minutes.

Of course, building and embedding the dashboard is just one piece of the puzzle. The most time-consuming work often happens before you even open a BI tool - manually pulling data from all your marketing and sales platforms just to create a unified view. At Graphed you would see instead.