When coding a WordPress site, there are three elements you need:
- Change, hide, or display HTML elements.
- Add values to CSS variables and run complex operations on them like merge variables or provide a response after an action is taken (like a click).
- Change the layout and design of your WordPress theme (if you’re prohibited from controlling certain elements).
- Alter or enhance the functionality of a WordPress plugin.
- Enhance your site with dynamic content like sliders, animation, video players, drop-down or hover effects, calculators, and other interactive elements.
- Hook an external source or element into your site, like Google Analytics or a third-party API.
- In the head of your theme for site-wide applications of the script.
- Within the body of a web page for page-specific applications.
Rule #1: Don’t Use the WordPress Editor
Rule #2: Don’t Modify Your Files Directly
The WordPress Codex includes some steps on what to do with your file next. For easy reference, here is what is recommended:
Whether you have one script or multiple scripts, make sure to define the function for each within the file. For example:
Then, call on the file from the header of your website using a script like this (you can add this to the header using a plugin):
Rule #4: Use a WordPress Plugin
Insert Headers and Footers Plugin
While there are a couple other headers-and-footers plugins available in the WordPress repository, this one from WP Beginner is by far the most popular and trusted of the bunch.