How to add Audio Player to a Shorthand story

First, create a Shorthand Audio Player widget on Common Ninja.

On the widgets catalog, find the Audio Player and enter the Editor.

When you're done creating the Audio Player widget, click on the Save Changes button at the right top corner of the editor.

If you don't have an account on Common Ninja, you'll have to register first.

When you're ready to add the Audio Player widget to your Shorthand story, click the Add To Website button at the top bar of the Editor.

On the window that opens, click the Copy Icon to copy the widget embed code. In the next steps, you will paste this code into your Shorthand [site_type].

Now, let's head to your Shorthand Story editor.

You'll need to add a part of the Audio Player embed code you've copied, in the JavaScript window.

To do so, in the Shorthand editor, Click on the JavaScript button at the top bar (the JS icon).

Past the Audio Player embed code you've copied before, in the JavaScript window.

Delete the second line of the code you added, leaving only the first line of the embed code.

Click on the page, anywhere outside the JavaScript window, to close it.

If you're adding several widgets, you'll need to add the JavaScript line of code only once.

There are two ways you can add the Audio Player to your Shorthand story, by adding it to an existing section or by adding a new section to the Story.

To add the Audio Player to an existing section on your Story, click on the Insert HTML button in a section where you wish the Audio Player will show.

Now, in the Custom HTML window, simply paste the second line of the Audio Player embed code you've copied before.

Click the Save Changes button at the bottom of the Custom HTML window to save your changes and close the window.

Please note: the Audio Player content will not show on the Shorthand editor, and will only appear on the preview and on the published story.

Another way to add the Audio Player to the Story is by adding a new section.

To add a new section, click on the Add Section button on the left panel, wherever you wish the Audio Player to show on the Story.

Find and select the Custom HTML section at the bottom of the list.

Now, in the Custom HTML window, simply paste the second line of the Audio Player embed code you've copied before.

Please note: the Audio Player content will not show on the Shorthand editor, and will only appear on the preview and on the published story.