How to Manage Code Snippets in WordPress
What is a Code Snippet Manager?
A code snippet manager is a simple way to organize small snippets of code like this:
It use to be that you needed to do this manually through the code, but now there are plugins to help you insert these small bits of code without knowing how to code.
Installing any 3rd party tool that requires you to communicate back to it usually requires a code snippet (for example the Facebook Pixel).
A very common use case for websites is Google Analytics and Google Tag Manager.
Installing a Code Snippet Plugin
As much as I try not to install plugins on my WordPress site, this one is really helpful in managing code since I’m a non-coder myself.
To get started, log into your WordPress dashboard and go to Plugins > Add New which will take you to the Add Plugins search area in WordPress
In the search box, type in “header footer” and look for the plugin by WPCode
Click the Install Now button
After the plugin installs, click the Activate button.
Once you see “Code Snippets” on the left sidebar of your WordPress dashboard you have installed it correctly.
Installing Snippets
On the left sidebar, hover over Code Snippets and select the Header & Footer option
You will now be on the Global Header and Footer page.
To install a snippet, simply copy and paste the snippet either into the header, body or footer depending on the instructions given to you by the tool you are trying to install.
Below is an example of installing the Google Tag Manager snippets using this plugin.
The red <head> code, highlighted in red below, would be pasted into the “Header” part of the plugin whereas the <body> code in green would be pasted into the “Body” part of the plugin.
Note that most plugins only require a single paste, but this specific tool (Google Tag Manager) requires two parts.
Once you’re done click the Save Changes button in the top right corner.
If you have multiple Header, Body or Footer snippets, just paste them below one another and the page will load them all.