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):



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.

I then used


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 manually adding these feeds to BDP RSS as I have gone along, I have been following closely so it hasn’t 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 that 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 code base. 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.

This entry was posted in widgets and tagged , , , , , , , , , , . Bookmark the permalink.

19 Responses to Creating a dynamic frontpage for WPMu

  1. Eric P says:

    We have been looking for options to do just this at the University of Richmond. Thanks

  2. Russ Cobb says:

    Great post, Jim. As we play catch-up with other colleges & universities, this kind of resource will be extremely helpful.

    UMass Amherst, just down the road from us, recently rolled out their WP MU service after 8 months of beta. I especially like their ‘Getting Started’ doc as well as their explanation of what Beta means and why the beta testing period was necessary.

    http://www.oit.umass.edu/web_hosting/blogs/index.html
    http://blogs.umass.edu/

  3. jimgroom says:

    @Eric,

    Glad my timing was good. Let us know how it is going there.

    @Russ,

    Thanks for the link to the UMass WPMu install. I love to see these things in action. I’ll be sure to keep the love coming.

  4. Pingback: Administrative Faculty Theme » Customize the WPMu Dashboard

  5. Russ, how on earth did you do that great directory? Is that a WPMU plugin? The source for the page didn’t smell of WP at all – is this a separate app that dumps the directory?

  6. Russ, sorry – I misread your post. I now realize that you didn’t build the directory, and that it’s at a campus down the road from yours. Doh. I’ll keep poking around to try to find contact info at umass.edu, but so far all I’ve found are online forms that require a UMass ID to submit messages…

  7. Pingback: Wordpress Mu Dynamic frong page-BMC style | ETC@BMC

  8. codersteve says:

    Hey Jim,

    Is the school hosting your UMW blog site or is it by a 3rd party hosting company?

    I want to set one up for my school.

    Thanks,
    Steve

  9. jimgroom says:

    hey codersteve,

    The UMW Blogs sites is hosted externally as is this site. It doesn;t cost us much given the functionaloty we get, and I have to say it is really easy to use and finesse. And given your handle is codersteve, it should be a cinch for you, given I find it relatively simple and I am just a hack 🙂

  10. suleiman says:

    Hey Steve,

    I see you are using my WPMUAvatar Pack on one of your sites, and am happy to know you are making good use of it!

    If you’d like to take an example of my attempts at a dynamic homepage, you should be sure to visit my Muslim Blogs community homepage.

    I’ve put a fair bit of time into mixing clever scripting and WPMU built in features.

    Hope you like it!

    -Suleiman.

  11. jimgroom says:

    Suleiman,

    I have been following your work on the WPMu forums, and you’re an amazing source of innovation, so thank you! Your WPMu installation at Hadithuna is absolutely awesome. You have tricked it out beautifully, and I have yet to see WPMu community that offers so many features. You do fine work, and the mission of your community couldn’t be more important in this day and age, so hats off to you!

  12. Simon Thulbourn says:

    @jimgroom

    How did you do the global tagging on UMW Blogs?
    I’ve been looking around the internet, but I can’t seem to find any plugins that jump out at me.

  13. jimgroom says:

    Simon,

    If you are using the latest version of WPMu (1.3.3), try the MuTags plugin. It works well for me, but others have had issues, but it makes creating a tagcloud of all the blogs on a WPMu install as easy as can be.

  14. Simon Thulbourn says:

    Jim,

    I’m not sure how I actually implement this plugin, after reading the read me that came with it, I’m still no closer to getting it to work.

    I have tried installing it in mu-plugins and activating from the plugins page (when installed from /plugins)

  15. jimgroom says:

    Simon,

    If you are referring to BDP RSS, it goes in the plugins folder, not the muplugins folder. From there you activate it and control the settings under the Manage–>RSS Feeds subtab. From there all this stuff should make sense. if it doesn’t, let me know.

    Jim

  16. Giorgio says:

    Wow wonderful work and thank you for sharing !!

    I will share your post on my social bookmarking site!!

    You will see it on http://www.conferenzastampa.com/bookmarks

    REALLY THANKS !!

  17. Pingback: Irie Blogs » Blog Archive » Irei Blogs gets Dynamic Front Page

  18. Pingback: links for 2009-01-20

  19. Ying says:

    It seems BDP RSS aggregator plugin is not available any more. What other plugin should I use?

    Thanks,

Leave a Reply

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