As a WordPress user, you may have occasionally wished you could tweak your pages or posts beyond what your theme allows, without breaking it. Maybe you’ve wanted to add an interactive element to your site, for example, but WordPress strips out your coding when you save your changes.
- Executing events on a web page
- Form validation, where you need to store values inside variables
- Third-party APIs that can be placed on pages or posts
This WordPress plugin is self-described as the easiest way to add code to your WordPress site. Insert Headers and Footers is brought to you by WPBeginner, and can help you integrate third-party APIs from social media platforms and more. All this is possible without the need to edit your WordPress theme directly.
- Provides a simple interface for one-stop header or footer script editing and insertion
- Enables you to choose between inserting JS code in the header or footer
- Lets you add Google Analytics to any theme
Price: This is a free plugin.
2. Simple Custom CSS and JS
- Includes a text editor with syntax highlighting
- Lets you print your code out inline or in a separate file
- Enables code placement in the header or footer of the site
- Makes it possible to add as many codes as you want to the front-end or the admin sides
- Preserves your changes when you change your theme
Price: This plugin is a free option.
- Includes support for WooCommerce shop pages
- Enables you to apply JS code to all pages and posts, or specify certain ones
- Is compatible with Gutenberg
- Supports terms and category pages
Price: There’s a free version, and a premium version starting at $7.90.
This powerhouse WordPress plugin moves your important scripts to your site’s footer. You may want to do this to reduce loading times, or clean up any bottlenecks to image loading if your theme runs a lot of scripts. It should be noted that that Scripts to Footer only works if you have plugins and a theme that uses wp_enqueue_scripts correctly.
- Enables you to disable the plugin’s features on specific pages and posts directly, via the post/page edit screen metabox
- Lets you disable the plugin on specific archive pages via the settings page
- Makes it possible to choose which scripts to keep in the site’s header
Price: This plugin is 100% free.
- Enables you to add front-end styles without modifying your theme files
- Eliminates the need for extraneous custom plugins or hacks to add functionality
- Helps you add third-party scripts for advertising and visitor tracking, or social media channels
- Makes it possible to avoid using FTP, and manage all code additions and changes within your dashboard
Price: You can try the free plugin, or pick up a premium version for $29.
6. Scripts n Styles
- Lets you add classes to the body tag and post container
- Enables you to create scripts for the entire site through a global settings page
- Adds new classes to the TinyMCE formats drop-down menu, for direct styling of posts and pages
- Provides the option to restrict usage to specific user types
Price: There’s no cost for using this plugin.
Step 1: Install and Activate the Plugin
The first step is to simply search for the plugin from your website’s Plugin tab, and then install it.
Once you have done that, you will see an Activate button. Your plugin is not fully functional until you complete the process by activating it.
Once the plugin is activated, you’ll find a new item under your Settings menu in your WordPress dashboard, labeled Insert Headers and Footers.
This is where you can add all the scripts you want to run in either the header, the footer, or both. That includes tweaks to your theme, integration with third-party APIs, and CSS alterations.
Learn More Developer Tricks With WP Engine
As a WordPress website owner or developer, quality resources make all the difference in your work. At WP Engine, we have plans and solutions for all budgets. We’re here to bring you the best WordPress solutions and help you take your sites to new limits!