Removing the Jekyll Title

Motivation

I was moving my monthly invoices from Google Docs/Drive over to an offline Jekyll site and wanted to remove the giant title from the page.

I didn’t necessarily want my styling to impact any other pages though.

Since I am using Hydejack, what I found was that any styling of the standard html tags has widespread effects. Maybe the side menu changes. Maybe things don’t layout the same. Maybe things disappear.

Looking online wasn’t much better. People were suggesting adding in if/else conditions throughout the theme, which meant more conflicts whenever it gets updated.

Solution

So there was actually a much simpler solution. Again, I am using Hydejack, so adjust as needed.

For me, I was working on my _layouts/invoice.html, which was being utilized from a collection that specified layout: invoice.

The top of that layout file had a very simple Front Matter declaration:

---
layout: default
---
<article class="income">
...
</article>

That default layout is the one specified in Hydejack.

If you look at that page, you will see things like

<h1 class="page-title">{{ page.title | default:strings.home | default:"Home" }}</h1>

That’s specifically what we wanted to get rid of, for this one layout. Looking closer at that page though, you’ll notice that it’s front matter specifies that it descends from base. Changing mine to match:

---
layout: base
---
<article class="income">
...
</article>

And now my invoice page has no title, no navigation at the bottom, etc. It still has the copyright footer, but I think that’s OK.


© 2019. All rights reserved.