Creating a dynamic frontpage for WPMu

For anyone interested in the dynamic homepage of UMW Blogs, this post may be of some interest…

Part of what I started thinking about when working on UMW Blogs this Summer was how to capture some of the activity going on throughout the various blogs on the front page or the “motherblog” -to steal a saying from Barbara Ganley. The default Kubrick theme that comes stock with WPMu is pretty uninspired, but we really don’t have a dedicated graphic designer or programmer at DTLT. So while I have seen a
number of sites like edublogs and WordPress.com that have done a great job of taking a snapshot of their community, I really had no idea where to start aesthetically or technically, so I started with the simplest possible solutions: the MistyLook theme for WordPress and the BDP RSS aggregator plugin.

UMW Blogs RSS

Why MistyLook? Well, because Andy Rush had found a skin for this theme that works with MediaWiki (great to store documentation for UMW Blogs), it has clean code/CSS, a built-in contact form template, not to mention that I am relatively familiar with hacking it.

Why BDP RSS? Because it’s a pretty straightforward and powerful aggregator plugin that works with WPMu and offers a host of options for customizing a series of RSS feeds that can then be fed in from numerous blogs throughout the environment. Additionally, there are three widgets (Updated Blogs, New Blogs, and Active Blogs) that also give users a quick snapshot of activity in the environment from the front page; these widgets (titled List All widgets) are available here.

So how do you create a dynamic front page for your WPMu installation using BDP RSS? Here’s how…

(This is the first installment of a series of how-tos for building a virtual learning environment with WPMu)

Hacking a Virtual Learning Environment 3: WPMu as an open source publishing platform for teaching and learning
Building an RSS fueled dynamic homepage for WPMu

The key to creating a dynamic front page consists primarily in mildly hacking a front page template for your theme. I’ll quickly take you through the following: 1) how to build a specific template page for your WPMu front page, 2) setting-up BDP RSS, and, finally, 3) including the PHP calls for BDP RSS feeds.

Step 1: How to Build a specific template for your front page

a) Hacking a WordPress theme template is fairly straightforward. I highly recommend you go ahead and grab the Userthemes plugin for WPMu and copy the theme you are going to hack to a separate file. This will protect the original theme for whomever wants to use it in the community, while allowing you to save your own hacked version to your own files (more than that you can edit them from within the administrative backend!).

Go to the theme you want to hack (I will be demonstrating using MistyLook and note that all themes are not created equal so you may want to do some research to make sure your theme is up to the challenge) and grab the page.php file. Open it up and add the follwing code to the very top of the file (above all other code):

<?php
/*
Template Name: Front Page
*/?>

This bit of code will create a unique template titled Front Page. You should save your modifcations as a new file, say “front_page.php” and upload it to your particular theme folder. Be sure to keep the original file page.php in your theme folder unchanged. Once you have done this you now have a distinct template for your front page that we will be mildly hacking. Pretty easy, right?

b) Next step is to create a static page and select this template for that page. For example, on UMW Blogs, the page I created with this template is called Welcome and you can see below where to select the new template you created:
writepage_template
Save the page. You may also want to create another page like news or announcements which could act as a kind of meta-blog, or your blog about the blogging community. This will make more sense soon.

c) Go to the Options–>Reading tab and make “Welcome” (or whatever you named your front page) the Static front page and make the blog page (News, announcements, etc.) the page for your posts. Click the update options button and we’re done with step one.

Static Front page reading

Step 2: Setting up and a quick overview of BDP RSS
Ok, quick and painless so far, and you are starting to say to yourself, damn I love how easy WordPress is…that’s right baby, feel the joy. Now to take advantage of the sickest plugin community going, bar none!

The BDP RSS aggregator was designed by the OZ Politics blog and for a pretty unassuming plugin it has an amazing amount of customization options, archival ability, and it even gives you a single feed off of numerous different feeds, acting somewhat like an OPML feed generator, though not really.

Once you have uploaded and activated this plugin you can find the “control panel” under the Manage–>RSS tab in your administrative backend. You will see the following (save the feeds).

BDP RSS Overview

a) The BDP RSS interface is fairly intuitive, and it will allow you to bring in a number of feeds with relative ease. Important note: While the directions suggest you need to add multiple feeds with commas, I found that this balks, and that you need to add multiple feeds with space between feeds only. If you add several feeds you will see that they can be polled (or called from that site), edited, or deleted (you also have the option to delete all the feeds as well as poll all the feeds).

b) Next up, once you have imported several feeds you’re gonna need to edit the format output, in other words you need to determine which feeds you are going to bundle together and how you are going to display them -this is where BDP RSS truly blows away all other aggregation plugins I have come across.

Output formats BDP RSS

Above you see the four different outputs for UMW Blogs. Each of these have different format outputs. For example, the UMW Sitewide Feeds are the five most recent posts that show up on the front page as titles and teasers (no images, videos, etc.). The UMW Sitewide Full Page is a page full of feeds from around UMW Blogs that are all entire posts along with images, links, and other formatting options. The UMW Sitewide Full Page also takes advantage of the archive feature of BDP RSS (more on this soon) which you can see in action at the bottom of this page. So, the format outputs allow you to take a series of feeds and format them according to what you need to do.

Let’s take a closer look at the formatting outputs page.

Edit output BDp RSS

