DIY Podcasting on Wordpress
a resource in How-tos| Sermons| Tech
We use wordpress to run my Church’s site including the sermon podcast, and being the geek that I am (!) I set it up myself.
I could have used a plugin such as PodPress or Sermon Browser, but I decided to do my own thing! So I thought I’d share how I did it. It’s a bit geeky, but rather nice!
It uses a few Wordpress plugins, some javascript and some custom Wordpress templates!
First of all I use a category called ‘Sermons’ and every sermon is a new post within that Category. I then use Category Templates to change the way that the Sermons cat looks, so I can have an audio player, etc. of the posts just for that cat.
If you’ve not come across Category Templates before, they can be very useful. You can custom design and name template files so category/archive indexes and single posts within that category are then used by WP automatically.
For category/archive indexes the template files are named like category-X.php (X being the ID of the category).
For single posts within a category it’s single-cat-X.php . (You need the ‘Post Templates by Category‘ plugin to get it to work for single posts.)
So that way I can have the category index and single posts for sermons looking just how I want them!
The main plugin used is called ‘Get Custom Field Values‘ and it allows you to put information in Wordpress ‘Custom Fields‘ into posts/category archives.
When adding a new sermon, I use a ‘custom field’ called ‘enclosure’ and enter the url of where I’ve uploaded the MP3 file.
So in my template files (both custom category index and single) I use the custom field twice and have:
<ul>
<li class=”player”><a class=”media” href=”<?php echo c2c_get_custom(‘enclosure’); ?>”>Listen to the Sermon</a></li>
<li class=”download”><a href=”<?php echo c2c_get_custom(‘enclosure’); ?>”>Download the Sermon (mp3)</a></li>
</ul>
So it looks like it’s just going to put display the link to the sermon MP3 file twice, but it doesn’t! Because the top one displays an online player.
For the online player I’ve used the excellent jQuery Media Plugin to do all the player embedding and coding for me. It’s having the class of ‘media’ on the link which kicks the media player into action! (jQuery, is a javascript library that can make doing nifty things with javascript much simpler!)
If you want to display the date archives in a list in the sidebar, but only want to show them for a certain category (which makes sense in this case), the ‘Archives for a category‘ plugin is excellent.
I can then take the feed for just the sermons cat (in my case it’s http://www.minehead-baptist.com/category/sermons/feed) and run that through the wonderful FeedBurner to burn the podcast feed. It them becomes the feed for the sermons & podcast: http://feeds.feedburner.com/MBCSermons
On my site you’ll notice that the date archives in the sidebar and ‘How to listen’ sections are toggled/faded up and down by clicking on the relevant link. This is also done using jQuery. As I’m already loading the jQuery library to make the media player work, I can also use it to do the toggles!
The html for the toggles and links is:
<p><a href=”#divtotoggle” class=”toggle”>Link to Click</a></p>
<div id=”divtotoggle” class=”toggle”>
<p>The additional information to show goes in here</p>
</div>
And the javascript (best placed in a seperate .js file linked in the <head> section) is:
$(document).ready(function(){
// hide all reveals
$(‘div.toggle, li.toggle’).hide();// toggle reveals
$(‘a.toggle’).toggle(function(){
var toggle = $(this).parent().next(‘div.toggle, li.toggle’);
toggle.fadeIn();
}, function(){
$(this).parent().next().fadeOut();
});});
This looks for links with the class of ‘toggle’ and toggles the next <div> or <li> it finds that also has a class of toggle.
I hope that’s not too confusing!
I know it sounds complex, but it isn’t really and I can add a new podcast post in about a minute!
If you’ve got any questions, please let a comment!
Leave a Comment/Review