You can insert videos in the body of your help center knowledge base articles, either through the help center editor toolbar or by embedding code in your article. You can also use the content block editor to insert videos into content blocks, making them reusable across one or more articles in your help center. See Creating and inserting reusable information with content blocks.
All plans include the ability to insert videos in articles; however, content blocks are available in Enterprise plans only. See Reusing content with content blocks.
Inserting videos from the article editor toolbar
- Vimeo
- YouTube
- Wistia
- JWPlayer
- Brightcove
- Vidyard
- Loom
If you are using Web Widget (Classic) on your website or help center, your end users can stream videos in help center articles directly in the Web Widget (Classic). To display correctly in the Web Widget (Classic), videos must be publicly available and hosted on one of the supported third-party services.
To insert a video in an article using the article editor toolbar
- Copy the URL for your video.
Your video must be hosted on Vimeo, YouTube, Wistia, JWPlayer, Brightcove, Vidyard, or Loom. If your video is on one of the supported services, you can use this procedure to insert your video. You do not need to enable the option to allow unsafe content in your help center to do so.
If your video is not hosted on a supported provider, you'll need to insert the video by embedding code).
- In help center or Guide Admin, edit an existing article or content block or create a new article or content block.
Note: You must be on an Enterprise plan to use content blocks.
- Place your cursor where you want the video to appear, then click Add video on the editor's toolbar.
- Paste the video's URL in the dialog box. A preview of the video appears.
To insert a video created using JWPlayer, use the URL format content.jwplatform.com/players/<video id>-<player id>
- Click Insert.
- When you are ready, click Save.
Inserting videos by embedding code
If your video is hosted on a non-supported service, use the article source code editor to add the video’s embed code to insert the video. Be aware that this means you must allow unsafe HTML (see Allowing unsafe HTML in articles).
Some third-party video hosting services do not count video views unless you have manually embedded the code to insert the video. Use the embed method if you need to track video views as part of your analytics.
47 Comments
Hi all
Does anyone here know how can I do the following;
I have inserted the video using Vimeo. Here's my code.
Right now, it looks like this in the article section
Hi Vemmal-N
Can you please share the url of the article where you are implementing the video part
Thanks
Hi Pulkit Pandey
This is where we are planning to implement it
https://help.lottiefiles.com/hc/en-us/articles/8705456865689-QR-Code
Hi Vemmal N
Sorry for the late replay :)
Please add a new class to your iframe called "videos" and then add the below CSS at the end of your style.css file
.videos {border-radius: 5px;
box-shadow: rgb(0 0 0 / 25%) 0px 14px 28px, rgb(0 0 0 / 22%) 0px 10px 10px;
}
Let me know if it solves your issue
Thanks
Pulkit
Team Diziana
Pulkit Pandey
Thank you so much! That solved most of my issues except for 1.
how can I make the text the same width as the video?
Hi Vemmal N
Please replace the below CSS with your current one
.videos {border-radius: 5px;
box-shadow: rgb(0 0 0 / 25%) 0px 14px 28px, rgb(0 0 0 / 22%) 0px 10px 10px;
width: 100%;
}
Let me know if it solves your issue
Thanks
Pulkit
Team Diziana
Hi,
We are trying to embed a video hosted in our own servers. However, it seems that zendesk is removing some of the attributes we add to the `video` tag. For example:
<video
src="<our url to a video hosted in our server>.mp4"
controls="yes"
controlslist="nodownload"
width="100%"
preload="auto"
></video>
The video is showing ok, but the `controlslist="nodownload"` is removed. Is there a way to add such attributes?
Thank you
Hi Javier,
You can add the missing attributes with the help of Javascript, please follow the below steps to add it
1. Add a new class called “videoattr” on your video tag which you are using to embed video .
As shown below
2. Now add the below script at the bottom of your script.js file
var i;
var videosAttr = document.querySelectorAll(“.videoattr”) ;
for(i=0; I<= videosAttr.length;i++) {
videosAttr[i].setAttribute(“controlslist”, “no download”);
}
Let me know if it solves your issue
Thanks
Pulkit
I'd recommend taking a look at this article which goes over editing your Guide theme.
Customizing your Help Center
I hope this helps!
Dear all, I just noticed that this article has been updated, now including Microsoft Stream as one of the video platforms which Zendesk supports.
There seems to be no further info around this within Zendesk.
Microsoft though has indicated their Strategy shift for Stream, from Stream (Classic) to Stream (on SharePoint). I have to assume that the support from Zendesk for Stream is based on the new Stream (on SharePoint) and not Stream (Classic)? Can this be confirmed?
Zendesk Guide articles still don't include a visual support message to support Stream, nor can a link from Stream (Mainly a MS SharePoint link) be included. Only the iFrame embedment is working, although its not clear how the permissions work from MS to ZD, as we have an online MS O365 setup, but as far as I know we don't allow to share links externally.
The Stream link in ZD Guide article works for me, but that probably only because I have access to it as an employee of our MS O265 tenant.
Is there more info about this new feature including what the possibilities are as well as how to manage it?
Many thanks!
Hello,
I would like to insert the following code to insert a video
<video width="100%" height="100%" controls autoplay controlsList="nodownload" oncontextmenu="return false;"><source src="myvideo.mp4" type="video/mp4" /></video>
When saved, the text in bold is ignored. Can you help ?
Hi Eric! If you take a look at the safe tags, you would need to allow unsafe tags for this to potentially work. Even with that, it is possible that the editor might strip it out, but I would recommend trying that first to see if you have better results.
Is there any response to https://support.zendesk.com/hc/en-us/articles/4408829384986/comments/5342805580186 ?
Based on the ticket that the user submitted, Classic is the option that is supported. The new set up is not compatible yet.
Hi Dane,
Any idea when the MS Stream (on Sharepoint) will be supported? As that replaces the MS Stream (Classic) - which is supported.
Any ideas why if I embed 2 Vimeo videos in an article only the second one displays? (It's not an issue with the 1st video because if I reverse the order, still only the second one displays. Inspecting the page with devtools shows that zd completely skipped the first video, didn't even try to insert it - there is no coding for it at all.)
This would require further troubleshooting and we would need to see how the videos were embedded. That said, I highly suggest reaching out to our Support Team and sharing as much information as possible. For reference, here is how you can open a ticket Contacting Zendesk Customer Support.
Thanks!
Best,
Please sign in to leave a comment.