Two key things to add to a WordPress theme are the wp_head and wp_footer functions. These two functions are known as “action hooks”. Depending on how much you know about theme development, action hooks may be easy or difficult to understand. Action hooks are placeholders where code is dynamically added to a theme.
What this means is that the wp_head and wp_footer functions act as placeholders for plugins to insert code to the <head> and <footer> of the theme respectively. For example, if you have a Google Analytics plugin installed on your WordPress website, the plugin uses wp_head to add some javascript to the <head> of your website in order for Google Analytics to track visits. Without this code the plugin would not be able to add the code to your theme.
To add the wp_head function correctly to your WordPress theme, simply open your theme’s header.php file and add the following line of PHP code right before the closing head tag (</head>):
<?php wp_head();?>
To correctly add the wp_footer function to your WordPress theme, open the theme’s footer.php file and add the following line of PHP code before the closing </body> tag:
<?php wp_footer();?>
You may find that a WordPress plugin isn’t working on your website. Maybe the plugin worked at one point, but then you updated either the plugin or WordPress and it stopped working. Maybe the plugin never worked at all. If you do find that you are having trouble with a plugin, your first step should be to make sure that you have wp_head and wp_footer correctly placed in your template.
Action hooks like wp_head and wp_footer are essential to how plugins interact with your WordPress theme. In the past these funtions were not always needed, so if you have a theme that hasn’t been updated in a while, it would be a good idea to add these action hooks to protect your theme from some future problems.
For me, I added the wp_head into my theme, and things stopped working! Perfect example, most of the css for my hv3 block won’t work with the wp_head added to the theme. No matter what I do or try, I just can’t seem to get it to work.
Hi Jennifer,
If you’re sure that you put the wp_head in the right place (right before the closing head tag), then it sounds like the code that the wp_head is spitting out is interfering with something.
It’s hard to tell for sure without looking at it, but it sounds like one of your plugins is causing the issue. Try deactivating your plugins and seeing if that changes anything.
THANX BRO..
This blog really helps me to understand the functionalitya of wp_head () and wp_footer() you did really a great job thanx for this tutorial.. thanx once again..
Happy to help!
Thanks a million! couldn’t figure out why a lightbox plugin wasn’t working. I had the header code, but not the footer code; and the plugin’s js only worked in the footer area 🙂
Great Danny! I’m really glad to hear I could help!
When I added before , I was having problems with other features of the site working. I added before instead of before and it worked.
John,
Glad it worked out for you and thanks for updating!
I added before in the header.php. This fixed the issues I have having with widgets not showing up correctly; however, it caused other problems with the site. The main image was replaced by a never-ending ‘loading’ wheel. Any tips on how I can add action hooks to enable plug-ins and not mess up the rest of the site?
?php wp_head();? Is causing a space at the top of my blog. Is there a way to remove the space?
Hi Stan,
Do you mean that wp_head is adding a space to your website when you view it in a browser? This probably means that a plugin that you are using is adding code that is causing an issue. Try deactivating each plugin one by one and see if any of them are causing the issue.
Also, make sure that you have the hp_head hook before you close the tag.
Lol . I guess the blog doesn’t display php code at all.
anyways wp_head() kept giving me a problem.
turns out i had to add wp_footer to the end or it would display all wrong even when not logged in .
I was having a similar problem. In my case ,I kept getting this empty space on top .
kept creating an empty space.
I figured out after reading your post that I had forgotten to put in
Its all good now .
That fixed the problem.
Thanks Anup! Glad I could help.
“your first step should be to make sure that you have wp_head and wp_footer correctly placed in your template.”
well how do I know that?
Hi Charles,
You can find the wp_head and wp_footer in the header.php and footer.php template files respectively.
You can find those files by going to your WordPress template directory via FTP on your sever. The files are located in wp-content/themes/your-theme/
Hope this helps!
Thank you for the post. It has helped me tremendously. I just couldn’t figure out why plugins didn’t work on my page.
Glad I could help!
Actually, I mean header.php. lol
Ah, ok. That imports the header.php file into the index.php file. If you open header.php (in the same folder as index.php) you should see
Well, I know all the blogs I write or manage have the footer, but not all of them have wp_head, though all have wp_header. I assume these are different things?
I’m not quite sure what wp_header is. I did some googleing and not much came up. It may be another function that does that same thing as wp_head. Do you mean get_header(); ?
Wait; just making sure I understand this. Those PHP files are already part of the software, so adding this code just makes them more accessible to certain plugins? If that’s the case how wild is that? Why aren’t they automatically there for all themes?
Hi Mitch,
These two functions should be already included in new themes. The problem comes when a custom theme is created or an older theme is being used. “wp_head” and “wp_footer” are being used much more nowadays and some themes may need to be updated.
The reason why I wrote this post is because I was having a problem with a plugin using an older WordPress theme. The plugin worked before, but stopped working after it was updated. 5 hours and tons of debugging later, I realized it was just because the theme didn’t have a wp_footer.