I use the Genesis framework on every project because of its speed, security, and ease of customization. There are hundreds of Genesis hooks and filters available that allow you to customize just about anything that you need. On rare occasions, though, I have needed to create my own hook(s) as a workaround.
A great example of needing a workaround is when trying to insert HTML between a container and its immediate descendant
.wrap element. By default, Genesis adds a structural wrap to the header, menu-primary, menu-secondary, footer-widgets, and footer elements. I often add it to the
.site-inner container as well to help with styling. But sometimes you may need to insert HTML between the structural wrap and its parent container, like when you want a full width page header. There are a few ways to do this, but the cleanest way that I’ve found is to add your own hook. Here’s how:
Here we have added
three twelve new hooks:
And we can use these just like any other WordPress hook. So to accomplish the full width page header you could do something like this:
Simple and clean, right?