Custom Tools for the Largest UK Newspaper: The Sun and Human Made

Powerful and intuitive, the WordPress editorial and content management interface is also extremely flexible. It has been customized to match varied and sophisticated workflows for enterprise media and marketing teams all over the world.

Last month at the Big WP Meetup in London, John Blackbourn (@johnbillion) of VIP agency partner Human Made presented highlights of a major customization project for The Sun and its sister publications, The Irish Sun and The Scottish Sun. The Sun is the largest newspaper in the UK by circulation, and second-largest by online audience. The customization work was just one piece of a larger replatforming initiative that moved The Sun to WordPress.com VIP from a print-based CMS. This was a massive undertaking, and involved moving 10 years worth of content — 400,000 articles a terabyte of images.

John’s talk focused on the interface Human Made built to match the editorial workflow of the three publications.

A Layout Customiser for The Sun

Requirements and Discovery

Highlights from the Sun’s editorial requirements included:

  • Editors need to quickly and frequently alter the content and the layout of the home page, which can change as often as every ten minutes
  • Complete, visually accurate previews of changes before they go live
  • Scale to handle and manipulate hundreds of articles on the same page
  • Smart and efficient data storage methods

To gain more context and uncover useful details about each of these requirements and how the editors really work, Human Made ran a workshop with The Sun’s editorial team.

They found that editors very frequently move a story around on the home page based on importance, and not in only one direction. Depending on how a particular story develops, it can take any number of routes through the slots on the page. And story order can change up to every few minutes.

Also, originally editors thought they wanted open and free-form editing capability, to have a fully open palette with which to work. Through exploration they found that there are really a limited number of patterns that they use frequently. They may be updated every once in a while, but for the most part they work from a number of pre-set formats. A detail or shade of clarity on a requirement like this has a huge impact on how an agency like Human Made conceives of the solution, and what they prioritize.

Watch Blackbourn describe highlights from the workshop below:

The result of the project was a completely overhauled layout customizer (using WordPress’ extensible Customizer) and page/section management tool – all set up to work within the WordPress admin interface without requiring any side trips or extra clicks. It’s a tool The Sun’s editors live in every day, all day.

The ingenuity of the entire interface is impressive to see in action, but three particular areas of note from the talk:

The Cascade

To tackle the ability to move stories around the page throughout the day, Human Made developed something they call The Cascade. This allows editors to stick an article to their cursor and swap it with an existing article on the fly, so that they don’t need to go through an extra step of adding or removing to adapt the story order. This tool efficiently controls articles throughout the entire, scrolling home page layout.

Layout Chooser

Editors add new sections by choosing from a couple dozen pre-set layouts, which cover all of the styles they more commonly use. Picking one adds a blank section into which they can then quickly drop articles, then easily style and publish the new layout. This all unfolds in the WordPress editorial interface, without requiring them to go to a separate screen or tool.

Precise Preview Rendering

In order to achieve the preview goal, any time an editor makes a change, WordPress fires off an AJAX request to the back end and pulls in the actual template code the site will use to render the finished page. This assures that editors see an accurate preview, and that there are no discrepancies between what shows up during section management and what the user sees when the visit the page. This also makes maintenance seamless, because when a template changes, that inherently and automatically changes the preview code.

Watch Blackbourn demonstrate each of these features:

These new tools and platform free up The Sun’s editorial teams to focus on what’s most important, what’s most popular, and what has suddenly moved from a small blip to a massive unfolding scoop.

To be notified of the next BigWP event in London, join the Meetup group. There are also enterprise events throughout the year in various other big cities.

Ready to get started?

Tell us about your needs

Let us lead the way. We’ll help you select a top tier development partner. We’ll train your developers, operations, infrastructure, and editorial teams. We’ll coarchitect your deployment processes. We will provide live support for peak events. We’ll help your people avoid dark alleys and blind corners, and reduce wasted cycles.

%d bloggers like this: