How To Add Custom Code In WordPress
You'll often find code to insert while researching some WordPress problem. Most people who come across this for the first time, have no idea where to place it. The usual response is your theme's "functions.php". But this is a bad idea.
Using functions.php to insert code in WordPress is dangerous for the following reasons.
First, your theme can change. And when it changes, the functions.php file changes as well. This means that you'll have to port your entire code over to the new theme's functions.php. It's an additional step that's inconvenient, and that you might forget.
The second reason is much more serious. Errors in functions.php will crash your entire site. That's because the theme itself is corrupt. WordPress doesn't know how to deal with a problematic functions.php file without bringing down the theme itself. Simple syntax errors will break your site, and that is a very dangerous thing.
For this reason, I prefer to use a custom plugin for adding code instead. And this article will show you how to do it.
On your PC, create a folder with a name like "namehero-plugin-code". Inside that folder, create a new file with a ".php" extension with the same name (namehero-plugin-code.php). Here's an image of the folder and file:
Open the PHP file you created in Step 1, and paste the following code into it:
This is the skeleton custom plugin code. After installation, the "Plugin Name" will appear in your list of plugins.
WordPress allows us to upload only "zip" files. So right-click the folder, navigate to "Send to", and select "Compressed (zipped) Folder" as shown here:
This will create a single zipped file that we're ready to upload in WordPress
Navigate to your WordPress dashboard, and click "Plugins->Add New" as shown here:
Now click the "Upload Plugin" button at the top. This will open up a section allowing you to choose a file from your desktop. Click the button, select the file, and select "Install Now":
This will install upload and install the plugin. When that's done, we just need to activate it as shown here:
Now the plugin will appear in the list of your installed plugins.
It's time to add our code to the plugin!
Let's say you come across a site that asks you to install some PHP code into WordPress. The first thing you need to do is check if it starts with:
Or if it ends with:
If the answer is "yes" to either, remove both of them. Basically ensure that the code on the website doesn't start with <?php , or end with ?> . This is very important.
Next, go to the WordPress dashboard and navigate to "Plugins->Editor" as shown here:
In the next screen, select the custom plugin we just added from the drop-down box on the top right-hand corner as shown here and hit "Select":
This will now allow us to add code to the plugin. Paste the sanitized code you got from the previous step into the text editor as shown here:
After that, click "Update File" and you're done! You've successfully inserted custom code into your WordPress in a safe and flexible way. This code will remain regardless of which theme you choose, and it won't crash your site if something goes wrong either!
Why not Use Functions.php for WordPress Code?
Using functions.php to insert code in WordPress is dangerous for the following reasons.
First, your theme can change. And when it changes, the functions.php file changes as well. This means that you'll have to port your entire code over to the new theme's functions.php. It's an additional step that's inconvenient, and that you might forget.
The second reason is much more serious. Errors in functions.php will crash your entire site. That's because the theme itself is corrupt. WordPress doesn't know how to deal with a problematic functions.php file without bringing down the theme itself. Simple syntax errors will break your site, and that is a very dangerous thing.
For this reason, I prefer to use a custom plugin for adding code instead. And this article will show you how to do it.
Step 1: Create the Directory and File on your Desktop
On your PC, create a folder with a name like "namehero-plugin-code". Inside that folder, create a new file with a ".php" extension with the same name (namehero-plugin-code.php). Here's an image of the folder and file:
Step 2: Paste the Basic Plugin Code into the PHP File
Open the PHP file you created in Step 1, and paste the following code into it:
<?php
/* Plugin Name: NameHero Custom Code Plugin
Description: Place to insert custom code into WordPress
*/
This is the skeleton custom plugin code. After installation, the "Plugin Name" will appear in your list of plugins.
Step 3: Compress the Folder with the File Inside it
WordPress allows us to upload only "zip" files. So right-click the folder, navigate to "Send to", and select "Compressed (zipped) Folder" as shown here:
This will create a single zipped file that we're ready to upload in WordPress
Step 4: Installing the Plugin via the Zip File
Navigate to your WordPress dashboard, and click "Plugins->Add New" as shown here:
Now click the "Upload Plugin" button at the top. This will open up a section allowing you to choose a file from your desktop. Click the button, select the file, and select "Install Now":
This will install upload and install the plugin. When that's done, we just need to activate it as shown here:
Now the plugin will appear in the list of your installed plugins.
Step 5: Adding Code to the New Custom Plugin
It's time to add our code to the plugin!
Sanitize the Code
Let's say you come across a site that asks you to install some PHP code into WordPress. The first thing you need to do is check if it starts with:
<?php
Or if it ends with:
?>
If the answer is "yes" to either, remove both of them. Basically ensure that the code on the website doesn't start with <?php , or end with ?> . This is very important.
Edit the Plugin and Insert the Code
Next, go to the WordPress dashboard and navigate to "Plugins->Editor" as shown here:
In the next screen, select the custom plugin we just added from the drop-down box on the top right-hand corner as shown here and hit "Select":
This will now allow us to add code to the plugin. Paste the sanitized code you got from the previous step into the text editor as shown here:
After that, click "Update File" and you're done! You've successfully inserted custom code into your WordPress in a safe and flexible way. This code will remain regardless of which theme you choose, and it won't crash your site if something goes wrong either!
Updated on: 10/10/2024
Thank you!