Blair Williams

Everything is an Experiment

Anyone Can Use WordPress Hooks

Anyone Can Use WordPress Hooks

by ·

Hooks are one of the greatest features of WordPress — yet they are unseen by most WordPress users.

Okay, I'll admit, hooks are only available in the code — but I believe they're simple enough to be used by anyone technical enough to use a text editor and FTP.

WordPress has a really good Intro to Hooks and there are a couple of WordPress Hook databases out on the web too … but these might be a bit technical and overwhelming for many users wanting to customize their blogs.

This is my basic overview of what hooks are for and how they can make your life easier as a WordPress user.

What are Hooks?

Let's say you are using the Thesis theme for WordPress and you want to add something above my blog's title. The most obvious option would be to go to the Theme files and modify them directly.

Easy enough huh?

Well, lets think about that cowboy — editing your themes, plugins or WordPress directly will work well … but what happens when a new version of your customized theme, plugin or wordpress comes out and you upgrade?

Yeah … that's right, you'll have to either overwrite all of your customizations or remember to re-write all of your customizations every time you upgrade.

Luckily WordPress has provided us with a way of modifying code, HTML and styling in WordPress, WordPress Plugins and WordPress Themes without modifying the actual source. This means that your customizations will be located somewhere else and will be present even if you upgrade.

Many WordPress Themes & Plugins and WordPress itself provide hooks for doing all kinds of things. A good example of this is the Thesis theme for WordPress — Thesis provides great documentation on its wide array of hooks that enable you to do everything from adding text above your title to altering your sidebars.

How Do I Use Hooks?

Now back to my Thesis example — instead of looking through it's source code, I can just use it's ‘thesis_hook_before_title' hook.

Here's how my code would look to accomplish this:

add_action('thesis_hook_before_title','my_cool_before_title_html');

function my_cool_before_title_html()
{
  ?>
  <p>I really like cheese -- a lot.</p>
  <?php
}

After putting this code in place, my blog's title that used to look like this:

Now looks like this:

Breaking It Down

Now that you've seen some of the possibilities of hooks, let's look at what I just did in the example above:

add_action( 'thesis_hook_before_title', 'my_cool_before_title_html' );

Okay, this line tells WordPress that we're going to add an action hook (there are actually 2 types of hooks — actions and filters but for this example we're only going to worry about actions). The first parameter (‘thesis_hook_before_title') tells WordPress which hook we want to use and the second parameter (‘my_cool_before_title_html') tells WordPress which function (a function is just a named block of code) will be used when the hook is executed.

The hook name is defined by wordpress, your theme or a plugin but the function name is defined by you. You want to make sure your function name is absolutely unique so that it doesn't conflict with any other function names (for instance, you wouldn't want to name your function “title” — you'd name it something like “blair_title” or something like that).

Now let's look at the handler function:

function my_cool_before_title_html()
{
  ?>
  <p>I really like cheese -- a lot.</p>
  <?php
}

This is a simple PHP function that just returns HTML code. You could put any HTML code you want between the ?> and <?php tags in this scenario. Just be careful, not all hooks expect HTML — so your PHP function may need to do a bit more than just writing HTML — to be sure consult the hook's documentation.

Where Do I Put My Custom Code?

This is a question I hear all the time. Really, you can place your customizations any place that code gets executed in WordPress.

Quality themes and theme frameworks like Thesis, Hybrid and Thematic have a specific place to add these customizations. For instance, in Thesis you can rename the “custom-sample” folder to “custom” and then add your code to the “custom_functions.php” file.

However, I recommend creating your own plugin. Yeah, I know this may sound scary but it's really not too bad.

All you have to do to turn this code into a simple plugin is:

  1. Create a new php file named ‘blairs_thesis_customizations.php' or whatever you want your plugin to be named
  2. Add a plugin header to the top of the php file. This is a pre-defined set of code that tells wordpress the name of the plugin, etc. You'll see it in the example below.
  3. Add your custom code to the php file.
  4. Upload your plugin to your blog.
  5. Activate your plugin like you would any other plugin.

… And here's a complete example. You can actually use this as a template to create your own plugin:

<?php
/*
   Plugin Name: Thesis Customizations
   Plugin URI: https://blairwilliams.com
   Description: My Own Thesis Customizations
   Version: 0.0.01
   Author: Blair Williams
   Author URI: https://blairwilliams.com
   Copyright: 2010, Blair Williams
*/

add_action('thesis_hook_before_title','mythesiscust_before_title_html');

function mythesiscust_before_title_html()
{
  ?>
  <p>I really like cheese -- a lot.</p>
  <?php
}
?>

You can, of course, add more add_action statements and functions to do all kinds of customizations within this file.

The beauty of this approach is that your code will always be 100% separate from your theme or other plugin — which will make upgrades with your consistent customizations a snap!

Reader Interactions

