Tableau widgets
Widgets are designed for those times when you want to showcase content from your platform on external sites.
Widgets can be managed by platform owners and platform administrators.
Tableau widget can be used for displaying upcoming livestreams on an external landing page by using an embed link (iframe).
Regardless of settings, once the widget is created the embed URL will be the same for the widget, which makes it possible to customize what type of content you want to show in your widget without having to change the embed URL on the external site.
The embed link (iframe) to needs to be added to the external page is shown under the preview of the widget.
To disable a widget, the embed link needs to be removed from the external site.
Go to marketing & communication - widgets. Here you get an overview of the widgets you have created.
Press create new widget
Set a name and select the tableau widget in the dropdown menu for select widget type. The name is not publicly visible. Press add.
The widget is created and listed on the overview page. Press the widget to edit it.
Select what the widget should display by choosing the content in the content type dropdown. You can select livestream from tags, channels, categories, collections or collection categories. This is connected to the structure on the platform.
Select amount of items to display in the widget. There is now maximum amount, you will be able to scroll in the widget. If you don't have anything to display in the widget there will be a message saying "No content was found for the upcoming days."
Enable fall back content (optional). If there is no content in the selection you chose in content type, you can set a fallback content. For example if you chose to display content from a channel, the fallback could be showing the content for the whole collection the channel is included in.
Here you design the widget. You are able to change the size of the widget (in pixels). In container styles you can use tailwind classes to redesign the widget and change for example the background color.
Bg-white = background white
dark:bg-black = background black in dark mode in a browser/on a page
Colors to use:
You can always use the primary and accent colors that are configured under platform settings. These settings can be found in the dashboard via platform - manage platform - general settings - colors.
If you would like to chose another color you can find all colors to choose from here:
Tailwind colors
Forced language: Choose the language you want the widget to display. You can select from the languages you have enabled on the platform. If no language is selected the widget will use the language of the browser.
Show weekdays: Enable to show weekdays in the widget. Weekdays are shown infront of the date. (Thursday, November 2)
Change the styles of the titles
You are able to change the look of the titles in the widget. For example if you would like to change the color of them (e.g text-black). You are also able to change the size of the text.
Date styles: The date title of the streams
Name style: Title and time of the stream
Channel style: The channel name
Spacer styles: The border between the dates
Read more about Taiilwind classes.
The call to action button is a button below your widget which can be used to redirect to a new page on the site. For example "see all games" and get redirected to a schedule page. You are able to change the name of the button, add the url and change the design of the button such as background color or text color.
When you are done with your changes press Save at the bottom of the page. If the widget is embedded on the site it will be live immediately.
Widgets can be managed by platform owners and platform administrators.
Tableau widgets
Tableau widget can be used for displaying upcoming livestreams on an external landing page by using an embed link (iframe).
Regardless of settings, once the widget is created the embed URL will be the same for the widget, which makes it possible to customize what type of content you want to show in your widget without having to change the embed URL on the external site.
The embed link (iframe) to needs to be added to the external page is shown under the preview of the widget.
To disable a widget, the embed link needs to be removed from the external site.
Create a tableau widget
Go to marketing & communication - widgets. Here you get an overview of the widgets you have created.
Press create new widget
Set a name and select the tableau widget in the dropdown menu for select widget type. The name is not publicly visible. Press add.
The widget is created and listed on the overview page. Press the widget to edit it.
Edit tableau widget
Content
Select what the widget should display by choosing the content in the content type dropdown. You can select livestream from tags, channels, categories, collections or collection categories. This is connected to the structure on the platform.
Select amount of items to display in the widget. There is now maximum amount, you will be able to scroll in the widget. If you don't have anything to display in the widget there will be a message saying "No content was found for the upcoming days."
Enable fall back content (optional). If there is no content in the selection you chose in content type, you can set a fallback content. For example if you chose to display content from a channel, the fallback could be showing the content for the whole collection the channel is included in.
Design
Here you design the widget. You are able to change the size of the widget (in pixels). In container styles you can use tailwind classes to redesign the widget and change for example the background color.
Bg-white = background white
dark:bg-black = background black in dark mode in a browser/on a page
Colors to use:
You can always use the primary and accent colors that are configured under platform settings. These settings can be found in the dashboard via platform - manage platform - general settings - colors.
If you would like to chose another color you can find all colors to choose from here:
Tailwind colors
Forced language: Choose the language you want the widget to display. You can select from the languages you have enabled on the platform. If no language is selected the widget will use the language of the browser.
Show weekdays: Enable to show weekdays in the widget. Weekdays are shown infront of the date. (Thursday, November 2)
Change the styles of the titles
You are able to change the look of the titles in the widget. For example if you would like to change the color of them (e.g text-black). You are also able to change the size of the text.
Date styles: The date title of the streams
Name style: Title and time of the stream
Channel style: The channel name
Spacer styles: The border between the dates
Read more about Taiilwind classes.
Call to action button
The call to action button is a button below your widget which can be used to redirect to a new page on the site. For example "see all games" and get redirected to a schedule page. You are able to change the name of the button, add the url and change the design of the button such as background color or text color.
When you are done with your changes press Save at the bottom of the page. If the widget is embedded on the site it will be live immediately.
Updated on: 22/11/2023
Thank you!