Embed Code Usage Guide

bendk edited this page Jan 12, 2018 · 29 revisions

To embed a video from Amara:

Step 1: paste this in your document somewhere (closest to the closing body tag is preferable):

<script type="text/javascript" src='https://amara.org/embedder-iframe'>
</script>

Step 2: paste this inside your HTML body where you want to include the videos, with the video URL, height, and width of your choosing:

<div class="amara-embed" data-height="480px" data-width="854px" data-url="http://www.youtube.com/watch?v=5CKwCfLUwj4">
</div>

You can set the following options:

  • Hide the menu item to order subtitles by adding data-hide-order="true" in the previous tag.
  • Set the initial active subtitle language by adding data-initial-language="[language-code]" in the previous tag, where language is the language code, such as "en" for English.
  • Display the subtitles by default by adding data-show-subtitles-default="true" in the previous tag.
  • Display the transcript by default by adding data-show-transcript-default="true" in the previous tag.
  • Control the max width of the embedder by adding data-width="XXpx" in the previous tag. Note that the embedder is responsive -- it will resize itself to fit inside its container width.

The subtitles and transcript will display as they do on the Amara video pages and in the amara embedder example

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.