Template changes in Perch 3.1

Updating our template language to match the markup you’re writing

One of the primary reasons Perch has its own template language is that we wanted templates that were both robust and easy to learn. We wanted a template language that had the same strengths as HTML, with a syntax that was easy to read and wouldn’t completely destroy your page if you made a small mistake. In fact, we wanted it to be so much like HTML, that we adopted HTML-like tags as the basis.

This was back in 2009, when the most popular flavour of HTML was XHTML. For those not familiar, XHTML was an attempt to take some of the more strict rules of XML and apply it to HTML. This meant that every tag needed to be closed (or needed to be self-closing), all attributes needed to be quoted, and tag names had to be lowercase, plus a bunch of other technical constraints. XHTML had its fans and its detractors, but by and large it was the most common way to write HTML at the time.

As we wanted the Perch template language to be just like the markup our customers were writing, we adopted the XHTML style of tags.

Along came HTML5

Since then, HTML5 has come about. HTML5 is much softer on these rules, bringing back some of the looseness of HTML4. Tags don’t need to close themselves. Boolen attributes like required can be turned on just by stating the attribute name, no value needed.

<input type="email" name="email" required>

In 2018 (and realistically for a few years before) this is predominantly how professional web designers and developers write their tags. Mix in your Perch template tags, and all of a sudden the Perch tags look weird and out of place. For newer developers who never wrote XHTML, Perch tags look completely custom and alien, and that’s what we were trying to avoid all along.

So in Perch 3.1, we fixed it.

No more self-closing tags

Whereas before Perch 3.1, your tags needed to self-close:

<perch:content id="title" type="text" label="Heading" />

From Perch 3.1 onwards, you can close them just like HTML5 tags:

<perch:content id="title" type="text" label="Heading">

The old tags still work, so you don’t need to update your templates unless you want to.

 Boolean attributes

I always felt a little bit uncomfortable with the attributes that had to be set to true to enable a feature. markdown="true", html="true" and so on. It’s not very elegant or natural to have to say something is true rather than just assert that it’s there. That’s exactly what boolean attributes do. If an attribute has no stated value, then that value is automatically true.

Before Perch 3.1 you might have a tag like this:

<perch:content id="intro" type="textarea" label="Intro" markdown="true" required="true" />

In Perch 3.1 you can now replace that with:

<perch:content id="intro" type="textarea" label="Intro" markdown required>

Much simpler, less typing, and more like HTML5. Again, the changes are backwards compatible so you only need to update old templates if you want to do so. The old style still works.

We’ve updated the documentation for Perch 3.1 to use the new format, so if you have old sites running on older versions of Perch, you’ll need to keep that in mind when working on your templates.