Simon Dickson has been blogging about online government, politics and WordPress since 2005. Some important people read it.

 
 
Tuesday 21 February 2012

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*.

Friday 17 February 2012

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.

Babble's create/switch menu

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

English comments on a German page, with "Übersetzen" option

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.

Farsi, aka Persian, ie Iranian: note the flipped logo

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.

Tuesday 14 February 2012

Telegraph publishes first WordPress plugin

The Telegraph Media Group began embracing WordPress two and a half years ago: first its blogs were migrated over, then its My Telegraph community. They then began embracing WordPress people, hiring BuddyPress core developer Paul Gibbs, and hosting London WordPress meetups.

Now they've gone a stage further: releasing a WordPress plugin in the company name. Expire User Passwords has obvious applications in a more corporate environment: it's a zero-configuration plugin which you simply install and forget about. Until you reach the 30-day expiry point, when you're prompted to renew your password.

It's available from the WordPress repository, where it's owned by Paul and a new Telegraph user account. Or alternatively, they've just started making use of a Telegraph Github account which they seem to have registered two years ago.

Well done, Team Tele. Great to see a large corporate giving back to the WordPress community. I'd love to know how they got over the inevitable concerns about plugin support, liability and so on.

Thursday 9 February 2012

Open standards consultation now, er, open

I came away from this year's UKGovCamp with an uncomfortable sense of there being an 'us' and a 'them'.

The day opened with Dave Briggs declaring the event was different because, among various examples he quoted, it didn't have a keynote address. The day concluded with a keynote address by a senior Cabinet Office civil servant, who proceeded to tell us what his team of hired specialists were going to do.

But the 'us and them' was even more apparent in the first session I attended, led by the Cabinet Office's Liam Maxwell, on the subject of open standards. The substance of the presentation was:

  • we think open standards are very important;
  • we're doing lots of very important things, none of which we can talk about;
  • but we'd value your input when the time comes.

I voiced a certain amount of frustration in the questions which followed, so it won't surprise Liam if I say it all felt thoroughly unsatisfying.

Having said that, I did - and do - have some sympathy. Open standards are commercial dynamite: software lock-in is worth £££millions to the big vendors. Enough for those vendors to put up a hell of a fight, in defence of an unsustainable and #unacceptable status quo. And to extend my metaphor just one step further, Liam and his colleagues were keeping their powder dry.

The aforementioned time for our input has now come: the Cabinet Office has opened its consultation process, with Liam asking for 'as much feedback from the IT community as possible... There’s a lot of strong opinion on this subject,' he says, 'so I’m urging people to take this opportunity and let us know what they think.'

The consultation 'document' is online, and it's been done on WordPress. ;)

The interactive part of the site comes in three pages of questions, two of them very long and very scary, powered by a bespoke plugin (by the look of it). At the very top, it declares:

which may not be quite what they meant. Based on the error message displayed following a blank submission, it looks like only name and email address are actually required, plus an answer to at least one question. And if there's an asterisk anywhere, I've yet to find it.

The exercise itself is all rather semantic, and the language inevitably technical. It goes way over my head, to be perfectly honest. But my feelings on open standards are easily summarised:

As open as possible, as standardised as possible, as soon as possible.

Based on my experience in the Civil Service, it's that final point which is probably most important. I've been scarred by past experiences - notably around the Government Category List and eGMS, which both took several years, went through numerous iterations, and yet seemed to deliver no tangible benefits. (Correct me if I'm wrong.)

This time round, hopefully, things are different. The 'cloud computing' narrative has been widely accepted; and implicit in that is the belief that government's needs are not unique. Government should be looking to embrace standards that are already being widely adopted - and where there are any (perceived) deficiencies, it should play a part in their development.

Exactly how it does that, frankly, is up to smarter people than me.

Wednesday 8 February 2012

Going in 60 seconds

In a single sentence, Stephen Hale's latest blog post encapsulates the sheer joy of moving from a classic old-style CMS to WordPress.

By switching out Stellent for WordPress as our primary content management tool, we changed the processes by which web content was created and published. Editors no longer needed the same in-depth knowledge of the CMS to publish content, it was possible to publish more quickly, and it was much easier for us to devolve the act of publishing. The day-long CMS training course for new editors was replaced with a 1 minute (I timed it) session showing staff how to click on “add new” and type in a box.

From what I hear, the GDS training course for those publishing on the new unified platform is going to take a _little_ longer than that.

Tuesday 7 February 2012

Saul’s gov.uk plugin now on Github; anyone know Ruby?

Saul's plugin: 24 hours later

I blogged earlier today about Saul Cozens and his 'v0.1 alpha' WordPress plugin for embedding gov.uk content via WordPress shortcode.

The great news is, Saul has uploaded it to a public repo at Github, meaning it's now:

  • dead easy for you to download, and keep up to date
  • possible for you to fix, enhance and generally improve it

Saul has very foolishly kindly given me commit privileges on it, and I've done a bit of work on it this evening - a bit of error handling / prevention, adding basic parsing of gov.uk's multi-page 'guide' content (including any videos!), and general housekeeping.

In other words, it's now less likely to simply fail on your page. It's likely to fail in more complicated ways instead. :)

There's one substantial catch: and this is an appeal for help.

The platform's content is marked up, so it turns out, using an extension of the Markdown language, which they're calling govspeak.

It adds a number of extra formatting options, to create things like information and warning 'callout' boxes. And whilst there are PHP based libraries for Markdown, which we can bolt on easily, there's nothing instantly WordPress-friendly for this new govspeak.