Comments

  2. I have been using Justin Tadlock’s Hybrid theme framework for a few years now, and have been making use of hooks quite extensively, but I have always placed the code in the child theme’s functions.php file.

    Is there any benefit to using the code as a plugin versus keeping it separate in the child theme’s functions.php file?

    • Well it depends on how the child theme is implemented — some themes have their own child theme mechanism… and most of them tell you that you should put your child theme within the parent theme’s directory. I think this is a bad practice because once you put your customizations within the parent theme’s folder you have to worry about it every-time you upgrade the parent — to me it actually kind of defeats the purpose of hooks to begin with.

      If you create a child theme that is in a separate directory from the parent (the wordpress way to do it) then it’s great … probably better than creating a plugin for it.

      But, if all you’re doing is simple changes then I think the one file plugin approach makes it pretty simple.

  6. Great post! I just wish I had discovered it 10 blogs ago lol.

    Seriously your my hero of the day for all the time/hassle I’ll now avoid in the future!
    Thanks
    Zaak

  7. Thank you, Blair, really!
    You are surely great guy taking time to share and explain all so well in and in a detail.
    I do appreciate your ideas and help very much. Not being really a “techie”
    I always struggle to get to the bottom of technical matters and usually those tech. gifted take for granted that all would understand their “jargon” 🙂
    You do better!!!
    Great success to you always,
    Best regards,
    Maya

  8. Thank you for this terrific info. I’m still a little confused. Say I wrote some code to do something. I wrote it in html with javascript. What code specifically do I have to add to turn this into a plug-in widget for wordpress?

    • This code is written in PHP … once you’ve created your plugin you can either FTP it to your plugin directory and activate it in your wordpress adming or zip it and upload it using wordpress’ built in plugin uploader (“Plugins” -> “Add New” -> “Uploader”). Either way, it just installs like a normal plugin would…

      Hope that helps.

  9. Great article, and something I wish I had known about a good while back.

    Guess I will have to go and strip out all my custom modified code and turn it into hooks. I am glad it will pretty much be a cut and paste modification.

    I’m off now to read the rest of your blog, see you in the comments section

  10. Awesome! I’ve hated working with themes like Thesis because I can’t easily jump in and modify the code from the Appearance Editor. — It may not be the ideal, but it’s my preferred way to work 😛 — As it becomes more common for Premium Themes to use hooks, I was getting really frustrated!!

    I love your idea of placing the code in a custom plugin. I can continue living dangerously and edit my code “live” in the plugin editor, but still take advantage of the best themes on the market.

  11. As evidenced by the way my blog has changed drastically from its original look, I’m fond of tweaking the innards of my theme. This post is another one of those tips that I can’t wait to apply to my blog. Thanks Blair.

  13. Hi Blair,

    Great info, thanks. Question for you on hooks. I am using the Coralis Theme and have a banner plug-in that adds code just below the blog title showing my rotating banners. Problem is the banners are aligned to the far left and are not aligned properly on the page. My website is http://www.menshealthcures.com

    How do I use a hook to properly align the banner above my blog title?

    Thanks,
    Ken

    • I don’t think you need a hook on this one. Not even sure if your theme has that many hooks available to use. But since it’s being added via a separate plugin you’ll probably have to manually enter some img padding values in your theme’s CSS file.

    • Hi Ken, this is just a FYI, {Sorry for using your site for this Blair}, but the banner you are talking about on your main page –the link isn’t working. it’s dead.

      Peace out.
      Stephen.

  14. I am getting ready to release 3 Free/GPL themes and was wondering…how important is it to add child theme capabilities to your themes? Will the average user benefit from these enough to justify using them?

    thanks!

    • Not a ton of users are “techy” enough to create child themes but for those that are it offers a lot of flexibility and peace of mind knowing that their modifications are safe, even through updates of the parent theme. Besides, I don’t think there’s really a lot if anything that has to be done to allow your theme to have child themes as wordpress automatically handles most of that.

    • Yea that was my thought also..there is not much to do in order to add the extra support. So why not 🙂

  15. Very Nice Post Blair, I like your site as well, it’s very clean and SEOPtimized, I will be back again and again I feel.

    Peace OUT!,
    Stephen.

  16. Blair,

    I started using the prettylink plugin a couple of weeks ago. I had no idea it was yours! I was kind of a surprised to see your name on my wordpress dashboard. It’s been a while since we’ve talked. We’ll have to catch up.

    Excellent website, plugins, and posts!

    Dane

  22. Thank you for that article Blair, I am always working on my SEO and this is something that I can use, you have made it reasonably easy to understand, so I have bookmard the article for me to refer back to.

  23. Thanks for the lesson, Blair
    I have started using your themes and plug ins mainly for the support and because they are so user friendly. I am a newbie with websites and have been recommending your products to others as well (Just signed up for affiliate program).
    Keep up the good work, Gerald Hiebert

  24. Thank you Blair 🙂 for all your work 🙂
    This is by no means easy I think being a newbie, I will be back for more and I have your free lessons, which I am sure will watch many times, a big thank you :)) tess

  25. Blair,
    Been using Thesis theme, Catalyst as well, have used hooks to a degree, honestly, never really got it. You’ve cleared some things up for me, this is one of my new favorite sites. Thank you so much for this.
    Will

Trackbacks