2017-07-10 22:28:39 +01:00
<!DOCTYPE html>
< html class = "no-js" lang = "en-GB" >
< head >
< title > Install and Configure the Nomensa Accessible Media Player in Drupal | Oliver Davies< / title >
< meta charset = "UTF-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2017-07-21 18:44:18 +01:00
< meta property = "og:url" content = "https://www.oliverdavies.uk/blog/2012/07/14/install-nomensa-media-player-drupal/" >
2017-07-10 22:28:39 +01:00
< meta property = "og:title" content = "Install and Configure the Nomensa Accessible Media Player in Drupal" / >
2017-07-12 07:22:51 +01:00
< meta property = "og:image" content = "https://www.oliverdavies.uk/assets/images/me-precedent.jpg" / >
2017-07-10 22:28:39 +01:00
< meta property = "og:image:height" content = "327" / >
< meta property = "og:image:type" content = "image/jpg" >
< meta property = "og:image:width" content = "327" / >
2017-07-12 07:22:51 +01:00
< link rel = "stylesheet" href = "https://www.oliverdavies.uk/assets/css/main.css" >
2017-07-14 23:11:03 +01:00
2017-07-10 22:28:39 +01:00
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=57" sizes = "57x57" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=114" sizes = "114x114" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=72" sizes = "72x72" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=144" sizes = "144x144" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=60" sizes = "60x60" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=120" sizes = "120x120" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=76" sizes = "76x76" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=152" sizes = "152x152" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=160" sizes = "160x160" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=96" sizes = "96x96" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=32" sizes = "32x32" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=16" sizes = "16x16" >
< / head >
< body class = "" >
< nav class = "navbar navbar-inverse navbar-fixed-top" >
< div class = "container" >
< div class = "navbar-header" >
< button type = "button" class = "navbar-toggle collapsed" data-toggle = "collapse" data-target = "#navbar" aria-expanded = "false" aria-controls = "navbar" >
< span class = "sr-only" > Toggle navigation< / span >
< span class = "icon-bar" > < / span >
< span class = "icon-bar" > < / span >
< span class = "icon-bar" > < / span >
< / button >
2017-07-12 07:22:51 +01:00
< a class = "navbar-brand" href = "https://www.oliverdavies.uk/" > Oliver Davies< / a >
2017-07-10 22:28:39 +01:00
< / div >
< div id = "navbar" class = "collapse navbar-collapse" role = "navigation" >
< ul class = "nav navbar-nav" >
< li class = "" >
< a href = "/" > About< / a >
< / li >
< li class = "" >
< a href = "/experience" > Experience< / a >
< / li >
< li class = "" >
< a href = "/testimonials" > Testimonials< / a >
< / li >
< li class = "" >
< a href = "/talks" > Talks< / a >
< / li >
< li class = "active" >
< a href = "/blog" > Blog< / a >
< / li >
< li class = "" >
< a href = "/contact" > Contact< / a >
< / li >
< / ul >
< / div > < / div >
< / nav >
< div class = "container" >
< div class = "row" >
< main class = "col-md-9" >
< h1 > Install and Configure the Nomensa Accessible Media Player in Drupal< / h1 >
2017-07-11 18:57:51 +01:00
< p class = "posted text-light" > 14th July 2012< / p >
2017-07-10 22:28:39 +01:00
< p > < em > The official documentation for this module is now located at < a href = "https://www.drupal.org/node/2383447" > https://www.drupal.org/node/2383447< / a > . This post was accurate at the time of writing, whereas the documentation page will be kept up to date with any future changes.< / em > < / p >
< p > This week I released the first version of the Nomensa Accessible Media Player module for Drupal 7. Here's some instructions of how to install and configure it.< / p >
< h2 id = "initial-configuration" > Initial configuration< / h2 >
< h3 id = "download-the-library" > Download the Library< / h3 >
< p > The library can be downloaded directly from GitHub, and should be placed within you < em > sites/all/libraries/nomensa_amp< / em > directory.< / p >
< pre > < code class = "language-bash" > drush dl libraries nomensa_amp
git clone https://github.com/nomensa/Accessible-Media-Player sites/all/libraries/nomensa_amp
cd sites/all/libraries/nomensa_amp
rm -rf Accessible-media-player_2.0_documentation.pdf example/ README.md
drush en -y nomensa_amp
< / code > < / pre >
< h3 id = "configure-the-module" > Configure the Module< / h3 >
< p > Configure the module at < em > admin/config/media/nomensa-amp< / em > and enable the players that you want to use.< / p >
< h2 id = "adding-videos" > Adding videos< / h2 >
< p > Within your content add links to your videos. For example:< / p >
< h3 id = "youtube" > YouTube< / h3 >
< pre > < code class = "language-html" > < a href="http://www.youtube.com/watch?v=Zi31YMGmQC4"> Checking colour contrast< /a>
< / code > < / pre >
< h3 id = "vimeo" > Vimeo< / h3 >
< pre > < code class = "language-html" > < a href="http://vimeo.com/33729937"> Screen readers are strange, when you're a stranger by Leonie Watson< /a>
< / code > < / pre >
< h2 id = "adding-captions" > Adding captions< / h2 >
< p > The best way that I can suggest to do this is to use a File field to upload your captions file:< / p >
< ol >
< li > Add a File field to your content type;< / li >
< li > On your page upload the captions file.< / li >
< li > Right-click the uploaded file, copy the link location, and use this for the path to your captions file.< / li >
< / ol >
< p > For example:< / p >
< pre > < code class = "language-html" > < a href="http://www.youtube.com/watch?v=Zi31YMGmQC4"> Checking colour contrast< /a> < a class="captions" href="http://oliverdavies.co.uk/sites/default/files/checking-colour-contrast-captions.xml"> Captions for Checking Colour Contrast< /a>
< / code > < / pre >
< h2 id = "screencast" > Screencast< / h2 >
< div class = "embed-container" >
< iframe
src="https://player.vimeo.com/video/45731954"
width="500"
height="313"
frameborder="0"
webkitallowfullscreen
mozallowfullscreen
allowfullscreen>
< / iframe >
< / div >
< p class = "tags" >
Tags:
2017-07-12 07:22:51 +01:00
< a href = "https://www.oliverdavies.uk/blog/tags/accessibility" > accessibility< / a > , < a href = "https://www.oliverdavies.uk/blog/tags/drupal" > drupal< / a > , < a href = "https://www.oliverdavies.uk/blog/tags/drupal-planet" > drupal-planet< / a > , < a href = "https://www.oliverdavies.uk/blog/tags/nomensa" > nomensa< / a > < / p >
2017-07-10 22:28:39 +01:00
< div class = "post-pager is-flex" >
< div class = "is-half" >
2017-07-21 18:44:18 +01:00
< a href = "/blog/2012/07/12/my-new-drupal-modules/" >
2017-07-10 22:28:39 +01:00
« My new Drupal modules
< / a >
< / div >
< div class = "is-half text-right" >
2017-07-21 18:44:18 +01:00
< a href = "/blog/2012/07/27/writing-article-linux-journal/" >
2017-07-10 22:28:39 +01:00
Writing an Article for Linux Journal »
< / a >
< / div >
< / div >
< div class = "about-author" >
< h2 > About the Author< / h2 >
2017-07-12 07:24:51 +01:00
< img src = "//www.oliverdavies.uk/assets/images/me-precedent.jpg" alt = "Picture of Oliver" class = "img-circle" >
2017-07-10 22:28:39 +01:00
< p > Oliver Davies is a Web Developer, System Administrator and Drupal specialist based in the UK. He is a Senior Developer at < a href = "https://microserve.io" > Microserve< / a > and also provides freelance consultancy services for Drupal websites, PHP applications and Linux servers.< / p >
< / div >
< / main >
< div class = "col-md-3" >
< div class = "panel badges text-center" >
2017-07-21 18:44:18 +01:00
< a href = "https://assoc.drupal.org/membership" title = "I’ class = "is-block" >
2017-07-10 22:28:39 +01:00
< img
2017-07-21 18:44:18 +01:00
src="//www.oliverdavies.uk/assets/images/badges/da-individual-member.png"
2017-07-10 22:28:39 +01:00
alt="Drupal Association Individual Member"
2017-07-21 18:44:18 +01:00
width="200"
/>
2017-07-10 22:28:39 +01:00
< / a >
2017-07-21 18:44:18 +01:00
< div class = "is-flex align-items-center" >
2017-07-10 22:28:39 +01:00
< img
2017-07-21 18:44:18 +01:00
src="//www.oliverdavies.uk/assets/images/badges/acquia-d8-developer.png"
alt="Acquia Certified Developer - Drupal 8 Exam Badge"
class="is-2"
/>
2017-07-10 22:28:39 +01:00
2017-07-21 18:44:18 +01:00
< img
src="//www.oliverdavies.uk/assets/images/badges/acquia-d8-back-end.png"
alt="Acquia Certified Back End Specialist - Drupal 8 Exam Badge"
class="is-2"
2017-07-10 22:28:39 +01:00
/>
2017-07-21 18:44:18 +01:00
< / div >
2017-07-10 22:28:39 +01:00
2017-07-21 18:44:18 +01:00
< a href = "http://conference.phpnw.org.uk/phpnw17" class = "is-block" >
2017-07-12 07:24:51 +01:00
< img src = "//www.oliverdavies.uk/assets/images/badges/phpnw17.png" alt = "" >
2017-07-10 22:28:39 +01:00
< / a >
< / div >
< div class = "availability panel panel-default" >
< div class = "panel-heading" > Availability< / div >
< div class = "panel-body" >
< p >
< i class = "fa fa-thumbs-o-up text-warning" > < / i >
Currently have limited part-time capacity
< / p >
< p >
< i class = "fa fa-thumbs-o-down text-danger" > < / i >
Currently no spare full-time capacity.
< / p >
< / div >
< / div >
< div class = "latest-posts panel panel-default" >
< div class = "latest-posts__heading panel-heading" > Latest blog posts< / div >
< ul class = "list-group" >
< li class = "post list-group-item" >
2017-07-13 22:19:23 +01:00
< span class = "post__title" >
2017-07-21 18:44:18 +01:00
< a href = "/blog/2017/07/13/publishing-sculpin-sites-with-github-pages/" >
2017-07-13 22:19:23 +01:00
Publishing Sculpin Sites with GitHub Pages
< / a >
< / span > -
< span class = "post__date" > 13th July, 2017< / span >
< / li >
< li class = "post list-group-item" >
2017-07-10 22:28:39 +01:00
< span class = "post__title" >
2017-07-21 18:44:18 +01:00
< a href = "/blog/2017/06/09/introducing-the-drupal-meetups-twitterbot/" >
2017-07-10 22:28:39 +01:00
Introducing the Drupal Meetups Twitterbot
< / a >
< / span > -
< span class = "post__date" > 9th June, 2017< / span >
< / li >
< li class = "post list-group-item" >
< span class = "post__title" >
2017-07-21 18:44:18 +01:00
< a href = "/blog/2017/05/20/turning-drupal-module-into-feature/" >
2017-07-10 22:28:39 +01:00
Turning Your Custom Drupal Module into a Feature
< / a >
< / span > -
< span class = "post__date" > 20th May, 2017< / span >
< / li >
< / ul >
< / div >
< / div >
< / div > < / div >
< footer class = "container" >
< p class = "copyright" >
© 2010-2017 Oliver Davies. Built with < a href = "https://sculpin.io" > Sculpin< / a > .
< / p >
< div class = "meetups" >
< h2 > Things that I organise< / h2 >
< ul >
< li class = "meetups--drupal-bristol" >
< a href = "http://www.drupalbristol.org.uk" title = "Drupal Bristol" >
2017-07-11 07:34:02 +01:00
< img
2017-07-12 07:24:51 +01:00
src="//www.oliverdavies.uk/assets/images/meetups/drupal-bristol.jpeg"
2017-07-11 07:34:02 +01:00
alt="Drupal Bristol logo"
>
2017-07-10 22:28:39 +01:00
< / a >
< / li >
< li class = "meetups--drupalcamp-bristol" >
< a href = "http://www.drupalcampbristol.co.uk" title = "DrupalCamp Bristol" >
2017-07-11 07:34:02 +01:00
< img
2017-07-12 07:24:51 +01:00
src="//www.oliverdavies.uk/assets/images/meetups/drupalcamp-bristol.png"
2017-07-11 07:34:02 +01:00
alt="DrupalCamp Bristol logo"
>
2017-07-10 22:28:39 +01:00
< / a >
< / li >
< li class = "meetups--phpsw" >
< a href = "http://phpsw.uk" title = "PHPSW" >
2017-07-11 07:34:02 +01:00
< img
2017-07-12 07:24:51 +01:00
src="//www.oliverdavies.uk/assets/images/meetups/phpsw.jpeg"
2017-07-11 07:34:02 +01:00
alt="PHPSW logo"
>
2017-07-10 22:28:39 +01:00
< / a >
< / li >
< / ul >
< / div >
< / footer >
2017-07-12 07:22:51 +01:00
< script src = "https://www.oliverdavies.uk/assets/js/site.js" > < / script >
2017-07-10 22:28:39 +01:00
< script > ( function ( i , s , o , g , r , a , m ) { i [ 'GoogleAnalyticsObject' ] = r ; i [ r ] = i [ r ] || function ( ) { ( i [ r ] . q = i [ r ] . q || [ ] ) . push ( arguments ) } , i [ r ] . l = 1 * new Date ( ) ; a = s . createElement ( o ) , m = s . getElementsByTagName ( o ) [ 0 ] ; a . async = 1 ; a . src = g ; m . parentNode . insertBefore ( a , m ) } ) ( window , document , 'script' , '//www.google-analytics.com/analytics.js' , 'ga' ) ; ga ( 'create' , 'UA-11967257-1' , 'auto' ) ; ga ( 'send' , 'pageview' ) ; < / script >
< / body >
< / html >
