New header and footer patterns

In Blockbase 2.0.12 we made some changes to headers and footers work. Blockbase now provides multiple header and footer patterns. These can be included in templates using the new Pattern block in Gutenberg.

This change enables all Blockbase child themes to use the same naming conventions for header and footer template parts, i.e. parts/header.html and parts/footer.html. Inside these template parts you can reference the pattern that your theme should use. Here’s Quadrat’s header.html:

<!-- wp:pattern {"slug":"blockbase/header-linear"} /-->

<!-- wp:spacer {"height":136} -->
<div style="height:136px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->


This approach has several benefits:

  1. If Blockbase child themes only vary the header and footer, they will be able to inherit the template from Blockbase itself
  2. By using predefined patterns for the header and footer, it is easy to take advantage of these more complex header and footer patterns and benefit from their maintenance, without the child theme needing to be responsible for keeping the code up to date
  3. It is simple to add extra blocks to these headers and footer (e.g. spacers and separators) without needing to modify the shared templates.

What do I need to change?

If you are maintaining a Blockbase child theme, it should continue to work with this change. However if you update your themes to use the patterns supplied by the parent theme you might find that you are able to simplify or even remove some custom templates (e.g. 404.html and search.html)

Leave a Reply

%d bloggers like this: