WordPress Education, WordPress for Education

Hooks API from scratch – Part 1: A visual guide to hooks, handles and adding things to hooks

A hook and a box

Let’s say you have a hook on the wall. You have a box that you want to hang on or, in other words, add to the hook. You can’t punch a hole in the box, so what do you do?
One simple way would be to place the box inside a bag and then hang the bag on the hook. We use the bag to add the box to the hook.

Two hooks and I’m your intermediary

Let’s say you can’t come and hang the bag yourself. You give it to me and ask me to hang it on the hook. What would you tell me?

Yes, I really want you to think of the instruction and say it aloud, like you actually are instructing me. Do make sure you do this privately or take people around you in confidence. Otherwise, they’ll think you are bats#!^ crazy.

Now, let’s increase the number of hooks to two. Also, suppose that you want the bag hung on a specific hook. I can’t just hang the bag on any of the hooks. In such a scenario, how do I identify which one to hang the bag on?

(I want you to think of possible ways. Really; before you read what follows.)

You could just name the hooks. Let’s name them action_hook and filter_hook and stick these names on their handles.

So all you’d have to tell me is, “Take this bag and add it to action_hook”, for example.

Two hooks, two functions

Let’s complicate things a little. Imagine, you’ve left two boxes for me; both exactly the same in appearance. I’m sure we can agree that we need to name the boxes, as well.

Let’s say that the boxes have very important functions and therefore, name them function_a and function_b.

Now you can easily instruct me to add function_b to action_hook. Again, follow the instructions I’ve given earlier and say this instruction aloud.

Whatever you just said aloud (or just thought of it; you don’t want to appear bats#!^ crazy or you won’t follow instructions and are straightaway reading this; not good) could also be rewritten as:

Using a bag, on action_hook, add function_b.

If we agree that this will always be the sequence of your instruction, you could just say

bag, action_hook, function_b

to save time and effort. (A good developer is always interested in saving time and effort.)

add_action, add_filter

Let’s make it even more complicated. What if we had two kinds of bags for two kinds of hooks? Since they are used for adding the boxes to the hooks, let’s name them add_action and add_filter. So, the instruction becomes:

add_action, action_hook, function_b

Or, in WordPress terms:

1

2

add_action('action_hook','function_b');

add_filter('filter_hook','function_a');

In summary

add_action and add_filter are the functions (mediums/bags) used to add (hang) your functions (boxes) to an action or a filter hook.

In other words:

add_action and add_filter are used to add functions to an action hook or a filter hook, respectively.

The first parameter is the handle of the hook. It is a unique identifier (name) of the hook.

The second parameter is the name of the function that we wish to add to the hook.

But, what are hooks?

I hope this has helped some of you to form a visual concept how functions are added to WordPress hooks. What these hooks are is the topic of the next post.

An extra exercise for you

I have represented custom functions using boxes and said we can’t punch a hole in them to hang and have to use bags. Why did I do that?

I could have just added something to the box: a string or a ribbon. Or I could have straightway used bags instead of boxes.The add_action and add_filter functions could’ve been my

The add_action and add_filter functions could’ve been my act of adding the bags instead of the bags. If you can think of an answer, let me know in the comments.