Add Code to WordPress Header Without a Plugin

Add Code to WordPress Header Without a Plugin

At Learning Glue we talk a lot about the advantages of using a child theme for your self hosted WordPress site, and we consider that approach to be best practice for any WordPress site.

As we hope you know, one of the most important advantages of using a child theme is that you can update your theme without worrying about losing styles, scripts or other custom configurations.

With that in mind, we will assume your site is using a child theme and you have your function.php and style.css files neatly contained within your child theme folder – if you don’t know what we’re talking about we recommend you take some time review our WordPress Fundamentals course, you’ll be glad your did!

Theme Structure

The structure of your theme is complex. There are hundreds of files that each have a different job, all of the pages on your site rely on multiple files working together, like a digital jigsaw puzzle. The head section of your pages is a great example – this part of your page contained within a file called header.php within the parent theme.

If you wanted to change the content of the head section in your pages you might think you could simply insert, modify or delete content there. And you wouldn’t be wrong, that action would certainly change that part of every page BUT as soon as you update your theme those changes will be lost and you would have to reupdate that file. We think even the idea of a reupdate should be avoided – not only is it a made-up word, it’s also something that can be gracefully avoided with a child theme an a little PHP code.

Functions

Within your child theme folder is a file call functions.php. This file is often ignored but novice WordPress users but we think it is one of the most powerful and useful aspects of using a child theme.

Functions are independent scripts, sometimes called code snippets, that you can write, or borrow, to perform certain tasks to make your site do something that it ordinarily couldn’t do. We’ll use a function to insert some content into the head section of your pages, but you can use functions to do all kinds of actions. Learn more about function in our PHP essentials course.

A basic function has 3 essential requirements:

  1. The word “function” must be included before the name of the function
  2. A unique name (that will be used to call or execute it)
  3. A body that lies between two braces or curly brackets, {}.  The body will contain information, instructions and/or calculations that will perform some task.

Hooks

A hook is a type of function that is applied to an action in WordPress (for completeness, a hook is a function that can be applied to an action or a filter in WordPress).

Since we are working in WordPress and we want to make a modification to a theme, we will need to hook the function into the action that manages the WordPress head (wp_head to be specific).

The following script will do just that:

/* Insert a description of what this script does */add_action(‘wp_head’, ‘insert_your_function_name’);function insert_your_function_name(){?>INSERT YOUR CODE HERE<?php};

You will need to make some changes to suit your needs:

  • Between the comments on the first line, replace the text with a good description of what this script will do (to remind you long after you have forgotten you even wrote it).
  • On the next line, change the text insert_your_function_name with the name of your function, the one that you will create on line 3.
  • Finally, replace the text INSERT YOUR CODE HERE with whatever you want to insert into the head section of each page on your WordPress site.

As we discussed earlier, this hook will be placed in the functions.php file within your child theme.

If you’d like to know more about WordPress or PHP check out our courses in these subjects:

Leave a Reply