Marco.org

John Voorhees tweeted:

Podcasters: If you use a Squarespace player for a new show, add a download link so I can try via Huffduffer before subscribing. See @atpfm

It’s non-obvious, so here’s how we do it. In your site settings, under Code Injection, I added this Javascript block to the Footer section:

<script type="text/javascript">
  (function(){
    var i, postBodies = document.getElementsByClassName('entry-content');
    for (i = 0; i < postBodies.length; i++) {
      var audioBlocks = postBodies[i].getElementsByClassName('audio-block');
      if (! audioBlocks.length) continue;
      var audioEmbed = audioBlocks[0].getElementsByClassName('sqs-audio-embed')[0];
      var fileURL = audioEmbed.getAttribute('data-url');

      var pNode = document.createElement('p');
      var aNode = document.createElement('a');
      aNode.setAttribute('href', fileURL);
      aNode.appendChild(document.createTextNode('Download MP3'));
      pNode.appendChild(aNode);      
      postBodies[i].appendChild(pNode);      
    }
  })();
</script>

You can see the resulting “Download MP3” link on any ATP episode.

Previously, I used this script to pull the episode file size and playback duration out of one of the Squarespace data- attributes and display them, too, but a change by Squarespace a few months ago removed that information from the markup.

Update: Squarespace Guru says that this only works if the audio element is the last block in the post.