Content Models with Perch Runway

Perch has always had structured content at the core, and both versions of the product enable intelligent, structured content and the use of content models.

While standard Perch ties that content to pages, the Collections feature in Perch Runway enables flexible structured content. I take a look at how Perch Runway enables intelligent use of content in your projects.

On A List Apart Rachel Lovinger explains content models,

“A content model documents all the different types of content you will have for a given project. It contains detailed definitions of each content type’s elements and their relationships to each other.” – Content Modelling: A Master Skill

Starting a project with a content model means that you can break down each type of content that needs to be added to the site. You can ensure that the CMS can capture all of that information. You can also prevent duplication of effort – so editors do not need to add the same content in multiple places on the site. You can work out which chunks of content need to relate to other chunks of content.

In the A List Apart article Lovinger notes that in general content management systems have a bias towards a certain “unit” of content. For many systems that have come from a starting point of a blog, that unit is a post. In Perch Runway we don’t have such a bias. Your content can take any shape you want. This leaves you free to create content models, and then create an editing experience that allows editors to create content based on that model.

A practical example

If we take the 24 ways website as an example. Our content model includes the following units of content, individual “content types”:

Content Relationships

These content types relate to each other. Articles have a Year, a Topic and an Author. An article may only be in one Year, but some Authors have written more than one Article so those need to be related in a many-to-many way.

Content Attributes

Having identified our content types and the relationships they have with each other, we can create a model of the individual attributes each type of content should have.

A piece of content will have visible attributes – content that is displayed on the page. For example an author has:

You can see these displayed on the page.

There is also information that is not so visible. There might be meta information or open graph tags for social sharing.

You should also consider any information that you need in order to be able to filter, or otherwise modify the display of the content. For example in order to display an author page we need a URL-safe “slug”.

Our article needs a way for the content editor to select the Topic, Author, Sponsor, Date in order that we can automatically display the article on the right date and it will display in the list for that author, year and topic and the correct sponsor be shown alongside.

Breaking content down means we can reuse it and filter on it. As Lovinger explains on A List Apart, if the pertinent field is included in a big chunk of body text then it can’t be reused as their is no way to identify it. Likewise, you can only safely filter on a date or an author name, if that data has been captured separately.

As you are thinking about these attributes, you can also consider how you might use the CMS to ensure the correct information is added in the right format. You could also consider how you could use help text to guide editors when adding this information.

Taking Your Content Model to Perch Runway

Once you have identified all of the content types and their attributes, implementing this model within Perch Runway is straightforward.

The Collections feature means that you can create a Collection for your Content Type – for example Authors.

The template for this Collection then represents the attributes that you have identified as being required by this content type.

<header class="preface h-card">
<h1 class="preface_title p-name"><perch:content id="firstname" label="First name" type="text" order="1" required="true" title="true" /> <perch:content id="lastname" label="Last name" type="text" order="2" required="true" title="true" /></h1>
<div class="preface_main">
  <div class="lede p-note">
  <span class="avatar"><img class="preface_image u-photo" src="http://cloud.24ways.org/authors/<perch:content id="slug" />280.jpg" width="280" height="280" alt="<perch:content id="firstname" /> <perch:content id="lastname" />"/></span>
  <perch:content id="bio" type="textarea" label="Bio" textile="true" order="4" html="true" />
  </div>
</div>
</header>
<perch:content id="slug" type="text" label="Slug" order="3" required="true" help="Should be firstnamelastname" suppress="true" />
<perch:content id="url" type="url" label="URL" suppress="true" order="5" placeholder="http://" />
<perch:content id="active" type="date" value="2005-12-01" label="Active" suppress="true" order="6" />
<perch:content id="twitter" type="text" label="Twitter username" suppress="true" order="7" />

Perch then uses that template to present a structured editing experience for content editors.

You can use specific Field Types such as date to ensure that content is added in a manner that allows you to filter on it, and reuse it. You can also enforce the content model by adding help text, to help editors understand what needs to be added and why.

Adding Blocks for flexible structured content

Some content – for example an article on a web development subject – might need a variety of structured content within it. The editor might need to add code snippets, images, videos or a table of data in addition to paragraph text. In Perch and Perch Runway the Blocks features allows this selection of different templates – keeping data structured while allowing flexibility.

Creating Relationships

Once your content is added in a structured way, it’s simple to create relationships between the different Collections, Categories and other content on your site.

You will also find it easy to reuse your content with different templates, around the site. Once you start work on this part of the build, you’ll really see how working from a content model makes sense.

Start your next project with a content model

I find that taking this sort of approach to content streamlines the production of many projects. It helps keep the focus on what is most important – the actual content. It ensures that I can create the best possible experience for content editors, and means that the site design and architecture can deliver the core messages and information well.