Guide to: Hosting & Adding Audio and Videos to Your Job

Overview

This article explains how to incorporate audio clips and videos into your job designs. See this article for how to embed different media into your Instructions.

Embedding Audio Clips

You can add an audio clip to the CML Code Editor using the following HTML tag:
- <audio controls="controls" style="width: 50%;" src="audio_url" type="audio/mp3"></audio>
- Where src="audio_url" is your audio URL.
Similar to images and .gifs, audio clips can be inserted in any div and the width of how the audio clip appears in the job can be adjusted.
Please note that like images and .gifs, the audio clip must be hosted to embed in the job.

Please see an example below:

&lt;audio controls="controls" style="width: 50%;" src="https://crowdflower-projects.s3.amazonaws.com/elam/nic/Winston+Churchill+Nazi+Speech-SoundBible.com-877765747-%5BAudioTrimmer.com%5D_2.mp3" type="audio/mp3"&gt;&lt;/audio&gt;

Embedding Videos

To add a video in your job design Code Editor, you can add the following HTML tag:

&lt;video width="320" height="240" controls="true"&gt;
  &lt;source src="video_url" type="video/mp4"/&gt;
  Your browser does not support the video tag.
&lt;/video&gt;

Where src="video_url" is your video URL.

Like other data types, a video must be in the form of a hosted URL to put in a job design or job instructions.
We recommend the video is in .mp4 format.
Similar to images and .gifs, videos can be inserted in any div and the width and/or height of how the video appears in the job can be adjusted.

Please see an example below:

&lt;video width="320" height="240" controls="true"&gt;
&lt;source src="https://nnanni.s3-us-west-1.amazonaws.com/atl_data/trim_bat.mp4" type="video/mp4"/&gt;Your browser does not support the video tag.&lt;/video&gt;