The Embed widget allows you to enrich your Jint for Teams pages and dashboards by integrating external applications and content. Centralize your tools (dashboards, videos, documents) to access them without leaving your interface.

What can I embed?

The Embed widget is very versatile. Here are some common examples:

• Dashboards and reports: Power BI, Looker Studio, etc.
• Videos: YouTube, Vimeo, Dailymotion, Microsoft Stream.
• Collaborative tools: Figma, Miro, Productboard.
• Maps: Google Maps, OpenStreetMap.
• Other services: Calendars, weather widgets, world clocks.

Tutorials: How to get an embed code

Here is how to find this code on the most popular platforms:

➡️ On YouTube

1. Below the video you want to embed, click the Share button.
2. In the window that appears, click the first option: Embed.
3. The <iframe> code will be displayed. Simply click the COPY button to retrieve it. It is already in the correct format.

➡️ On Spotify (works for songs, albums, and playlists)

1. On the track, album, or playlist, click the ... icon (More options).
2. Navigate to the Share menu, then click Embed.
3. A window will appear with the <iframe> code. Click COPY to retrieve it.

➡️ On Google Maps

1. Search for the address or place you want to display.
2. Click the Share button.
3. In the window that opens, go to the Embed a map tab.
4. The <iframe> code will appear. You can even choose a size (Small, Medium, Large) before clicking COPY HTML.

How to configure the Embed widget

Follow these steps to embed your content.

Step 1: Get the correct HTML embed code

The Jint for Teams widget requires a simple <iframe> code with fixed dimensions. Complex codes that use <div> or CSS for a "responsive" display are not supported.

The correct format uses the width and height attributes directly in the <iframe> tag.

CORRECT code example for YouTube:

<iframe 
    width="560" 
    height="315" 
    src="https://www.youtube.com/embed/VIDEO_ID" 
    title="YouTube video player" 
    frameborder="0" 
    allowfullscreen>
</iframe>

INCORRECT code example:

<div style="position: relative; padding-bottom: 56.25%;">
    <iframe 
        src="https://www.youtube.com/embed/VIDEO_ID" 
        style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
        allowfullscreen>
    </iframe>
</div>

Step 2: Add the code in Jint for Teams

1. Drag the iFrame widget onto your page.
2. Open the widget settings.
3. In the Content tab, paste your <iframe> code into the "Website address or embed code" field.

Step 3: Customize the display

In the Layout tab, you can adjust the widget's appearance:

• Show title: Give your widget a visible name.
• Allow fullscreen: Lets users view the content in fullscreen mode.
• Padding: Choose between a display with or without space around the content.
• Customize dimensions: Check this option to manually adjust the widget's width and height, which will override the width and height values in your code.

Note: The borderless display (no padding) disables the title and the fullscreen button for a more seamless integration.

Rules and Troubleshooting

If your content does not appear, check the following points:

• The code must be an <iframe> tag: For security and compatibility reasons, the widget does not allow <script> tags or other code formats. The code must start with <iframe ...>.
• The URL must be secure (HTTPS): Only content from secure sites (https://...) can be embedded. Links in http:// will be blocked.
• Some sites prohibit embedding: Even with a correct <iframe> code and an HTTPS URL, some websites (like certain CRM tools or social networks) actively block their integration on third-party platforms. This is a security restriction on their part that Jint for Teams cannot bypass. If the content doesn't display, check if the service you are trying to embed allows it.