Attach Audio / Podcasting / Vidcasting / Image casting

From MODx Wiki

Tools you'll need. - I plan on doing a screencast of this sometime.

Ditto, MODx 0.9.5, ( a fresh install works fine) Flash mp3/video/imagerotator all available here http://www.jeroenwijering.com/?item=Flash_Video_Player

we'll use ditto for the rss feeds. and maybe other things,

Our goals: Add a player to each page lets say you have an article with each podcast or audio. (optional of course). to build an iTunes RSS/podcast from a folder of documents, with attached audio.

1. First make a TV (template variable) to hold our url to the mp3 file. Note: iTunes chokes on filenames with spaces, the flash mp3 player is fine, FYI. Name the TV "Audio" , and give it some sort of caption or description to your liking. Set input type to "File".

So now we can attach a raw url to any page / set the templates to be accessed in the "template access" section. I used both my main template and my front page one.

2 next we make a snippet to call the TV conditionally, in the page, no need to call it if there is no audio attached right? Code:

<?php
$output='';
 
$tvValue=$modx->getTemplateVarOutput('Audio',$modx->documentIdentifier);
 
if($tvValue['Audio']!='') $output.='<p id="player2"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</p><p><a href="'.$tvValue['Audio'].'">Download File NOW!</a></p><script type="text/javascript">
	var FU = { 	movie:"/assets/flash/mp3player.swf",width:"250",height:"20",majorversion:"7",build:"0",wmode:"transparent",
				flashvars:"file='.$tvValue['Audio'].'&repeat=False&showdigits=false&displayheight=0&lightcolor=0xb22450&backcolor=0x990000&frontcolor=0xFFFFFF&autoscroll=true" };
	UFO.create(	FU, "player2");
</script>';
 
return $output;
?>

ok , maybe that's confusing. Let's go through it.

This code checks for our TV called "Audio" if it exists, it prints the flash mp3 player to the page. In here is were you also can customize the flash player, lok into it's documentation or ask here.

Lets name this Snippet "AudioPlayer".

remember this line Code:

movie:"/assets/flash/mp3player.swf",

 We need to upload that file as well.  It's in the zip file for the mp3 player from our wonderful friend over at http://www.jeroenwijering.com.

3. One last thing to do and you'll have audio attached to a page. open your main template in the manager and add this to it AudioPlayer .. this will call the snippet, that calls the TV if present. and inserts a nice little player.

4. Ok lets PODCAST! Make a Chunk and call it "podcast" put this code in it. Code:

<item>
<title>[+title+]</title>
<link>[~[+id+]~] </link>
 
 
<itunes:album></itunes:album>
<description></description>
<pubDate>[+date+]</pubDate>
<enclosure url="[+tvAudio+]" type="audio/mpeg"/>
<itunes:author></itunes:author>
<itunes:subtitle></itunes:subtitle>
<itunes:keywords></itunes:keywords>
</item>

Sure maybe it could be trimmed. I'm no expert. in fact I figured this out only a few weeks ago.

This chunk is used as a template for ditto.

Save, pass go, collect $200!

5. Now the rss feed and Ditto call.

• Create a new document, "uses template" should say "blank". page type should be xml in page settings.
• Now paste this in there.

Code:

<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:itunes="http://www.itunes.com/DTDs/Podcast-1.0.dtd" version="2.0">
	<channel>
		
		<title>[(site_name)]</title>
		<link></link>
		
 
		<category>Audio Blogs</category>
		<language>en-us</language>
		<copyright>© 2007 </copyright>
		<generator>Wavestatic Studios</generator>
 
 
		<ttl>60</ttl>
 
      <itunes:author></itunes:author>
      <itunes:subtitle></itunes:subtitle>
      <itunes:category text="Audio Blogs">
			<itunes:category text=""/>
 
		</itunes:category>
      <itunes:summary></itunes:summary>
      <itunes:owner>
      <itunes:name></itunes:name>
      <itunes:email>podcasts@herplaceradio.org</itunes:email>
      </itunes:owner>
      <itunes:explicit>no</itunes:explicit>
		<image>
 
			<url></url>
			<title></title>
			<link></link>
		</image>
		<itunes:image href="" />
[[Ditto?&startID=`50`&summarize=`5`&total=`5`&tpl=`podcast`]]
</channel>
</rss>

Set the startID to the folder where you are going to put your podcasts.

Some tips: if you are getting xml parsing errors, change the page type to html and debug from there.

A working example is here http://herplaceradio.org and now http://lifechurchmn.org/home

Using similar code and steps you can do the same with video or images. on the lifechurch page I do just that, I have a image banner that is controlled by MODx, so I can have publish and unpublish dates.. SCHWEET!