elegant themes

The importance of the wp_footer(); plugin API hook

| November 12, 2009 | 4 Comments

About a week ago I wrote a post about a new WordPress plugin released by Semantinet called Headup. When Semantinet first asked me to install the plugin, it actually didn’t work. They looked into it and realized that the reason for this is that WordPress Garage doesn’t have the wp_footer hook in the footer. I didn’t get too excited about that, and told them there are probably a lot of blogs out there that don’t have this hook, and that they should make sure their plugin is compatible with blogs that don’t have the hook so that it will work in most cases.

They took my advice and modified the plugin, and it worked.

Today, one of our clients contacted us saying that they are trying to install a certain  WordPress analytics plugin, and the code that the plugin produces appears in the footer when they switch to the default theme, but it doesn’t work with the theme we created for them.

I realized that it must be the same missing hook problem, and we looked into it and identified the following hook which indeed was missing from their theme:

<?php wp_footer(); ?>

We added it to their footer.php file, and the plugin started to work!

So take note theme developers for the WordPress community and for private clients (I am including myself in this): it is important to run through a checklist of code snippets that your WordPress themes should contain so that users and clients can enjoy smooth running WordPress sites.

<?php wp_footer(); ?> is just one of them. The WordPress Codex has a very handy page called Theme Development that goes through functionality and code that WordPress themes should have. Here are some important sections:

Theme Template Files List – list of all the possible theme template files.

Plugin API Hooks – list of all the pieces of code needed for plugins that use those hooks to work. Weblog Tools Collection reported that another API hook that’s regularly forgotten in themes is wp_head();.

The best place for wp_footer();

WP Designer (when he was still writing his amazing blog) wrote about this hook and discusses the ideal placement for it within your theme files. He says that often plugins will break your theme if they use this hook, so it’s best to put it in a style-less div container “that your layout doesn’t depend on. Otherwise, you might end up with an incomplete layout while waiting for a slow loading plugin.”

I’m a bit embarrassed that I wasn’t aware of this apparently basic yet important WordPress theme issue. But I hope that by admitting my lack of knowledge I can help some of you solve plugin problems or theme problems.

Tags: ,

Category: Plugins

About Miriam Schwab: Miriam is the friendly CEO of illuminea, a WordPress design and development agency. Miriam is a huge fan of WordPress and has been using it for over five years now. In addition, Miriam and her team have been organizing the local Israeli WordCamp conferences for the past few years. View author profile.


Comments (4)

Trackback URL | Comments RSS Feed

  1. Voya says:

    wp_head() and wp_footer() are a must for every wordpress theme, if you want to use plugin.

  2. Ryan says:

    There is no point in placing the function inside DIV tags. Just place it before the </body> tag instead.
    The wp_footer() function is primarily used for loading javascript hence you want it at the bottom of the page, directly before the </body> tag.
     

  3. Tal says:

    thanks again for helping us solve the issue.
    as you mentioned, wp_footer is missing for some very popular themes. (if it was mandatory, i would expect wordpress to refuse  those themes…)
    and the problem with wp_header is that if you inject out of side scripts, it may slow down your site. in most popular browsers, nothing in the body runs until all the head section is retrieved, that includes those out of site scripts.
    so in order to reach full compatibility without harming the performance, as a plugin author, you have to use both hooks cleverly or use a different hook.
    Tal Muskal
    SemantiNet

  4. [...] footer.php was missing . Once I pasted that bit of code, at the very bottom of my footer.php, it worked like a charm! (No Ratings Yet)  Loading … [...]

Leave a Reply




If you want a picture to show with your comment, go get a Gravatar.

More in Plugins (14 of 112 articles)