Tableau Integration

Site URL: https://www.learnwithsam.org/third-grade

We are integrating Tableau visualizations into our Squarespace website that uses the BEDFORD template. 

I have the main dashboard visualization embedded correctly here https://www.learnwithsam.org/data-dashboard.  That page is a main navigation page. I run into trouble when placing the code for a similiar visualization into an unlinked/maplink page here:  https://www.learnwithsam.org/third-grade.  We can get the set of visualizations to show up, but, on this page, the view is not showing the entire display within the frame. The main problem is the height, with only a slight problem with width.  The tableau feature that generates the code is set to AUTOMATIC, which notes  "The dashboard will resize to fit any screen it is displayed on."  That setting was used for the code generated for both pages. 

The other setting options in Tableau are:

RANGE which allow me to plug in minimum and maximum parameters for width and height.  That does not work because resetting those impacts the view window, not the size of what is displayed.  Using that we could get to a frame that fits on the page but the actual graphic disappears behind the frame.

CUSTOM which allows me to plug in my own width and height or select presets related to viewing device, ie: ipad, general computer screen, cell phone.  We cannot use that because it needs to work on any device. 

I will have to generate code similarly for visualizations that are to be placed on other unlinked (not main navigation pages) but before working on those, I am trying to make sure I have the coding process necessary.  

I think it is an issue with the page for the second code being a maplink rather than main navigation page.  Any suggestions? Thanks so much! Kim 

Hi KimberlySA,

I saw the tableau element is displaying well here, could you mind to help me replicate the issue?

If you see, the text and legend are cut off.  The image in the purple banner is also cut off.  We are not sure how to fix it.  

I have the same issue as @KimberlySA

@KevinPayne

Please post the URL for the page on your site where you are having the issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password is not a security breach. Please read the documentation at the link provided to understand how it works.

We can then take a look at your issue.

I'm having this same issue with a website that's currently in progress. It's not yet published, so I can't share the url, but screenshot is attached - you can see the scroll bar is all the way at the bottom of the graphic, but still it's cut off. Does SquareSpace put a certain frame size on embedded content? Any new ideas on how to fix this issue? Thanks!

I'm having similar issues, but only on mobile view, did anyone in this thread get a fix?

Site URL: https://turbot-crocodile-l45j.squarespace.com/home

 added an embed block with manual code from tableau to display a bar chart. The chart displays fine in desktop view but in mobile view doesn't resize to fit, displays scroll bars on the x and y axis. 

site password (text in quotes): '0range.'

bar chart set to ‘automatic’ on tableau

On 10/28/2021 at 3:28 PM, ScottieDog said:

I'm having similar issues, but only on mobile view, did anyone in this thread get a fix?

Site URL: https://turbot-crocodile-l45j.squarespace.com/home

 added an embed block with manual code from tableau to display a bar chart. The chart displays fine in desktop view but in mobile view doesn't resize to fit, displays scroll bars on the x and y axis. 

site password (text in quotes): '0range.'

bar chart set to ‘automatic’ on tableau

Can you take a screenshot? I don't see chart on this page

On 10/31/2021 at 1:44 AM, tuanphan said:

Can you take a screenshot? I don't see chart on this page

I've found a workaround for this, tableau embedding no longer required.

I had the same issue with images that were shown by this template. Hopefully, I found that we can fix this issue by connecting the Jira application to Tableau. Somehow it worked, and images started to be shown properly on the website. You could try this method. Suppose you are wondering about the Jira application or how to connect them properly. In that case, I recommend you visit this site: https://newsupdate.uk/how-to-connect-tableau-to-jira/ with detailed information about the most effective way to connect those applications and prevent appearing any bugs and errors during your work. If you have any questions regarding this topic, please get in touch with me in private messages.

Hi! I am hoping someone in this thread can help me. I used the embed code from my dashboard in Tableau Public. When you click on the website page, it doesn't show the dashboard, but if you refresh it shows up. 

Here is the website page - https://www.contracostaalliance.org/dv-calls-data

This is the dashboard that I am embedding - https://public.tableau.com/views/DataDashboardv1_1/Explorer?:language=en-US&:sid=&:display_count=n&:origin=viz_share_link

Thanks for any help folks can offer! 

12 minutes ago, Kjbodiford said:

I used the embed code from my dashboard in Tableau Public. When you click on the website page, it doesn't show the dashboard, but if you refresh it shows up.

@Kjbodiford It’s caused by a special feature on certain Squarespace 7.0 templates called Ajax Page Loading. Please see my guide Why does Squarespace code only work on refresh?

Did this help? Please give feedback by clicking an icon below  ⬇️

5 minutes ago, paul2009 said:

@Kjbodiford It’s caused by a special feature on certain Squarespace 7.0 templates called Ajax Page Loading. Please see my guide Why does Squarespace code only work on refresh?

Did this help? Please give feedback by clicking an icon below  ⬇️

THANK YOU! I will check that out. 

19 minutes ago, Kjbodiford said:

THANK YOU! I will check that out. 

Disabling Ajax worked. Will see how it affects the site loading. I appreciate the quick help! It's been driving me nuts.