- By :
- Jani Carol
Mar 6 , 2017
Sometimes you may find yourself require to add Custom CSS in your Word Press site. If using FTP is too puzzling, then there is a simple method to add CSS on your site. In this article, we will show you how to add custom CSS to your Word Press site without modifying any theme files.
There are a lot of times that you desire to tweak plug-in, add a code snippet, or change some styling for your Word Press site. On the other hand, a lot of users make these changes in a way that is not viable for the long term. For instance, these changes should not be put into your parent Word Press theme, as they will be overridden when you update your theme.
Some users make use of this as a cause not to update themes or plug-in, but this is not a good plan either. Updates may contain security or bug fixes, as well as new features that you will desire to make use of.
Instead of making these changes in a way that does not stand the test of time and limits what you can do with your site, here are some upgrade proof ways to make changes or add custom code to WordPress sites.
Adding Custom CSS Using Theme Customizer
Since Word Press 4.7, users can at the present add custom CSS directly from WordPress admin area. This is super simple and you would be capable to see your changes with a live preview instantly.
The tab will slide to show you a simple box where you can add your custom CSS. As soon as you add a valid CSS rule, you will be capable to see it applied on your site live preview panel
You can carry on adding custom CSS code, until you are pleased with how it looks on your site.
Do not forget to click on the ‘Save & Publish’ button on the top when you are finished.
Make use of the Code Snippets Plug-in
The Code Snippets plug-in is a great method to add custom code to Word Press sites, and is simple than creating your own plug-in. It essentially serves the same purpose as your own plug-in, as custom code can be added without using your theme and in an upgrade secure way.
A new Snippets menu is added to your site, which lets you name and add new snippets. Every snippet will have room for the code and a description for more detail on what the code does if I locate a helpful snippet from a site, I make use of the description to also add the URL so I keep in mind where it came from.
You can then enable and disable your code snippets just like plug-in, as well as export them into PHP files. Occasionally custom snippets cause conflicts or issues with plug-in or themes, so deactivating all custom code is supportive for targeting issues.