You’ll see right away here that each output format has its own unique identifier, the one above is the number 1. This will be important when we include the appropriate PHP call in the template theme, so keep this in mind. As you can see, you can name each output format and decide how you want the feeds to show up, I often choose “List by most recent,” because most of what we are doing is tracing the blogs over time. You’ll also notice that their is a check box for “List all Sites.” This is the default, and I often uncheck this and pick and choose which sites will be featured for the UMW Sitewide feeds, most of which are specifically classes that are blogging regularly.

Once you have checked your sites, you can also decide what specific text formatting you want for the posts, how many posts you want to show up at any one time (for the front page of UMW Blogs most recent posts it is five, for the full page of recent posts it is 50), how much text to display, images, links, blockquotes etc. Like I said, it is amazingly customizable.

After you’re done with these options there is yet another two options that I find quite useful.
I) Archive Listing: This will basically create a series of dated links at the bottom of your feed page that will store the respective posts in the appropriate date. An RSS archive of sorts, simply awesome!

RSS Archive BDP RSS

II) RSS Feed from List: Additionally, you can create a feed from all the different RSS feeds you decide upon in an output format, which will allow folks to subscribe to your particular concoction of RSS goodness. Yet another gem!

RSS Feed for List BDP RSS

Ok, so now that we have taken the long overview of setting up and getting familiar with BDP RSS, lets take a look at putting some of the aggregation we outlined above into action.

3) Including the PHP calls for BDP RSS into your custom front page template

So, here is the big payoff, how do we make the front page of our WPMu site dynamic? Well, now that we have a custom template and we have a better sense of BDP RSS, this last step is pretty simple. Each output format has a unique identifier, as we said above. This is crucial to selecting the right series of feeds and the proper formatting you specified in BDP RSS. Given that, we need to go to our custom template now, and look at how we might integrate the BDP RSS PHP calls into this template.

BDP RSS Template Small
Click on image for larger version

As you can see from the image above, entering PHP code like what follows will aggregate posts from the feeds you specified in the RSS aggregator. <?php bdprss2::output(1) ?>

I then used <hr> tags (horizontal rules) to separate the sections and violá, we gave a dynamic front page that has a featured blog section, the five most recent posts, and the feed from the News blog all in one empty page. RSS is truly amazing!

Now, I have to acknowledge one of the limitations of BDP RSS (which I shouldn’t really complain about because the plugin is both awesome and free), it chokes on category feeds for WordPress and it seems to balk on the site wide feed for WPMu, which is as follows if you have the sitewide feed plugin from IT Damager:
http://umwblogs.org/wpmu-feed/

So, I guess there is one drawback, not to mention that I have been manualll;y adding these feeds to BDpRSS as I have gone along, I have been following closely so it has seemed like much work, but I think it could get overwhelming over time. That said, it has been pretty amazing for allowing for a dynamic space on the front page of UMW Blogs to trace the amazing work tht is being done.

What’s amazing to me about all this is that I am not a PHP programmer, nor am I intimately familiar with the WordPress codebase. Rather, I am simply a scavenger that was able to take some freely available tools and make them do the evil bidding of the good Reverend.

Share This

This entry was posted in Hacking a Virtual Learning Space, MistyLook, rss, tutorial, widgets, wordpress mutli-user, wordpress.com, wpmu. Bookmark the permalink.

7 Responses to Creating a dynamic frontpage for WPMu

  1. James Farmer says:

    Great post – thanks for sharing your experience and ideas!

  2. Mus_ says:

    nice tutorial.

    But i have no idea how to stop showing Hello World posts.
    Can u help me, please?

  3. Jim says:

    Hi Mus_,

    I’m not sure if you can stop Hello World posts from showing up when using the sitewide feed. One thing I have been experimenting with is using the aggregator BDP RSS to bring certain post onto the frontpage, then using the widget/plugin by Andre Malan to allow users in the community to add their feed to the front page, so you don;t have to highlight everything in the WPMu account. Does this make sense?

  4. Jim says:

    Also, the version of this tutorial with images can be found here, I have moved the original site, and the image links need to be uploaded, my bad.

    http://bavatuesdays.com/creating-a-dynamic-frontpage-for-wpmu/

  5. Mus_ says:

    thanks, Jim!

    You are amazing.

    Take a look at my website. http://orangbiasa.com/
    an indonesian free blog provider build with WPMU.

    but it’s still beta now.

  6. Billy Dennis says:

    Let me be completely clear here:

    ALL that I want to do — ALL — is create an opening page for my WPMU blog that shows excerpts of the 10 most recent blog posts on member blogs, and the 10 most recent comments.

    Almost all the advice I get on the WPMu forum has assumed that I’m very familiar with writing PHP. I am not.

    Frankly, I am amazed that this doesn’t come out of the box with WPMu.

    Will this plug-in let me accomplish that with a little cut and paste of code into a new template?

  7. Reverend says:

    Hi Billy,

    BDP RSS along with IT Damager’s Site Wide Feed plugin should give you everything you need. Now you will still have to hack a theme, and put in some php calls, but you won;t have to write code. You can search for this same post over at http://bavatuesdays.com which has all the images (when I moved my nother blog the images broke and I have been too lazt to update them here).

    Let me know if you need help:
    jimgroom_at_gmail.com

    Best,
    Jim

Leave a Reply to Mus_ Cancel reply

Your email address will not be published. Required fields are marked *