Yet. If you know a bit of ruby, if you've got a bit of spare time, and if you want to help expand the reach of govuk's content to charities, community groups, local government, etc etc... now's your chance.

If you fancied one of those £73,000pa developer jobs, I bet it would look great on your application. ;)

Tuesday 7 February 2012

New plugin embeds gov.uk forms within WordPress

Saul Cozens has done a wonderful thing. He's written a WordPress plugin which allows you to integrate content from the new gov.uk site within WordPress pages. You add a WordPress shortcode, of the form:

[govuk url="https://www.gov.uk/vat-rates"]

It pulls in the corresponding JSON data - which is really just a case of adding .json on the end of the URL - and plonks it into your WordPress page. So far, so not tremendously complicated.

Here's the good bit. No, sorry, the fantastic bit. Not only does it plonk the text in, it can also plonk forms into place. And keeps them active as forms. Yes - actual, working forms.

My screenshot above is taken from my test server: no offence Saul, but I'm not putting a v0.1 alpha plugin on my company site! - but it shows me successfully embedding the Student Finance Calculator 'quick answer' form within my current blog theme, and sending data back and forth. Sure, the CSS needs a little bit of work... but Saul's concept is proven.

Game on.

Monday 6 February 2012

GDS needs more devs, offers more money

I confess, I rather shared Steph Gray's astonishment to see that GDS's appetite for fresh developer blood continues unabated.

It's a little unhelpfully presented on the Civil Service jobs site, but I've since had it confirmed that they are currently recruiting a total of 22 developers at Grades 6 and 7 level. (Not, as you'd almost certainly assume by reading it, 22 at each.)

For those outside the Civil Service, Grade 6 equates to an Army Colonel. At that level, you'd normally expect to be managing quite a decent number of human beings... which in my experience, are a lot more temperamental than servers.

You've got a week to get your application together, if you're attracted by the prospect of a £73,000 salary package for a 36 hour working week. Which of course you would be, if you're even remotely qualified.

I shudder to think what this is doing to 'the market rate' for IT jobs elsewhere in Whitehall.

And I wonder where these devs are going to go, in their next step up the career ladder. It can't possibly be within government, without taking a significant pay cut... or a huge step-up in responsibility.

It's quite agonising, by the way, to see that GDS have felt the need to write a blog post explaining how to search that Civil Service site, and download the appropriate files. An indication of just how work needs to be done; and therefore, perhaps, some kind of screening process? 'This is what you're up against...'

Thursday 2 February 2012

Betagov not afraid of public commitment

When I blogged about the GDS launch, before Christmas, I noted that how it did things was at least as important as what it was actually doing, and possibly moreso. Within the first 24 hours of the new gov.uk beta site going public, we have a perfect example of this.

The gov.uk team have an account at Github - which, you won't be surprised to hear, is where all the cool coding kids hang out these days. For the benefit of those of a certain age, Git is neither randy nor Scouse. It's a 'version control' system, which lets multiple people work on the same code file(s). The GDS team are using it for their own benefit; and they've made the account public, so other people can see what's happening, work out how it can be fixed or improved - and then submit amended code for potential inclusion.

David Mann picks up the story:

Matthew Somerville, a notorious polymath (and former civil servant) found an issue with our bank holidays page. ... He downloaded the code for that particular page from our open source code repository, and then corrected the code and uploaded the changes to GitHub. He submitted a pull request (ie he proposed that we include his changes). After careful testing and checks, we have now included his contribution into the GOV.UK code and the change will appear on the site soon.

And here's exactly how it happened, over at Github.

A certain amount of perspective is required. Matthew is a pretty special case; and the code change in question was trivial (in code terms, rather than legislative terms). But let's revel in the fact that it happened. An Outsider spotted a problem, wrote a fix, sent it in, and the Cabinet Office activated it.

This is what progress looks like.

Wednesday 1 February 2012

New gov.uk website hits beta

The GDS project to build a 'single government domain' website passed from alpha to beta phase in the final few hours of January 2012. And as with the alpha, it's all open to the public - you'll find it at http://www.gov.uk, which still looks rather odd, and feels very strange to type. I guess I'll get used to it.

Writing on the GDS blog, Tom Loosemore describes it as ' the next step on the journey', but of course, that's a bit of an understatement. An 'alpha' build, such as was unveiled last year, makes no promises. By definition, a beta is much closer to what its creators consider to be their eventual vision. The stakes are higher, much higher this time.

Thankfully, it's looking great. It's no surprise to see the defining characteristics of the alpha still in place - notably the placing of emphasis on tools rather than text, and search rather than navigation. And it's in these that you find the platform's real strengths.

'Quick answers', such as this Student Finance Calculator perfectly illustrate the revolution that this ushers in. For too long, government websites have sought to provide inch-thick documents instead of single-sentence (or even better, one word) answers to the user's specific question.

(Remind me to blog about the 'do I need a visa?' questionnaire I built in 1999, whilst at the Foreign Office - and still visible, hurrah!, via web.archive.org. And a dozen years later, presumably after serious reconstructive surgery, it's still going strong albeit in a new home.)

And it goes without saying - the predictive search mechanism is excellent. But then again, it has to be. Once you're beyond the homepage, there's next to no clickable navigation. This is the 'Google is the homepage' credo gone fundamentalist.

For those of a technical mind, James Stewart has listed the technology it uses; and I'm grateful to Harry Metcalfe for the tip-off that interesting things happen if you stick .json on the end of a URL.

I for one welcome our new online overlord. ;)

(Plus, it gave me an excuse to play around with the excellent Bootstrap web framework, open-sourced by Twitter last year. I love it, although it's highly likely to make your website look a lot like Twitter.)