How To Add CSS Codes In WordPress?

Visualmodo
2 min readDec 9, 2020

--

Did you ever want to change certain aspects of your website’s appearance but simply didn’t know how? There is a solution. You can add custom CSS (Cascading Style Sheet) to your WordPress site. In this tutorial, we’ll be discussing all that you need to know about adding CSS codes in WordPress and how to use it to modify your WordPress site’s look.

Note: Some WordPress themes like our Visualmodo themes have their own panel on the theme options to apple those codes easier. So, please consult your theme developer documentation.

What is CSS Codes?

CSS is a style sheet language that modifies the look of your website’s basic structure, written in HTML. CSS allows you to assign different properties. Such as color, size, layout, and display. To the HTML tags.

You can tailor the default look of certain WordPress themes as well. So, if you want to create your desired design and look, you can add custom CSS to your WordPress site.

Add To WordPress Customizer

While you can add CSS directly to your WordPress theme’s style sheet, we don’t recommend this method because it’s easy to make mistakes and any changes you make will get overwritten when you update your theme (unless you use a child theme). Fortunately, there’s an easier solution. To add CSS to WordPress, you just need to:

Firstly, navigate to Appearance. Customize your WordPress dashboard to open the WordPress Customizer. Secondly, select the Additional CSS option from the menu on the left in the WordPress Customizer interface

The (currently) empty editor in this area enables you to type in lines of CSS code, without having to sort through the existing style sheet. You can add as much CSS here as you want — just include each new snippet on its own line. Plus, you can see your changes take effect in the live preview. That way, you’ll know whether they look right before publishing them to your site.

Adding CSS Codes WordPress via Plugins

One of the more easy ways to implement custom CSS to WordPress is through the use of plugins. There are plenty to choose from, so let us overview the most popular ones and see how they work. In addition, all of the tools we use in this guide can be easily installed via Plugins. Finally, add a New section of your WordPress dashboard. All the bellow plugins are free.

  1. Simple Custom CSS
  2. WP Add Custom CSS
  3. SiteOrigin CSS
  4. Simple Custom CSS and JS
  5. Custom CSS Pro

--

--

Visualmodo

WordPress Websites that millions of people use every day. We’re building responsive WordPress themes since 2010 and are the profissional choice for everyone!