Design and development of a newspaper website
Distinctive website using WP5's Block Editor to make the editorial team more efficient. A limited set of components, options and automations combines to produce an easily variable, yet very consistent website.
Homepage produced by the Byline Times team without our oversight, after just one week of using the site:
We designed and built bylinetimes.com in two months, and used Gutenberg (and ACF) with a set of custom blocks, components, options and abstractions that make the underlying design flexible enough to respond to more or less any editorial requirement.
- The homepage can have a sidebar on the left or right, or no sidebar at all (switched in an instant).
- The body is divided into rows, and each row can hold 1, 2 or 4 items.
- Each item can be a list of posts or an article preview.
- In each list, the editor can manually select which posts to show, or choose a category from which to draw posts, or automatically show the most recent updates from the site; editors can decide whether to show or hide lead paragraphs, bylines and publication dates.
- In article previews, the editor can choose from a number of basic layouts (e.g. “photo above, text below”; “text only”; “text over a photo background”; and so on) and either use the metadata drawn from the post itself, or override key elements to suit the editorial context of the homepage.
- In both lists and article previews, there are options for alignment, font choice, colour combination – all are consistent with the site’s theme, but allow considerable flexibility and variation.
Example of an internal page
Single Posts also use WP5’s Block Editor. They inherit their colour scheme from assigned taxonomy, and CSS filters allow photos to be given a consistent yet distinctive treatment, again referencing a “retro” print aesthetic, but underpinned by CSS so cutting-edge that Edge won’t cut it 😐
Reusable Blocks allow CTAs to be quickly placed in the flow of articles.
Taxonomy is used to produce “related reading” cross-links.