What is a Hook? Basic Guide For Beginners

Hooks are also known as Filters & Actions which are used by developers to make website changes without modifying the WordPress core files directly. Hooks are used in both theme & plugin files to create & add custom functions or edit & remove functions already in your themes code.

Basically, you can modify the core WordPress code and your themes core files 3 ways:

  1. Adding functions
  2. Removing functions
  3. Editing functions

Rather than make changes to the core WordPress code, hooks allow developers to change the functions of the WordPress core files using custom coding that won’t weaken the core files of WordPress or the theme you have installed.

Each time you update your WordPress installation, your changes will not be lost which would be the case if you edited the WordPress core files.

All custom coding using hooks is placed in your child themes  – functions.php file which isn’t effected when you update your plugins or WordPress core files. You will need to save this file before updating your theme.

There are 2 types of Hooks used in WordPress – Filters & Actions: Filters – You can add filters add_filter() to filter out some default functions while leaving other functions active.

  • add_filter()

Example – Here the filters remove the header, sidebar and footer which creates a sales or squeeze page from a standard page template.

function custom_remove_defaults($content) {
return false;
}
function my_landing_page() {
if (is_page('007')) {
add_filter('thesis_show_header', 'custom_remove_defaults');
add_filter('thesis_show_sidebars', 'custom_remove_defaults');
add_filter('thesis_show_footer', 'custom_remove_defaults');
}
}
add_action('template_redirect','my_landing_page');

This custom function consists of:

  1. A function we have created using a descriptive name
  2. The names of the hooks we want to filter out
  3. The name of the action we want to execute along with the name of the custom function

This code has been created using Thesis filters so you would need to modify the filter names and page I.D number to make it work with your theme. Actions – You can use Actions to add functions add_action() and also to remove functions remove_action().

Action Hooks provide the location where you can add custom coding like HTML to that specific location which the hook refers to.

  • add_action()

Writing Hooks normally happens in your child themes functions.php file located wp-content/themes/child/functions.php

WordPress Hooks

Different themes offer different names for their hooks and even have different locations for the output of the hooks, however the principal is the same.
Note: Canvas Hook/Filter Reference shows you the exact Woo theme locations of where your hooks will be used.

You can see from this Woo hooks map exactly where you can place your custom code using Hooks. Thesis also offer a plugin which creates a Hook Manager like the Woo Hook manager.

  • The Thesis Open Hook Plugin is free and an excellent solution for adding any type of content or code anywhere there’s a hook in Thesis.
  • The Woo Themes Hook Manager is also another option to add HTML to specific locations around your theme without the need to write code to your themes functions.phpfile.
  • The Simple Hooks Plugin for Genesis is a free plugin which basically gives you the same features as the Thesis open hook plugin so you can display any type of content in any location there’s a Genesis hooks.
  1. First step to using Hooks in WordPress is to add a function which will allow you to add your custom content (normally HTML)
  2. Second step is to Hook your custom content to the correct location in your theme using the correct hook for that location

Add Actions

Hooks execute the functions you apply to them. All you need to do is add the add_action()command

add_action(‘hook_name’, ‘your_custom_function’);

The Hook name will depend on which theme you are using. Remove Action Removing existing functions from WordPress or your themes functions can be achieved by using the

remove_action(‘hook_name’, ‘function_you_want_to_remove’);

To “hook on” to a function, you’ll need:

  • The label of the hook you want to hook onto (for example, `woo_post_after`).
  • A function which we’ll use to display your custom content.
  • An `add_action()` line to perform the “hooking”.

The best way to learn and master Hooks – Filters and Actions is to setup a test site and try them by referring to the:

  1. Map of hook locations for your particular theme (Canvas Hook/Filter Reference)
  2. List of functions you can create using Filters & Actions

I hope this gives you some idea of what a hook is and how you can start learning more about how to use hooks in your WordPress theme.


Comments

