Origami Frontend Components & Services

Readme: g-audio

g-audio is not maintained by the Origami team. While this component may be used, we make no guarantees about the support status, though we will help if we can.

This is an origami component to help create styled audio players for IG pages. This is currently experimental.

Getting started

Install the module:

bower install --S g-audio

Load the JS:

const GAudio = require('g-audio');


Load the CSS:

@import 'g-audio/main';

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">

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">


Copyright (c) 2016 Financial Times Ltd. All rights reserved.

This software is published under the MIT licence.

Switch component view

GitHub Repository

Install g-audio

If using the Build Service, add g-audio@^1.0.5 to your script and link tags.

If running a Manual Build, run bower install --save "g-audio@^1.0.5".

Help & Support

g-audio is not supported directly by the Origami team. We make no guarantees, but will help if we can. First try contacting its maintainers at:

Slack: #graphics-dev
Email: ig.developers@ft.com