What are WordPress Hooks and Why Should I Care?

0

Hooks are for fish, right? When I started working on WordPress development projects, I ignored hooks initially. I didn’t know what they were and hadn’t run into the term in other settings. Frankly, I thought hooks were some styling tool.

Well, I was in for a surprise and quickly found out that hooks are a WordPress developer’s best friend! At least for me, learning how to use them has helped me create a far more precise and functional set of tools.

What’s a Hook?

When a post or page loads, WordPress has a number of "places" in the document where various pieces of code are loaded. For example, the head, content, widgets, and footer areas are the most common locations for code.

When the head of the document is loaded, any code that is supposed to be placed in the head section is "hooked" and run where it’s needed.

There are two kinds of hooks – actions and filters. Action hooks run when a particular part of a page is loaded – such as the head. Filter hooks modify content as opposed to adding content. I’ll go into more detail for each so you can get an idea of how each is used.

Action Hooks

Let’s say you want to add some CSS to your head section of your WordPress theme. Using an action hook will allow you to do just this so that all your posts and pages have access to the file. Using the below code, first we use the action hook call, then define the function, register the style and then enque the style.

add_action( 'wp_enqueue_scripts', 'some_css_function' );    
function some_css_function() {        
 wp_register_style( 'some-style', plugins_url('style.css', __FILE__) );        
wp_enqueue_style( 'some-style' );
}

Let me break this down a bit more for the newbies.

The add_action call has two parts to it, the hook and the function to be hooked. In this case, we are telling WordPress to hook some_css_function to wp_enqueue_scripts – the proper method for informing WordPress of a function/file.

Then we define our function. In this case, we’re using the built-in wp_register_style function to define a style, reference the file, and then tell WordPress that it’s a file.

Lastly, we tell WordPress to load up the styles, which are in the file style.css.

Filter Hooks

You can use filters to pass data through a function. Filters can be used to change just about anything. They’re a powerful tool for customizing content. Here’s a fun example for replacing an author’s name if they’ve recently changed it – which happens.

add_filter ( 'the_content', 'change_author_name' );
function change_author_name($content) {
$old_name = array('Smith','Mrs. Smith','Ms. Smith');
$content=str_ireplace($old_name,'Ms. Brown',$content);
return $content;
}

Once again, let’s step back and look at what we’re doing. The first thing we do is declare the filter – it’s going to apply to the_content and will use the filter function change_author_name.

Next, we declare our function and use $content as an argument, which we will describe later. Then we create an array of names we want to match up against – this would be the old name of the author, in this example.

Next, we define the $content variable as a string replacement of the array of old names with "Ms. Brown". Last, we call return $content to run the function.

Why Should You Care?

WordPress can be very sensitive to where and how it gets information – from functions to files to styles. Hard coding CSS or other files/scripts can be very problematic. One upgrade or change to your theme or WordPress core can break everything.

Also, if you want to make plugins or themes for others to use, the proper method for modifying WordPress is through the hooks API. Properly registering your changes with WordPress is the way to go to prevent problems.

You can also upgrade your plugins and themes if you’ve properly built your code. You can’t keep a long-term set of updated code that you can systematically improve – or adapt to WordPress with – if you don’t use hooks properly.

Sure, you can create a short-term solution or just hard code your CSS/scripts into the WordPress header.php file, but an upgrade of the theme or even changing themes means all your changes are gone.

Quick Recap

Hooks allow you to properly add your code to WordPress. You can apply your hooks at particular points in WordPress, such as when the header loads, or based upon specific events, such as when a particular word appears and your hook filters the content.

Action hooks are designed to be able to allow you to inject your own code at specific points. wp_head, wp_content, and wp_footer are just a few common examples.

Filter hooks can be applied to specific areas of your post or page and can be used to customize various elements. Think in terms of manipulating the content.

Further Reading

If you want to really dig into the WordPress codex to understand how hooks can be used, here are some resources for further reading:

Share on Facebook Back to Top

Speak up! Let us know what you think.