17 responses to “What is a Hook? Basic Guide For Beginners”

  1. […] find a list of 3 hook plugins near the end of this post about WordPress hooks which you can use to execute shortcodes in any hook […]

  2. […] simple hooks plugin works only on the Genesis theme as it uses all the Genesis hooks and a few WordPress hooks as […]

  3. There appear to be 1,728 hooks available in WordPress. All I want to be able to do is to use functions of my own making, for child themes of my own making (not off-the-shelf themes), without having to re-insert the hooks and filters that build them, when WP gets updated. I guess you mean that Genesis, or some similar framework is necessary for that.

    1. Brad Dalton Avatar
      Brad Dalton

      Its the best solution in my opinion. There are others which i have tried but its the best quality coding and the easiest to customize.

      You can also use all the WordPress hooks and filters in Genesis child themes.

  4. I’m struggling here a bit. “…a theme that doesn’t support hooks…” but I’m writing my own hooks for my own child theme. Is that no good?

    “With Genesis, the hooks are always included when the framework is updated” … but what happens when WP gets updated? Don’t you still have to make sure the hooks work with the new WordPress code?

    (apologies for newbieness)

    1. Brad Dalton Avatar
      Brad Dalton

      Genesis is not effected when WP gets updated because they run bleeding edge nightlies of WP and update Genesis to make sure its fully compatible.

      Writing your own hooks is o.k but how about filters?

      Easier to use a theme framework which already includes both.

      1. I don’t have perfect understanding of all this as I’ve just become acquainted with the idea of this framework thing. Genesis has its “own hooks”… but they’re not mine – the ones I’m writing. Are you saying that whatever whacky hooks I’m writing for my current home-grown and idiosyncratic child theme, the Genesis framework can accommodate them? I wouldn’t be delimited by someone else’s canned themes?

        Think I better do some research on this. Thanks for sparking my interest anyway!

        1. Brad Dalton Avatar
          Brad Dalton

          There’s 72 hooks in Genesis which covers everything plus there’s a huge range of filters already built in.

          The filters enable you to modify existing core Genesis functions from your child theme like hooks do but without editing the Genesis core.

          Its the best WordPress design framework.

  5. Thanks for explaining that to me. Can I ask, now that I (unfortunately) have edited WP’s twenty twelve header.php (though thankfully no other twenty twelve file) – what should I do? How about – copy my edited header.php to my child theme and just leave the edited file in the twenty twelve directory? Or maybe I should replace the twenty twelve header.php with a copy extracted from a fresh copy of WP?

    Concerning Genesis, do you have a link to some place that describes its features and advantages? Sounds good if I don’t have to edit WP core as you describe.

    Thanks again.

    1. Brad Dalton Avatar
      Brad Dalton

      Yes do that. Copy the file to a child theme and replace the parent file.

      Here’s the settings page http://wpsites.net/wordpress-themes/genesis-theme-settings/

  6. It still didn’t render! Anyhow I hope you get my meaning – I write the function in my child theme’s functions.php file, but I also have to insert the call to the hook in the twenty twelve header.php file for it to work – so I *am* modifying the twenty twelve header.php, so if the twenty twelve theme is updated, I have to re-insert the hook in the new twenty twelve header.php file.

    1. Brad Dalton Avatar
      Brad Dalton

      That’s right.

      With Genesis, the hooks are always included when the framework is updated so all your child theme custom coding still works.

      You can clearly see how much harder it is when using a theme that doesn’t support hooks.

  7. Oh shoot. The code didn’t render here properly. The function in my child theme’s functions.php is:

    function add_extra_div() {
    echo ”;
    }
    add_action(‘my_extra_div_hook’, ‘add_extra_div’);

    And the code I have to insert in the twenty twelve header.php in the correct place is:

    do_action(‘my_extra_div_hook’);

  8. You write, “Hooks are also known as Filters & Actions which are used by developers to make website changes without modifying the WordPress core files directly.”

    But surely you *do* have to modify the WP core files in many cases – unless I have something very wrong here.

    An example: I want to add an extra div in the twenty twelve theme, just between the hgroup div and the nav div. I write this function and add it to my child theme’s functions.php:

    <?php
    function add_extra_div() {
    $CR = chr(13).chr(10);
    echo '‘;
    }
    add_action(‘my_extra_div_hook’, ‘add_extra_div’);

    ?>

    I then have to open the twenty twelve header.php and insert, between the hgroup div and the nav div, this:

    My extra div is now rendered in the site. But I had to modify the twenty twelve header.php.

    So if the twenty twelve theme is updated, I have to re-insert the hook in the new twenty twelve header.php file.

    Am I missing something?

    1. Brad Dalton Avatar
      Brad Dalton

      You should always use a child theme and never change the core parent themes files.

      The problem is, your theme doesn’t include hooks which makes it significantly harder to customize.

      With Genesis, you can simply hook the header image in from your child theme.

      With Twenty Twelve, you should copy the header.php file to a child theme which is exactly what i recommend in another post.

      You NEVER edit the core WordPress files.

      Go and buy Genesis. Its the best advice i can give anyone who uses a free default theme.

  9. […] your themes uses hooks, then you’re in luck as its the easiest way to execute php code in […]

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.