This is an origami component to help create styled audio players for IG pages. This is currently experimental.
Check out how to include Origami components in your project to get started with g-audio
.
Install the module:
npm install @financial-times/g-audio
Load the JS:
import GAudio from '@financial-times/g-audio';
GAudio.init();
Load the CSS:
@import '@financial-times/g-audio/main';
@include gAudio();
Copy markup from one of the following demos:
To create an audio player inline with text:
<span class="g-audio">
Bring to the table win-win survival
<audio controls>
<source src="demo.mp3" type="audio/mpeg">
</audio>
</span>
To create an audio player between paragraphs of text (in development):
<span class="g-audio g-audio--block">
Podcasting operational change management
<audio controls>
<source src="demo2.mp3" type="audio/mpeg">
</audio>
</span>
This software is published by the Financial Times under the MIT licence.