It came as quite a shock a few weeks ago, when I realised Puffbox Ltd was fast approaching its fifth birthday – specifically, the fifth anniversary of its incorporation at Companies House. Perhaps because I’m a parent of two young girls, five years feels like a significant milestone: it’s the age at which a child starts ‘proper’ schooling, and begins the journey down the long road to adulthood. It also marks the longest time I’ve ever stayed in a job.
Over those five years, I’ve learned to go with the flow. When I started Puffbox, the plan was to offer advisory services to government and/or large corporate clients. But I soon realised that people weren’t short of advice: what they needed were people who could actually be trusted to make stuff. And you may find this hard to believe, but I didn’t start out with an attachment to any particular technology platform either.
I’ve also learned that I’m good at spotting the currents within that flow. Looking back, I’ve done pretty well at picking out the technologies – and just as importantly, the people – who were going to have real, lasting impact in my field. Occasionally I find myself trawling back through my blog archives, nervously checking to see if I dismissed something (or someone) which went on to be huge… and to my great relief, finding very few examples thereof.
A couple of years ago, I could see that people’s perception of me was changing. I used to be a government person who happened to know a bit about WordPress. I’m now a WordPress person who happens to know a bit about government. Perhaps that’s inevitable, given that it’s six or seven years since I was last a Civil Servant. Maybe it’s pure coincidence that it coincides (broadly) with the 2010 general election, and the ushering-in of the new order. Maybe it’s a mark of the growing maturity of my chosen technology platform, and the community around it.
And so, once again, it’s time to let the flow take me somewhere new.
I first met Simon Wheatley at the first UK WordCamp, back in 2008. His presentation on WordPress plugin development was truly fantastic: it was the first time anyone had explained the process in terms I could understand. His code wasn’t bad either. I started to bring him in to help on projects which were beyond my own technical capability – like DFID’s blogs site, launched three and half years ago, and still going strong.
As many of you will know, for the last couple of years, we’ve been working as a partnership in all but name. Nearly every large-scale job has been a joint effort. We speak the same language; in a lot of areas, our skills and experience complement each other beautifully; and he’s very understanding, when I commit heinous crimes against web development.
So last summer, after much beating around the bush, we agreed it was time to formally merge our operations, into a new and explictly WordPress-centric business. Our projects are reaching a scale where they need more than a ‘one man band’ to support them. It will be more reassuring to clients – and indeed to ourselves! – if the two of us are legally bound together, and it gives us a platform upon which to build a proper company, whatever that means.
On 25 January this year – a date we chose deliberately – Simon and I formed that new company: Code For The People Ltd. And with the start of the new tax year, and the closure of several public sector projects, now is the time to activate it.
The name is deliberately provocative. It’s a statement of our confidence in the open source business model, and our belief in building websites to suit the people who will use them – and indeed, those who will run them – rather than the technology. It’s also a commitment to keep giving back to the community of which we’re a part: you’ll note, for example, that Mr Wheatley’s name features once again on the Credits for the forthcoming WordPress v3.4 release.
What does this mean in practice? At least to begin with – and who knows what’ll happen after? – things will continue as they always have done. It’ll be me, Simon and a handful of hand-picked contacts, doing the same basic things, in the same basic way. Any projects or contracts which were started under the Puffbox name will be completed in the Puffbox name, and will be invoiced as Puffbox. However, any new work will be in the name of Code For The People. Once all our current contracts reach completion, Puffbox Ltd will bow out gracefully.
I’ve spoken in the past about retiring from the front line: I just can’t see myself coding into my 40s, and with various new things coming along – responsive design, HTML5, LESS – now seems like a good time. The new company obviously gives me a path towards that exit, but I doubt it’ll be happening any time soon.
We’ll still play our part in the ‘gov geek’ community. We’re already quietly working on a couple of big government jobs, for delivery in the next couple of months. And yes, puffbox.com will continue as my personal blog, with a particular focus on government and politics. But we’re doing more and more work outside government these days; and for the moment at least, I don’t feel government needs us in the way it did a year or two back. (And to be quite frank, it told us as much at this year’s UKGovCamp.) Mission accomplished? – maybe, maybe.
To all those who have inspired, supported, contributed to and done business with Puffbox Ltd over the last five years – from the bottom of my heart, thank you.
We’ll be launching Code For The People’s website shortly, as soon as we decide what technology to build it on (joke). In the meantime, you’ll find us on Twitter at @cftp
Category: company
Bilingual maps with a WordPress custom post type
Puffbox’s longest-standing working relationship in Whitehall is with the Wales Office; it was there, don’t forget, that the whole WordPress-in-government thing started back in late 2007. We moved them on to a multisite setup just before the 2010 general election; and we’re seeing the benefits, through sites like the one we launched in November for the Commission for Devolution in Wales.
They’re about to start a round of public engagement events, and they asked us if we could add a Google Map to the site… which, of course, is bilingual, English and Welsh. It’s not rocket science these days, but it’s probably the smoothest implementation I’ve done, and I thought it might be worth sharing.
We’ve defined ‘event’ as a custom post type, non-hierarchical (ie more like posts than pages), with a full set of fields. It gives the ‘more info’ pages a nice URL, and keeps them nicely self-contained, with benefits for both admin interface and template access.
We’ve then added a ‘metabox’ to the ‘edit’ screen, for the various elements which define an event: basically date, time and location. When you click into the ‘Event date’ box, you should get a popup jQuery-based calendar – but if you don’t for some reason, or if you’re a keyboard wizard, you can still enter it manually. We’ve left the ‘time’ field freeform: we didn’t plan to do anything too clever with the event times, and besides, times are often rather vague.
I’m quite pleased with how we’re doing the location. We ultimately want two things: a text-based name, which should make sense to humans rather than computers; and an exact geolocation, ideally latitude and longitude, for the machines. So, looking down the page, first thing you come to is a text search box. If you know the address, particularly if you have a postcode, you can enter it here; then click ‘find on map’. This sends the query to Google, and makes a best-guess for the precise location, indicated by the crosshair hovering over the centre.
Google’s guesses are usually pretty good, as you’d expect. But you can fine-tune them by dragging the map around – even to the specific building. And every time the map moves, whether via the search or via dragging, the coordinates update automatically.
The text name and the coordinates are saved separately – which means, once you’ve pinpointed your venue, you can then go back and edit the text-based name, to make it less of a search query, and more of a human-friendly description.
That gives us enough data to put the markers on the map – with accuracy down to a few metres if you’re so inclined! – and to generate some meaningful text content too, in the form of a table and stand-alone page. And yes, we’ve got all the info in both English and Welsh – although this site predates our work on Babble, so it uses WPML. (I say ‘all’: it turns out, Google Maps doesn’t do Welsh.)
Finally – and you’ll have to take my word on this, for the moment – as time passes, and events take place, they start to appear ‘greyed out’ on the map. We’re using the Google Chart API to generate the map markers, and it’s dead easy to change the base colour in the javascript. (The rows in the table get ‘greyed out’ too.)
Like I say, it’s not rocket science. But it’s always a joy when you can hand what is actually quite complex functionality over to a client, and it just works*.
Free Speech Debate: our most ambitious project ever
Since last spring, Mr Wheatley and I have been working with Guardian columnist Timothy Garton Ash, in his role as Professor of European Studies at St Antony’s College, Oxford on a project called Free Speech Debate. It’s been the main focus of my attention for the last six months or more – which explains why the blog has been rather quiet of late.
As the name suggests, it’s a site for editorially-led discussions on issues of freedom of speech, in today’s socially-networked world. And as you might expect from someone so well-known and well-connected, the Professor has managed to secure contributions from a host of famous names in the field, from around the world – from Jimmy Wales to Max Moseley, not to mention numerous writers, and the odd Nobel Prize winner.
We’ve done similar ‘editorially-led discussion sites’ for numerous clients in the past, but never anything on this scale. You see, one of the site’s ‘ten draft principles’ includes the right to speak in your own language. So we had little choice but to publish in multiple languages. And yes, that includes the difficult ones too.
The site went live initially in English-only. But in the last week, we’ve rolled out German, Turkish, Spanish and Chinese… with Arabic, Farsi/Persian, French, Hindi, Japanese, Portuguese, Russian and Urdu to follow shortly.
Our original plan was to use the WPML plugin for WordPress: we knew it had weaknesses, but it was the best of a disappointing bunch. However, for reasons I won’t go into here, we subsequently decided to write our own plugin, based on modern WordPress features such as custom post types and taxonomies. It’s called Babble; and I’m delighted to say, as soon as we’ve tidied it up a bit, we’ll be open-sourcing it.
The way we’ve implemented Babble on FSD, you enter each post (etc) in the site’s default language first, then – using a menu added to the Admin Bar – you can ‘create’ a translation in any of the languages you’ve enabled on your site. All the metadata – taxonomies, comments on/off, and so on – are inherited from the default language; so all you need to do is translate the text, and hit Publish. You’ll even see the WordPress admin interface in the appropriate language as you’re translating.
Comments are merged across translations: which means you’ll potentially have a discussion thread made up of comments in different languages. Problem? No. We’ve implemented Google Sectional Translate, to let you translate each comment instantly into the language of the page currently being displayed (via ajax).
The entire site, in every language, is being generated by the same WordPress theme, be it a left-to-right language like English, or a right-to-left like Arabic. Building bi-directional code has left my head spinning on numerous occasions, I can tell you – and prompted me to write, in effect, my own direction-agnostic CSS framework. If you think that sounds easy enough…. go ahead and try it. Then think about the implications of showing – in some circumstances – content in both right-to-left and left-to-right languages simultaneously on the same page.
So much for the translation of page content: what about the stuff that’s inevitably hard-coded into the theme? For that, we’ve used GlotPress – the translation management web app, as seen at translate.wordpress.org. To be completely honest, it doesn’t yet feel like a finished product: one bug in particular derailed us for a day or more, and I consider myself very lucky to have found a solution. But when it works, it’s excellent.
There’s a dedicated section for audio/video content, powered by a custom post type. In fact, this is probably the code which gives me the most pleasure: to post a video, all the editor needs to do is paste in the URL of its YouTube page, and we do (nearly) everything else automatically – even going as far as pulling the video’s preview image into WordPress, and attaching it as the post’s Featured Image. For audio clips, we’re doing a combination of HTML5 and Flash embedding of MP3 files, to cover as many browsers as possible.
That’s not to mention the seamless MailChimp integration on the WordPress register page. Or the voting mechanism. Or the multi-server configuration, in preparation for some anticipated traffic peaks. Or the live webcasting. Or the connections into Sina Weibo, LiveJournal and Mixi, as well as Twitter and Facebook. Or… To be honest, we’ve been working on it so long, there are probably a few custom features in there that I’ve completely forgotten.
It’s unquestionably the most ambitious project I’ve ever taken on: and seeing it launch this week has prompted feelings of pride, anxiety and relief in almost equal measure. I now know more about quotation marks, soft hyphens and non-Latin typography than I probably ever wanted to know.
Thanks go to Timothy, Maryam, Judith and the entire team at Oxford; Matt and Gemma for design assistance at various stages; Jools for his customary server wizardry; and Simon W, without whom…
Oh. Next week, we have our first scoping meeting for Phase Two. Gulp.
Small site, big name
It feels like ages since I built a site completely from scratch; so much recently has been about invisible enhancement, or extra-large scale work taking months to reach its conclusion. So it’s been great fun to do a small and relatively quick build for the Commission on Devolution in Wales, established to review the present financial and constitutional arrangements in Wales.
In fact, it’s been a complete identity package: working with Matt Budd, we generated a handful of logo suggestions, trying our best – but ultimately failing – to get away from the use of a red dragon. The Commission team picked a favourite which we then worked up into a website, Word and PowerPoint templates, business cards, etc etc. (Note the deliberate selection of a (free) Google Web Font, by the way: how’s that for ‘digital by default’?)
The website is a child site of the Wales Office‘s existing WordPress multisite setup, which we activated just over a year ago, with precisely this kind of scenario in mind. A couple of clicks, a mapped domain, and bingo – a new and independent website in a matter of moments.
Ah yes, independent. We’re using the independent.gov.uk domain, set up to accommodate ‘arms-length bodies, independent inquiries and other suitable temporary sites’. I still feel slightly uncomfortable with caveat-ed gov.uk addresses like this: is it gov.uk, or isn’t it? But it’s an established standard now, so we’ll happily fall into line.
All of which gives us a site rejoicing in the URL:
http://commissionondevolutioninwales.independent.gov.uk/
unless you’re Welsh, in which case you get:
http://comisiwnarddatganoliyngnghymru.independent.gov.uk/
– which, if I’m not mistaken, is the joint longest root URL in UK government, matching that of the Commissioner for Public Appointments who – guess what? – is also independent of government.
It’s a single child site, running off a fairly simple but internationalised theme. The content is fully bilingual, managed – somewhat reluctantly, I must say – via the paid-for WPML plugin. As Word Up Whitehall attendees will have heard, Mr Wheatley and I are working on a multilingual plugin of our own: but it’s not quite ready yet, and anyway, the Wales Office server wouldn’t be ready for it either. (Long story.) I bear the scars of several WPML-based developments recently, but this one doesn’t push it too hard, so it’s been OK.
My thanks, as ever, to Matt for the creative work, Simon for some last-minute cake icing, and the Commission team for making this one run remarkably smoothly.
We’ll have more multilingual shenanigans to come in the next couple of months… but on a completely different scale. 😉
Word Up Whitehall II: another 24 hour sellout
Just as with last year’s inaugural event, all the available places at Word Up Whitehall II were snapped up within 24 hours.
We’ll have representatives from a dozen government departments (depending on how you count the various No10/Cabinet Office connections): and once again, my thanks to everyone for obeying the informal ‘maximum three per department’ rule.
I do still have a couple of places held back, just in case anyone has missed out. But you will have to approach me directly, and make a case for why you need one of them.
Word Up Whitehall II: bookings now [SOLD OUT]
Last week, I announced plans to host a second Word Up Whitehall event, for civil servants and their most friendly external developers to spend a day talking about WordPress. The event will take place on Monday 7 November, and will be hosted by the good folks at the Department of Health.
Last year, all the spaces were claimed within 24 hours, which I have to confess, came as quite a shock. So this year, we gave you a week’s notice, to decide who to send along. That week has now passed… so it’s time to sign up.
Remember, we ask departments to send along a maximum of 3 people: it’s not a huge space, and we’d like as many departments as possible to be represented.
Announcing Word Up Whitehall II
This time last year, we organised an event called Word Up Whitehall: a day-long seminar for people working in UK central government, who were either already using WordPress or seriously considering doing so. An opportunity to take time out, listen to people’s experiences, share some ideas, and hopefully come away inspired – or certainly, better informed.
I managed to persuade a bunch of people to stand up at the front, and share their ideas and experiences: some from inside government, but also some from the private sector, under strict instructions not to promote any commercial interests. (Well, not directly anyway.) BIS very kindly provided a venue, and numerous people generously chipped in a few quid to cover the few costs. Large quantities of donuts were ordered.
When I announced the event, the reaction was startling, and instant. All the places were snapped up within 24 hours. A waiting list began to form. People started sending me begging emails.
As for the day itself – yeah, it seemed to go pretty well, judging by the day’s tweets anyway. It was recently described by one attendee as ‘the most useful and, dare I say it, exciting (!) conference I’ve attended’. It provided ‘a moment of epiphany’ for one Whitehall department in particular, leading to them adopting WordPress as their principal online publishing platform. And even though I was worried we’d over-ordered on donuts, they all disappeared.
So – who’s up for doing it all again?
WordPress itself has moved on considerably in the last year; and departments’ use of it is becoming deeper and more sophisticated. Defra, Health and Transport are all now running their main departmental web presences on WordPress, using multisite arrangements of varying complexity. The Cabinet Office team have taken to WordPress with some gusto, with projects including the Red Tape Challenge and a reskin of the Number10 site. And in the next few weeks, we’ll be seeing another of the larger departments adopting WordPress in a big way.
But of course, the biggest news in the last twelve months has been Alphagov and the adoption of the ‘single domain’ strategy, including a ‘shared corporate publishing platform aimed at replacing most of the activity currently hosted on numerous departmental publishing environments’. With that work now getting properly underway, now seems like the right time to talk about where WordPress could or should fit into that picture.
Get your diary out.
Stephen Hale’s team at the Department of Health have kindly agreed to host a second Word Up Whitehall event, to take place at their Skipton House offices (Elephant & Castle) on Monday 7 November 2011.
It’ll be the exact same rules of engagement as last time:
- We’ll start at about 10am, and finish at 4pm – giving people a bit of time to call by the office, before or after. Lunch will be provided. (As will donuts, but don’t tell DH’s five-a-day people.)
- Space is limited, so it’s only open to central government people, and please, only two people (or three at a push) from any one department. We had this same rule last time, and people respected it beautifully.
- If your department has done something interesting with WordPress this year, and you think other people might benefit from hearing about it, this is your moment. I will be approaching certain obvious candidates in advance, but don’t let that stop you volunteering first. It might even guarantee you a ticket.
- Private sector people, contact me directly if you’d like to attend – terms and conditions will be applied.
I’ll be opening the ticket booking facility on Wednesday next week, 28 September. That gives you some time to think about who’s most appropriate to come along from your department. And if you’ve got something you’d like to present, let me know: the sooner the better.
Bang goes our 100% record
It’s with some regret that we note the end of Puffbox’s winning streak, as regards web work for political candidates.
Thus far, every client who has stood for election to a political office of some kind has been successful. But our run came to an end on Friday night, with the announcement that Mike Tuffrey had fallen just short in his bid to win the Lib Dems’ nomination for London Mayor. Brian Paddick came top on first preferences by just 57 votes; in the head-to-head second round, after transfers, Paddick took it by 91. (In case you’re wondering, Lembit Opik finished bottom of the poll, with just 8% of first preference votes.)
It’s a bit of a shame, as we had some really nice enhancements ready to go on Mike’s website tomorrow morning: think MailChimp plus Gravity Forms plus a custom post type and taxonomy, with a bit of ajax magic on top. Some nice design work from my regular collaborator, Matt Budd. (Oh, there was also talk of a weather-sensitive homepage; but we ran out of time.) But whilst they won’t ever go live as we envisaged last week, I’m sure they will appear online in some form or other, in projects to come.
Well, maybe not the weather-sensitive homepage.
It’s been a fun project to work on, and has taken me into areas I hadn’t previously explored in much depth. Many thanks to Mike for having us on board; and for giving us so much creative freedom throughout.
Now… I wonder what technology brianpaddick.com is running on? 😉
Puffbox develops new web platform for the Co-operative Party
It takes a special kind of political anorak to even know that the Co-operative Party exists; so you might be surprised to learn that it’s actually the fourth largest political party in Westminster.
Formed in 1917, it has been in a permanent electoral pact with Labour since 1927. In the current Parliament, 29 of Labour’s 250-odd MPs were actually elected as Labour & Co-operative candidates – including one Ed Balls. A good number of other Labour MPs are paid-up members of the Party, but aren’t actually sponsored by it. It depends on the Co-operative Group – yes, as in corner shops, banking, funerals, etc – for a large part of its funding.
And since I have a ‘loyalty card’ for my local corner shop, I suppose I should formally declare an interest: I am a part-owner of the Co-operative Group. A very, very, very small part indeed. But technically, still an owner.
For the past few months, Puffbox has been working alongside left-leaning digital specialist Jon Worth to help the Party up its game online. And in doing so, we had to up our own game too: it’s unquestionably the most intricate WordPress build I’ve ever done – with a multisite-based strategy, (double) wildcard DNS, four custom post types, two automated custom taxonomies, and a parent/child theme arrangement, both offering full visual customisation. See what I mean?
To give you some idea of how it all stitches together: each of the Party’s Parliamentarians has a ‘person page’. You can click on ‘People‘ in the navigation bar to see them all, or hover for various filtered views. Say, for example, Members of Parliament. Oh look, there’s Ed Balls.
Click on his name, and you’ll see a ‘person page’. At the top of it are links to his Twitter account, and his personal website. Then there’s a concise biography. And towards the bottom, a ‘snapshot box’ for his latest activity on Twitter, in Hansard, on Flickr, and on his personal website, plus any content on the site itself which mentions him… all populated and updated automatically.
For those interested in the technical side: ‘person’ is a custom post type, with an extra metabox for the various external content sources. There’s a custom taxonomy called ‘role’, which is how we know Ed Balls is an MP. (And of course, each person can have multiple roles: here’s an example.) We pull the tweets in via JSON, to avoid API limiting; the other external data comes via RSS feeds. And of course, there’s a custom display template to stitch it all together. Meanwhile, invisibly, there’s also a people taxonomy on posts, which syncs with any changes to the person record.
And, uh, there’s something similar for areas of policy. But you’ll just have to work that out for yourselves. 🙂
The ‘main’ site will be complemented by a handful of distinct subsites, within the same WordPress multi-site install. There’s still some fleshing-out to be done, but you can see sites for the party in Scotland and Wales starting to come together. They use the same core theme, with the ability to change the background and header images; but will be managed on a day-to-day basis by the Party’s regional operations. Regular readers will recognise the influence of our work with Defra
Visually, it’s not the richest design I’ve ever done, but that’s entirely in keeping with the ethos of a party which doesn’t actually have a logo per se. We’ve kept things nice and simple, concentrating on clarity and ease of navigation. But as it’s turned out, there’s been a lot of very positive feedback about the look and feel, so we’re confident we got it ‘right’ for the client and their audience.
Thanks go to my own co-operators on this project: Simon Wheatley, for his technical assistance and inspiration. Jon Worth, for putting the project together. Martin at the Co-op Party (see his person page), who’s been an absolute star – and is already on his way to becoming a WordPress expert. And finally, to WordPress 3.x, without which none of this would have even been conceivable.
On government organograms and RDF files (includes free WordPress plugin!)
There was an initial buzz of excitement yesterday, at the launch of the new data.gov.uk interactive organograms… and then, by teatime, a bit of a backlash. I can see both sides myself. Yes, it’s a very cool rendering of potentially quite dull data, and it’s nice to see it done in javascript (jQuery) rather than Flash… but it’s actually a bit fiddly to navigate through. That isn’t to understate the significance of the achievement, though: such a coordinated leap forward, in both technical and bureaucratic terms, is no small task. And there’s so much to it, most of which is beyond me, that I can’t begin to explain it in depth. Hopefully someone else will oblige.
As part of the initiative, departments have been instructed to upload raw RDF files to their websites, from which the organograms can be generated… which caused a bit of a problem for one of our clients. But it’s a problem we’re happily able to solve.
The Wales Office was the first Ministerial department to move everything over to WordPress, back in early 2008; and they’ve been running very happily on it ever since. About a year ago, we helped them build a new Transparency section, which acts as a download area for (mostly) Word and CSV files. It’s all rendered via a custom page template, and managed via the standard WordPress ‘media library’ functionality. Unspectacular perhaps, but quick and easy for all concerned.
However – when they tried to upload an RDF file, they couldn’t. WordPress has a surprisingly long list of file types it’s prepared to let you upload (look for get_allowed_mime_types() in wp-includes/functions.php): but RDF isn’t on it. So it throws up an error message like this:
We could upload it as a zip file, which would have the added benefit of reducing the file size by 90-odd per cent… but then the orgchart generator wouldn’t be able to process it. Dilemma.
But as ever with WordPress, there’s a happy ending to the story. We – by which I specifically mean my technical partner, Mr Wheatley – were able to write a quick plugin to ‘hook’ on to approved filetype list, and stick RDF on the end. Problem solved, file uploaded, everyone happy. You can see the successfully uploaded file here.
And given that there are a good number of government departments running WordPress sites, including at least one other using WordPress specifically for its transparency information, we thought we’d do the decent thing, and offer it up for others to download. Here you go. There’s no configuration interface needed; just upload it, activate it, and start chucking up RDF files to your heart’s content.