Archived topic
HTML5 Tags
3 replies · Started by Ammar on May 18, 2022
Hi all,
I need some assistance with setting up correct HTML5 tags in Generate Press.
Here is the HTML5 layout which I would like my blog articles to be like (and also some pages which I use for content).
Now, when I enter my post HTML5 I have a few problems. I'm not sure how GenerateBlocks etc work with this, or where I would need to put/change the HTML5 tags to correct.
1) Top Nav is not in the <header> HTML5 markup
2) Bottom Nav is not in the <footer> HTML5 Markup
3) On Post Page, h1 is not in the <main> and <article> HTML5 markup
4) I may want to add the <aside> tag outside of the <article> tag but within the <main> tag - how would I do this? This section would be for an email signup box or a discount code.
Hope the above is clear, but let me know if I need to clarify.
Hi there,
Just a quick note on HTML5 semnantics, the spec is continually evolving and the link you shared is a little out of date, it doesn't mean its wrong but its not to latest spec. So ill outline how to make the changes with comments where i can.
1. You would need to change the Customizer > Layout > Primary Navigation -> Location to Float Right. This will place it inside the <header>
Latest spec: you can put the <nav> where you feel it's most appropriate - there is no value add of it being in the <header>
2. Edit the Block Element you have for your Footer. Select the parent Container and change its Tag Name to Footer
3. The Block Element would need to be hooked into: generate_before_main_content
4. You would need to hook in your own Container blocks which can have the Tag Name set to <aside> using the same hook as #3. However if you want it displayed as a sidebar then you going to need to do some CSS working
... However see here regarding the aside element in the latest HTML Spec :
https://html.spec.whatwg.org/multipage/sections.html#the-aside-element
This part is of the most relevance:
Contexts in which this element can be used: Where sectioning content is expected.
<main> is not a sectioning element, whereas elements like body, article, section are.
So having it as a direct node of the <main> is kinda incorrect and would be no different to having it in the body where the context would be correct.
Thanks for this.
Really usefil explanation and links.
Will see how I get along.
:)
You're welcome