Are you running into issues while embedding media in your Speks? Check out these troubleshooting tips and procedures to get your Speks working the right way.
1. What is an iFrame Code?
An iframe is short for Inline Frame — it is an HTML element used to embed interactive media.
<iframe src="http://www.example.com/"></iframe>
<iframe src="http://www.example.com/" width="400" height="300"></iframe>
<iframe src="http://www.example.com/" style="border: 0;"></iframe>2. Supported Video Embed Platforms
Spekit supports video embed code (iframe) in Speks from the following platforms:
- Google Drive / G-Suite
- Microsoft Stream
- Microsoft SharePoint
- Vidyard
- Wistia
- Box
- Loom
- YouTube
- Vimeo
- Spotify
- Scribe
Note: Embedding iframes from other sources may cause issues in the Spekit experience. Reach out to your CSM for support, or email us at support@spekit.co and we'll be happy to help!
For step-by-step instructions, see How to add a video embed code to a Spek.
3. Why Isn't the Iframe Code Embedding a Video in My Spek?
There may be instances where the content in an iframe is not being populated or results in an error when you paste the iframe code. This issue is typically caused by a security mechanism enforced by the browser or the owner of the content being embedded. Here are some examples for better understanding:
Web App
The third-party site does not allow embedding on a different domain. For example, if you embed an iframe from https://example.com and try to display it on https://salesforce.com, it will not load if https://example.com has a policy that prevents its content from being loaded on a different domain.
Sidebar (Extension)
The third party requires embedding over the https:// protocol, but the extension loads from the chrome-extension:// protocol. For example, if you embed an iframe from https://example.com and try to display it in the sidebar, it will not load if https://example.com has a policy that prevents its content from being loaded on non-https:// origins.
Spek Popover
The host site does not allow third-party frames. For example, if you embed an iframe from https://example.com and try to display it on https://jira.com, it will not load if https://jira.com has a policy that prevents frames from loading unless they match https://jira.com.
4. Allowing Access While Creating a Shareable Iframe Code
Before a video or file will play correctly when embedded in a Spek, the content itself needs to be set to allow outside viewing and embedding at the source. Follow these general steps for the platform you're using:
-
Set the sharing/visibility permissions. Most platforms require content to be set to "Public," "Anyone with the link," or "Unlisted" before it can be embedded elsewhere. Content set to "Private" or restricted to specific individuals will not load in an embed, even with valid iframe code.
- YouTube: Set the video's visibility to Public or Unlisted (not Private).
- Google Drive / G-Suite: Click Share, then set general access to "Anyone with the link."
- Vimeo: Under Privacy settings, allow the video to be embedded on "All websites" or specific domains.
- Loom: Ensure the video's sharing setting allows public or link-based access.
- Wistia: Confirm the media's privacy setting allows public embedding.
- Microsoft Stream / SharePoint: Grant view access to "People in your organization" or broader, depending on your audience.
- Box: Set the file's shared link permission to allow viewing by anyone with the link.
- Locate the Share or Embed option. This is typically found by clicking Share, Embed, or a similar icon near the content's title or toolbar.
-
Copy the embed code. Select the Embed tab (rather than a plain share link) to get the full iframe code, including the
<iframe>tags. - Paste the embed code into your Spek.
- Test the embed. Preview the Spek to confirm the video or file loads and plays correctly before publishing.
Note: If a video or file still doesn't load after confirming sharing permissions, the issue may be a domain-level restriction set by the platform. See the troubleshooting section above for more detail.