If you’re a WordPress user, there are chances that you need to make some changes either in the CSS, and JS or add some custom PHP code in the functions.php file provided by the theme or plugin author.
Many a time as non-technical website users, we might face difficulties in pasting this code to make the required changes. To solve this problem, today we will see a few ways how to add custom code in WordPress.
- Adding custom code using a custom snippet plugin
- Add CSS code in the theme customizer
- Adding code in the theme’s functions.php
Let’s take a detailed look at these different methods to add some custom code to the WordPress website.
1. Adding custom code using a custom snippet plugin.
In case you are not aware of the theme structure, we recommend you to simply use a third party plugin that allows you to add custom CSS, JavaScript or custom PHP code like a filter/action from this plugin’s editor.
Now, there are many such plugins available in the WordPress repository, but for the sake of demonstration, we are using the Code Snippets plugin. This plugin is freely available and it is quite easy to add custom code using this plugin.
This is a relatively safe method to add custom code to the WordPress website in case you do not want to miss the actual theme or plugin files.
2. Add CSS code in the theme customizer
Many themes provide a variety of settings in the theme customizer to style almost every component that is handled by the theme. But sometimes, there are instances where we need to make some styling changes for which the settings are not available in the customizer.
Generally, the theme author provides some custom CSS to solve the styling issue temporarily. You can add this custom CSS directly in the theme customizer without editing the theme’s actual files.
Go to Dashboard > Appearance > Customize > Additional CSS.
Paste the custom CSS inside this editor and hit the publish button.
3. Adding code in the theme’s functions.php
In case you need to add a PHP code snippet, for example, a hook containing either an action/filter you can add it to the theme’s functions.php file.
Please ensure that you’re making changes in the child theme’s functions.php and not directly in the theme functions.php.
Making a child theme is simple and it takes a few minutes. It contains only two files namely – style.css and functions.php.
Editing in the child theme ensures that the code added remains as it is even if the theme is updated. If you add the code directly in the theme’s functions.php, it will be removed every time the theme is updated.
Go to Dashboard > Appearance > Theme Editor > functions.php
Conclusion:
In this article, we have seen 3 different ways to add custom code to a WordPress website. Apart from these, you can also add code using FTP. Using the File Transfer Protocol, you can access the cPanel, navigate to the functions.php and add the required code.
In case, you’re unaware of how to use FTP, kindly ask your hosting provider and they shall help you add the code snippet.
In case the website breaks after adding some code please be patient and do not panic. This can be a syntactical error and can be handled easily. Simply copy the error and do a Google search. You will find the solution and resolve the issue on your own without the help of a developer.
I hope this article will help you in adding the custom code to your website. If you have any questions, please feel free to comment below, I’ll be happy to help.
Recommended reading: