However when I use the hook it appears AFTER the closing <header> element.
I’m guessing the documentation is wrong and the hook is working as intended?
What I’m trying to achieve is to insert a full width (not contained) div at the bottom of the header area that includes the header background image. I then intend to give this new div it’s own slightly transparent background colour so that I get a gentle transition between the header area and the rest of the site below.
I’m not sure if there’s another hook that might do this (have looked – couldn’t see anything), but any pointers appreciated. I’m building locally so can’t provide a URL to show.
I managed to solve my problem by using hooks in the end. I wrapped the header with a div using before and after header hooks, then applied the header background image to that div instead. I could then insert an additional div just before the closing element of the new wrapper div and give it a height and a transparent background colour.
But, I will explore the header element option as well, about time I learned a bit about elements 🙂