Skip to main content

Audio Detail Page Template and Audio Player

The Audio Detail Page is used to discretely house an audio file and any supporting content to that audio file on your site.  Housing each audio file on your site on its own Audio Detail Page in addition to embedding the audio player throughout your site content helps to drive additional content interaction for related rich media on your site, as well as create additional content pages that can provide SEO benefits.  Each audio file on an audio detail page can be assigned to a larger collection, or stand alone and be part of the overall rich media gallery for the site.

Additionally, audio players can be embedded throughout site content so that users can play audio files provided by your brand.  CANVAS supports .MP3, .MP4, .WMV, .FLV, and .WEBM file types and a 50% or 100% width audio player can be used.

See a demo of this template - 100% Width

See a demo of this template - 50% Width

When To Use This Page Or Component

The Audio Detail page should be used whenever you have an audio file on your site.  The Audio Player should be used to play audio files that you want users to listen to on your website.


Audio Detail Page Default Template Components

  • Breadcrumb - A series of clickable links that display the navigational path to the current page.
  • Audio Player - A 50% width or 100% width audio player can be selected to display on this page
  • Social Share (Where Applicable) - The ability for users to share content with their friends and followers on supported social networks
  • Media Collection Teasers (Where Applicable) - For audio files that are part of a collection, teasers are auto generated and displayed for other rich media that is part of that collection


The following components are also available by default within the Audio Detail Page template.

  • Audio Description - Area used for description of the audio file on the page. 


Additional Optional Template Components for the Audio Detail Page

  • Related Content Component - Display related content teasers
  • Approved Tout Combination - Use any approved combination of touts that adds up to 100% of the content area
  • Embedded Poll - A poll can be placed anywhere a tout can be placed 


Audio Player Default Component Elements

  • Play or Pause Button - To play or pause audio
  • Elapsed Time - To show time elapsed in the played recording (default time at 00:00)
  • Progress Bar - To change the position within the audio recording while playing or pausing
  • Volume Icon - To mute or enable audio sound
  • Volume Level Bar - To adjust volume while playing or pausing (default volume at 50%)


Design Details

These helpful diagrams highlight key components across the three Canvas viewports. Components are either required or optional; some can be adjusted, while others must remain as-is.


Template PSDs & PSBs

Access the PSD & PSB files for your Audio Detail Page Template and Audio Player.

Template PDFs

View the PDF files for your Audio Detail Page Template and Audio Player.

See examples of page layouts, features and functionality in CANVAS.

Our demo provides a glimpse of the flexibility of CANVAS and its templates.