How to Add Custom Code in WordPress

34

Often when you read WordPress tutorials, you are asked to add a code snippet to your theme’s functions.php file.

This may sound easy, but the risk involved when something goes wrong can damage your website and make it inaccessible.

In this article, we will show you how to add custom code in WordPress safely.

Adding Custom Code in WordPress

The first thing you have to do to add custom code in WordPress is install and activate the Code Snippets plugin. For more details, you can check out our article on how to install WordPress plugins.

After the plugin has been successfully activated, there will be a new menu on the left side of the admin area named Snippets. Click the menu to display a list of all previously saved custom code snippets.

Since you just installed the plugin, this only contains a sample of the code snippet you can use. Now you can delete them all and start creating new ones by clicking the Add New button to add your first code snippet.

Add new code snippet

Then the “Add New Snippet” page will open.

From this page you can enter a custom code. But the first thing to do is give the custom code a title. You can enter anything, the important thing is to be able to distinguish if later there are many code snippets that you have created.

After that, you can paste the code snippet into the Code field.

Enter code snippet

In the image above, we are trying to add a custom code snippet to remove the WordPress version number.

At the bottom of the code column, there are options that you can use to run it as “Only run in administration area”, “Only run site front-end”, “Only run once”, or leave it default as “Run snippet everywhere”.

Then you can use the ‘Description’ column to add a short description of the custom code you created.

Add a short description for the code

You can even tag custom code, to help group code by topic and functionality.

Once done, you can click the Save Changes and Activate button. Or if you just want to save without activating immediately, you can click the Save Changes button.

Handling Errors in Custom Code

Usually if you make a mistake adding custom code in a plugin or theme file, it can make the site inaccessible.

When visiting the website, a syntax error or 500 internal server error will appear. To be able to fix the error, you have to delete the code that was entered previously manually using an FTP client or through the file manager on cPanel hosting.

But the most interesting thing about using the Code Snippets plugin is that it will automatically detect syntax errors and pop up a warning asking you not to panic. Then you can press the back button on the browser to fix the code snippet that is experiencing the error.

Error code snippet

As can be seen from the information that appears, it also shows the cause of the error so you can easily fix it.

Managing Custom Code Snippets

The Code Snippets plugin has an easy-to-use interface for managing custom code in WordPress.

You can save the code without activating it on the website. You can also disable code snippets at any time. You can even export previously created code snippets in bulk or individually.

Export code snippets

If you want to move your website to another server, you can easily import code snippets directly using this Code Snippets plugin via the Snippets > Import menu.

Import code snippets

You can even change the plugin settings by visiting the Snippets > Settings page.

If you want to change the appearance of the code column, you can do so by switching to the ‘Code Editor’ tab and selecting a theme from the dropdown menu, then viewing the results in the Editor Preview. When finished, don’t forget to click the Save Changes button.

Code snippets settings

We hope this article helped you learn how to add custom code in WordPress.

If you have any questions, leave them in the comments section below.

You might also like
Leave A Reply

Your email address will not be published.