Incorrect assumptions made - ignore thread

Made stupid assumptions about a problem, turned out to be red herring.

[details=Summary]I want to use some of the semantic HTML5 tags, but when Jekyll builds my site some are ignored, while standard tags like <h1> and <a> work correctly. I’m really scratching my head as to why. I’m happy to go away and test things, but at this stage I can’t think what to investigate. Can anyone shed some light?

  • Not working: <address>, <section>, <article>, <time>
  • Working: <main>, <nav>

The only thing I can think of is that <main> and <nav> are not nested inside any control flow tags (if, elsif, case) in my templates. But that doesn’t account for why basic tags like <h1> and <a> continue to work correctly, despite lots of nested logic.[/details]

Are they in _layouts/_includes or in a post?

It’s possible if they’re in a Markdown file Kramdown is ripping them out. But if it’s a .html than you should be fine. You have an example file?

I use most of those HTML5 elements in layouts and have never had then ripped out.

Thanks for quick reply. They’re inside a .html in the _layouts folder. It’s a few commits behind at the moment, but here’s the context.

(It might also be worth mentioning that using <address> messes up the order - Jekyll pushes the whole tag to the end of the rendered page, for no reason I can figure out. When I was using <blockquote> (long story) to contain exactly the same content, it stayed where it ought to.)

I thought for a second it might be something to do with other gems interfering, but when I checked I saw that I’d only actually added html-proofer, which doesn’t touch the output.

The reason <address> is at the end of the page is simple. In your _layouts/standard.html you have {{ content }} before the address code. Which means the content in will output first.

{{ content }}
  {% if %}<a href="mailto:{{ }}">{{ }}</a>{% endif %}
  {% if site.telephone %}<br/>{{ site.telephone }}{% endif %}
  {% if site.address %}<br/>{{ site.address }}{% endif %}

Sorry I should have been more specific. The address section should be below
the content tag, that’s what I want.

What actually happens is that it is pushed below the entire content of the
unless which follows it. And the HTML tags I mentioned before are simply
omitted from the output.

Ok, I’ve worked my way through the code from scratch and basically I couldn’t see the wood for the trees. Long story, but I think I know what the problem is and why it happened. Those tags are a red herring.

Thanks for looking at the code. Also just noticed your username, I’ve used your articles before for various things, so thanks for that too :+1:

1 Like