Skip to content

Using WordPress: Add Script to Header

There’s a tricky thing about this idea, “WordPress add header script” I have written down as our topic today. That problem is that “adding a header script” can mean a bunch of things. In our case, I’ll be explaining how a WordPress user (who may be a developer, but doesn’t necessarily understand code that thoroughly) can add a JavaScript file or code to their pages.

We’re not going to discuss how to customize the appearance of your WordPress header or footer. There are other article about that. Instead, we’re just explaining how to add the code snippet that might be the analytics, marketing, or some other “single line of JavaScript” someone needs added to their page. Sound good?

Video Explaining the Best WordPress Plugin to Add Scripts

Because we’re assuming that this task is being some by someone who’s not an expert on PHP or JavaScript development, we’ll use a plugin to add the script to the header of our page. Watch away:

Written Guide of Using a WordPress plugin to Add Header Script

Here’s the basic process we follow in the video above to add JavaScript(s) to our WordPress page headers:

  1. Go to “Plugins > Add New” once you are logged into your WordPress dashboard. (You must be able to install plugins for this to work.)
  2. Search for the “Insert Headers and Footers” plugin from the folks over at WPBeginner. Install and activate that plugin.
  3. Now we’ll use the plugin to add a script to our WordPress head. We’ll need to go to “Settings > Insert Headers and Footers” in the left sidebar once the plugin is running.
  4. Depending on whether your script needs to be added to your page headers or footers, you’ll paste it into the appropriate box. Then press “Save.”

With those step, your done. You’re all set to get your WordPress header scripts running on the pages your visitors see. Hopefully that wasn’t too hard.

The above Quick Guide should serve you well for administering a WordPress site. If you’re developing your own plugins or themes or WordPress though, this is not the way you add JavaScript to your WordPress pages. Instead you’ll want to understand the more code-focused way to add header scripts in WordPress. That’s using a little function called wp_enqueue_script in WordPress PHP. We’ve got a great Quick Guide all about that:

Or instead if you want an even more thorough explanation, here’s our article about using that same function. That article gives a little more theory and explanations of managing WordPress header and footer JavaScript insertions.

Properly Add Custom JavaScripts and Styles to Pages in WordPress


Yay! πŸŽ‰ You made it to the end of the article!
David Hayes

Inline Feedbacks
View all comments

Or start the conversation in our Facebook group for WordPress professionals. Find answers, share tips, and get help from other WordPress experts. Join now (it’s free)!

Would love your thoughts, please comment.x