Even though WordPress already has so many customization options, there might be a time when you want to add code snippets to your WordPress to add a certain functionality.
For instance, you may want to add a custom code with a specific function that you can’t find on any available plugin, or you don’t want to use the plugin since you are taking precautions for your site security. Aside from getting the code from some tutorials, if you don’t have good knowledge of the coding language, fortunately, there are some online platforms where users can share and copy custom code snippets like GitHub and WordPress.org developer.
There are 3 ways to add code snippets safely to your WordPress
- Creating a child theme
- Using a plugin
- By creating a custom plugin
Before getting started, it’s always recommended to backup your WordPress site periodically using your hosting provider backup feature or a backup plugin to have assurance in case you’re experiencing issues from miss-configuration or unsuccessful updates down the road.
Adding Custom Code Snippets to WordPress Safely
Method 1: Create a Child Theme
A WordPress child theme is a child of an existing parent theme that provides a chance to safely make changes to your parent theme without editing the parent theme itself.
You may often read about child themes when you start looking to make changes to your WordPress site theme. If you want to create one, we already covered it in our previous article on how to create a child theme for your WordPress site.
Adding the custom code snippet to your WordPress child theme is similar to any regular theme which is by opening the “function.php” file on the Appearance → Theme File Editor page and then putting the custom code there.
However, if you just want to make a few minor modifications it might be overkill to create a child theme, you may want to use the other two methods that we’ll show you in this post.
Method 2: Using Code Snippets Plugin
The next option to add code snippets to your website is by using a plugin called Code Snippets. We will explain why we choose this plugin first.
Code Snippets is a free (pro version is coming soon) plugin and the most popular option for running code snippets on your site which is active on over 600.000 at the time of writing. You can get the plugin from wordpress.org.
Beyond being an easy and simple plugin to run and manage code snippets on your site, Code Snippets removes the need to add a custom code to your theme’s function.php file which makes your modification likely to persist after a theme update. And if you’re not using a child theme function.php your main theme file can get rather long and messy after a while and you’ll lose your work if you update your theme.
Once you are ready, let’s install and activate the Code Snippets, then it will add the “Snippet” menu in your WordPress admin dashboard, let’s try to click it.
As you can see in the above image, there are already some pre-made code snippets ready to use if you need them.
All snippets in Code Snippets plugin can be activated and deactivated with just a click like a light switch.
We will use custom code to disable the Gutenberg editor for this tutorial. You can copy the code from our previous article on how to disable the Gutenberg editor.
Now, to add the custom code, click on the Add New button, and you will be taken to the Add New Snippet page. On this page, you’ll add the title and paste the code into the available editor just below.
Once the code is in place, click on the Save Changes button to save the snippet then proceed to activate it by clicking the Activate button.
Now, when you try to add a new post, the Gutenberg editor will be disabled and you will get the Classic Editor back in action.
Go back to the Code Snippet home and you’ll find your new snippet there at the bottom of the snippets list.
You can deactivate the snippet anytime just by clicking on the item switch.
Method 3: Create a Custom Plugin Yourself
It might sound overwhelming to create your own plugin if you have never done it before but, don’t worry, creating a plugin for our code snippet is actually easy.
To begin creating your WordPress plugin, start by establishing a dedicated folder for your plugin. Navigate into this folder and create a main PHP file using your preferred text or code editor. Naming the file something like “myplugin.php” is suitable. This PHP file will serve as the core of your plugin, containing the necessary code to define and implement its functionalities within the WordPress ecosystem. This organized structure ensures that your plugin is encapsulated and can be easily managed within the WordPress plugins directory.
Now open the file and paste the following snippet into the file
<?php /* Plugin Name: My plugin Plugin URI: https://www.wppagebuilders.com Description: Custom Plugin for adding custom code Version: 1.0.0 Author: WPPagebuilders Author URI: https://www.wppagebuilders.com/ License: GPL2 License URI: https://www.gnu.org/licenses/gpl-2.0.html */
Then, continue by creating a ZIP file from the folder with any file archiver you have.
Once the file is ready, go to your WordPress admin page then upload the file by going to Plugin → Add New → Upload Plugin → Choose File and select the ZIP file you just created, then click the Install Now button to install the plugin.
Now, you’ll find the file you just uploaded in the plugin list, We recommend activating it later after adding the code snippet you want to add to the plugin.
To add the snippet to the plugin, go to Plugins → Plugin File Editor. From there select your plugin in the “Select plugin to edit “ dropdown list, then click Select to open the file editor of your plugin.
We will use the Disable Guttenberg Editor custom code from before for this time too.
Once the custom code is in place click the Update File button to save your plugin changes. Then, continue by activating the plugin in the installed plugin list.
Now, similar to the previous method your Gutenberg editor is gone and you get a classic editor instead.
To Sum it Up
WordPress already has plenty of customization ready for you to use. Moreover, there are more than 50.000 plugins that can help you to expand your site functionality. However, if you can’t find what you need, code snippets fill the gaps in your specific requirement.
With the three methods we just covered, you can safely add the code to your WordPress theme without the need to worry about breaking things and losing your work.