HTML Embed Parameters

by Marc Reid

When sharing links to your workbooks on Tableau Server by using embedded links, there are a number of different parameters that can be added within the HTML code to provide additional functionality or alter the default way the workbook would be viewed.  Some useful examples are described below:

Force a particular custom view to load:

If your workbook has a mobile custom view included, you can force this view to be loaded even if the workbook is being loaded on a desktop PC using the below parameter in the HTML code:

<param name='device' value='phone'/>

Load the workbook with a filter applied

To ensure a workbook is always loaded with a particular filter applied, use the following parameter:

<param name=’filter’ value=’Department=Finance’/>

It would also be possible to save the workbook with the filter applied, however, the parameter method allows you to apply different filters when embedding the workbook in different web pages – for example, different departments might have their own home page and the same workbook could be show on each homepage but filtered for the respective department’s data.

Change the position of the toolbar

The Tableau toolbar, which shows various actions (“Subscribe”, “Edit”, “Share”, “Full Screen” etc.) loads at the bottom of the workbook by default.  However, it is possible to change the location of this toolbar, to load at the top, using the below code:

<param name=’toolbar’ value=top’/>

It’s also possible to stop the toolbar from loading altogether by using the value of “no” instead of “top” in the code above.

Turn off Tooltips

Tooltips will load by default (assuming they are included in your workbook when it was created), however, they can be switched off using the below code:

<param name=’tooltip’ value=’no’/>

HTML Embed Code Example

Below is an example of the HTML code to embed your workbook within a very basic, sample HTML page, showing three of the above parameters highlighted in red

<html>
<head></head>
<body>
<script type='text/javascript' src='https://tableauserver.yourserver.co.uk/javascripts/api/viz_v1.js'></script>
<div class='tableauPlaceholder' style='width: 1204px; height: 712px;'>
<object class='tableauViz' width='1204' height='712' style='display:none;'>
<param name='host_url' value='https%3A%2F%2Ftableauserver.yourserver.co.uk%2F' /> 
<param name='site_root' value='/t/SiteName' />
<param name='name' value='BlogMetrics/TopPosts' />
<param name='showShareOptions' value='true' />
<param name='tabs' value='yes' />
<param name='toolbar' value='top' />
<param name='filter' value='Department=Finance'/>
<param name='tooltip' value='no'/>
</object></div>
</body>
</html>

Want to know more?  … A full list of these embed parameters can be found at this link: https://onlinehelp.tableau.com/current/server/en-us/embed_list.htm

Tue 23 May 2017

Fri 21 Apr 2017

Wed 19 Apr 2017