How can I embed a TikTok video in a Qualtrics survey? | XM Community
Skip to main content

I’m trying to embed a TikTok video in a Qualtrics survey.

I want to embed straight from TikTok because I plan to display a large number of videos (set by some embedded data).

I tried taking TikTok’s default embed text and putting it straight into the HTML field of a text field in Qualtrics.

TikTok makes it really easy to embed a video, but not much customization. You can generate an embed code here: https://www.tiktok.com/embed or even just by clicking Share/Embed on any video.

For instance, let’s take this video: https://www.tiktok.com/@amandaeveart/video/7264266991727299882

We can embed it with the HTML:

<blockquote class="tiktok-embed" cite="https://www.tiktok.com/@amandaeveart/video/7264266991727299882" data-video-id="7264266991727299882" style="max-width: 605px;min-width: 325px;" > <section> <a target="_blank" title="@amandaeveart" href="https://www.tiktok.com/@amandaeveart?refer=embed">@amandaeveart</a> a little compilation of some of the tic-tac-toe boards ive made over the past few months 🥹🫶🏻 <a title="airdryclay" target="_blank" href="https://www.tiktok.com/tag/airdryclay?refer=embed">#airdryclay</a> <a title="oilpainting" target="_blank" href="https://www.tiktok.com/tag/oilpainting?refer=embed">#oilpainting</a> <a title="artistoftiktok" target="_blank" href="https://www.tiktok.com/tag/artistoftiktok?refer=embed">#artistoftiktok</a> <a title="tictactoe" target="_blank" href="https://www.tiktok.com/tag/tictactoe?refer=embed">#tictactoe</a> <a title="uvresin" target="_blank" href="https://www.tiktok.com/tag/uvresin?refer=embed">#uvresin</a> <a target="_blank" title="♬ What Was I Made For? hFrom The Motion Picture "Barbie&#34;] - Billie Eilish" href="https://www.tiktok.com/music/What-Was-I-Made-For-From-The-Motion-Picture-Barbie-7255081252415375362?refer=embed">♬ What Was I Made For? From The Motion Picture &#34;Barbie&#34;] - Billie Eilish</a> </section> </blockquote> <script async src="https://www.tiktok.com/embed.js"></script>

 

That code embedded into Qualtrics gets me the following when I preview:

@amandaeveart a little compilation of some of the tic-tac-toe boards ive made over the past few months 🥹🫶🏻 #airdryclay #oilpainting #artistoftiktok #tictactoe #uvresin ♬ What Was I Made For? rFrom The Motion Picture "Barbie"] - Billie Eilish

 

I tried taking that javascript link at the end, “https://www.tiktok.com/embed.js”, and embedding it with Qualtric’s Embed Javascript feature like:

Qualtrics.SurveyEngine.addOnload(function()
{
    /*Place your JavaScript here to run when the page loads*/
jQuery.getScript("https://www.tiktok.com/embed.js");
});
 

Unfortunately this doesn’t get us any better.

Suspect it is a javascript issue somehow. Any ideas?

@bsmith 

Try including below directly in HTML editor of question. You can customize the height and width of the frame as required.

<iframe src="https://www.tiktok.com/@amandaeveart/video/7264266991727299882" width="605" height="340" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Hope this helps!

Thanks, Deepak. But with the following code:

<iframe height="850" width="605" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen src="https://www.tiktok.com/@amandaeveart/video/7264266991727299882"></iframe>

I’m getting the image below showing. Maybe TikTok is designed to refuse to be embedded in iFrames.

 

Do check if tiktok is banned or not in your country.

I am able to view tiktok videos by using a link directly to TikTok. It just doesn’t work when embedded in Qualtrics. I also tried the embed links embedded on an HTML page saved on my computer. This also works. It just doesn’t work from Qualtrics.

It’s related to the script.

I see that the <script> tag has been stripped out when the item is served.

What gets served is the below:

<div>

<blockquote class="tiktok-embed" cite="https://www.tiktok.com/@amandaeveart/video/7264266991727299882" data-video-id="7264266991727299882" style="max-width: 605px;min-width: 325px;"> <section> <a target="_blank" title="@amandaeveart" href="https://www.tiktok.com/@amandaeveart?refer=embed">@amandaeveart</a> a little compilation of some of the tic-tac-toe boards ive made over the past few months 🥹🫶🏻 <a title="airdryclay" target="_blank" href="https://www.tiktok.com/tag/airdryclay?refer=embed">#airdryclay</a> <a title="oilpainting" target="_blank" href="https://www.tiktok.com/tag/oilpainting?refer=embed">#oilpainting</a> <a title="artistoftiktok" target="_blank" href="https://www.tiktok.com/tag/artistoftiktok?refer=embed">#artistoftiktok</a> <a title="tictactoe" target="_blank" href="https://www.tiktok.com/tag/tictactoe?refer=embed">#tictactoe</a> <a title="uvresin" target="_blank" href="https://www.tiktok.com/tag/uvresin?refer=embed">#uvresin</a> <a target="_blank" title="♬ What Was I Made For? From The Motion Picture &quot;Barbie&quot;] - Billie Eilish" href="https://www.tiktok.com/music/What-Was-I-Made-For-From-The-Motion-Picture-Barbie-7255081252415375362?refer=embed">♬ What Was I Made For? aFrom The Motion Picture "Barbie"] - Billie Eilish</a> </section> </blockquote> 
</div>

 

You can see the <script> tag which I included at the end (as in my first post) is missing.

So it seems like Qualtrics is stripping it out for security reasons.

As I explained in the first post, I also tried embedding that script in other ways, in the Qualtrics Question Behavior Javascript field, but this hasn’t seem to have addressed the problem.

Not sure why it isn’t working for you, because the iframe piece did work for me

hmm, might be a browser thing? what browser are you using? I was using Chrome on MacOS

On Firefox I get this:

 

Chrome

ahh yep. Thanks! Well, I figured it out. I created a separate HTML page on my own server, used the embed code to embed the TikTok video in that, and then used an iFrame in my Qualtrics survey to display the separate page.

Leave a Reply


Terms & Conditions