When you create a website in WordPress, you get to choose from a large number of themes in the WordPress library to find the best theme that suits your taste and has the desired features. Sometimes, you might get the perfect theme but most of the times, you might need to make some changes to the theme such as add new features, change colors, remove certain elements and what not. While features such custom sections and other functionality are handled by plugins, to make any changes to the layout, you will have to add Custom CSS to your website so that it matches your vision.
In this article, we are going to take a look at the methods how we can add Custom CSS in WordPress. Let’s get started!
1. Adding CSS using Customizer (The Easiest Way)
The first and the most obvious way you can add Custom CSS in WordPress is through the Customizer itself. Since version 4.7, WordPress provides the “Additional CSS” Section in which you can add any Custom CSS you require for your website.
from the Dashboard, go to Appearance > Customizer. Then click on Additional CSS section. There you should be able to put any custom CSS code you require for your website.
2. Adding CSS using plugin (The Convenient Way)
If, for some reason, you don’t want to use the customizer for adding any custom CSS, there are a number of plugins you can use to add Custom CSS in WordPress. Some of the popular plugins right now are Custom CSS and JS, Simple Custom CSS Plugin, WP Add Custom CSS and many others.
Apart from adding Custom CSS code, plugins offer other functionalities as well such as adding custom PHP, custom JS or custom HTML code.
You also have the option to load the CSS on specific pages or in footer. This can be helpful in optimising the site. These things matter in case the code is quite large and performance is a concern.
3. Adding CSS using Child Theme (Complicated but the Best Way)
This method is meant for developers but the most reliable one. A Child Theme is used to localise any changes to the theme and prevent it from getting reset whenever there is an update to the theme.
In order to add Custom CSS in WordPress using a Child Theme, first we need to create a Child Theme. I will not be covering here how to create a Child Theme as it is very well explained in the Codex. After creating the Child Theme, add the CSS code in the style.css file in Child Theme.
Use this method only if you know what you’re doing. One benefit of this method is that apart from CSS, any PHP functions, JS or HTML can be added to the theme without adding an additional plugin to your site.
So, these were some of the ways to add Custom CSS. There are some other ways but these are the most popular ones. Let us know which ones do you use?
