Simply Show Hooks and How to Use Them

Back in the day, I used to do a lot of client sites using things like the Genesis Framework and Canvas.  I would use a child theme to make CSS style changes and add functions to add in other aspects of the site without having to manually edit templates.

In this tutorial, we will go through how to find a theme’s hooks and how to add content to them.  We’ll use Twenty Seventeen as the example theme.

Finding hooks and where they are can be pretty time consuming, and it was a lot of trial and error at first to figure out where things needed to go.  Luckily we now have plugins like Simply Show Hooks which can show you exactly where the hooks are that you can, well, hook in to!

Simply Show Hooks

Here is what this site looks like using this plugin:

As a bonus, it will help you learn what order things get called in because the order can be very important in how you add things to a site.  You can see that setup_theme goes before init and both of those are even loaded before wp_head is called.

Here is the site using Twenty Fifteen:

Adding Content to a Hook

If you’re using Twenty Seventeen, and say you wanted to add something below all the widgets in the sidebar, here’s what you would do:

1. Check the Sidebar, look for a hook:
   Oh nice!  We found dynamic_sidebar_after

2. Now let’s write up some code to add something there:
   
3. Result:
   

Think of all the things you could add in there… 🙂