It’s been a while since I did some WordPress hacking, and today I think it showed. Like a good bone I could not let go of a niggling little problem, and then after going around in circles, I found an obvious way that was much more simpler than where I was headed.
But there are things even learned in a few trips around the roundabout.
Here’s where I drove around in circles today… for a while, I have been publishing web versions of the NMC Horizon Reports in CommentPress format at http://wp.nmc.org — this is very useful for publications since it allows comments to be attached to individual paragraphs, so they are tied at a more micro level to the content. (Yeah they are in the old CommentPress mode, I know I should be using the newer digress.it and am ready to publish the new one there this week).
Since Mobiles have been part of the Horizon Reports since like 1776, and there is the nifty WPtouch plugin that elegantly makes WordPress sites display cleanly on not just iPhones, but other mobile platforms (my first play was last year and I have rolled into most of my WordPress sites).
So I decided to play a few minutes (hah) with the 2010 Horizon Report web version
And here was my first wrong turn in over thinking it.
You see, CommentPress really turns the regular blog publishing model a bit inside out. What I had been stuck on is that when CommentPress publishes its list of “chapters” or “sections”, each essentially a blog post, they end up being listed in the order they were created (preface, than chapter 1, then chapter 2….)- in fact the reverse of a regular blog where posts are listed in reverse chronology.
So I felt I needed a way to manipulate the WordPress Loop, the magical hub of WP. The mythical Loop.
I found where the content is formatted in WPtouch, inside the plugin folder is a themes folder and then a default folder where there are the theme files used to format when the content is detected on a mobile. A lot of it is stuff you should never deal with, but there is your basic Loop in action:
if (have_posts()) : while (have_posts()) : the_post();
Even knowing PHP it is not exactly clear what happens, but before any template loads, the basic WordPress runs a WP_Query call (the thing that finds stuff in your database) in the basic mode- gets stuff in reverse chronological order. If it is the front page, then it is recent posts; if it is a category page, same, but only for blog posts in that category, etc.
It says something like:
“Hey, do I have any posts (things)?”
“If so, cool! Then lets walk through them one at a time and do something to them.”
“For the current one I am looking at, lets do….”
First of all, I create a new wp_query() to replace the standard run through the database:
$my_query = new WP_Query('order=ASC&posts_per_page=-1&orderby=date');
I am now telling it to fetch things differently- first off all to return all the posts (posts_per_page=-1) so I get all of the posts for a table of contents default view, and most importantly, list them in order of date ascending (oldest first).
Then I simply replace the standard The Loop with this similar code:
if ($my_query) : while ($my_query->have_posts()) : $my_query->the_post();
The Homer doh! moment came when I was setting up the WPtouch settings- you have to indicate on the mobile what should act as the “home” view:
You see, in running CommentPress, you do not use a standard blog index page for the default.home view- it uses the About Page. So my clever blog re-ordering was for naught. In the iPhone, the Wptouch version presented the About Page, but because CommentPress uses a custom template, the navigation links to the other section (and the sidebars) never show up.
But I did notice that the category view I use for all posts did display in reverse reverse chronological order, so I thought about using http://wp.nmc.org/horizon2010/category/chapters/ as a table of contents (on the web you only get 5 posts, but with my custom loop replacement, I got a listing of all posts (since this is my default category).
So I came up with a new idea- make a new WordPress page, call it Table of Contents, have it be a landing page for the WPtouch settings, that had a link to the Category Page Acting Like a Table of Contents — and it sort of worked.
But it seemed like extra clicks to get there.
And then I came completely around the circle, almost. All my theme hacking was un-necessary. I reverted the WPtouch default template to what it came with.
Rather then trying to get fancy to have WordPress automatically generate something to act like a table of contents (by messing with the blog post order) I went more static. These sites dont add new posts once they are done- they are just sections fo a paper- so the flash of insight was just to copy the HTML for the left side listing of chapters on the web version, pop that into my stub Table of Contents page.
And now, you can see the final version by using your mobile to go to http://wp.nmc.org/horizon2010
This page is never used or linked on the CommentPress web version, but it does become the “home” page on the iPhone version:
and scrolling down below the pretty cover photo, you get a clean looking Table of Contents:
And from there a clean mobile version of one of the chapters (there are link buttons at the bottom to get to the next article, plus Home buttons to return to the index.
Of course, in the phone, there is no equivalent of the CommentPress comments on each paragraph, though you can post a comment on the entire text in the chapter, and see all comments added.
It’s not bad, and what I like is having a mobiel version of these documents without having to create all new content, this is generated by what I do already to publish them online. No special single platform app is needed either.
I’ll be rolling this into all of the previous versions of Horizon Reports (six on the site) plus maybe another 8 CommentPress papers there as well. Just because I can.
And once I work tomorrow with digress.it, I will be curious to see how it flows into the WPtouch rendering on a mobile.
And that was my not so little bit of tail chasing today….