• Skip to primary navigation
  • Skip to main content
Sal Ferrarello
  • About Sal Ferrarello
  • Speaking
  • Connect
    Mastodon GitHub Twitter (inactive)
You are here: Home / Draft / Getting Started with CSS and WordPress

Getting Started with CSS and WordPress

Last updated on August 13, 2019 by Sal Ferrarello

A great place to get started with web coding is CSS. CSS tells the web browser how to display the information on the page, for example the color, size, or font to use. WordPress makes it particularly easy to add your own CSS to your website.

WordPress Customizer

When you are logged into your website, most likely you’ll see a Customize button in the upper-left hand corner of your screen (in the admin bar).

WordPress Customizer button in Admin Bar.

After clicking the button, the Customizer will open on the left-hand side of the page.

Note: These options will vary depending on what theme you’re using but you should see Additional CSS (highlighted here in red) as one of the options.

WordPress Customizer Open Additional CSS Highlighted.

After clicking Additional CSS you get a white box where you can enter custom CSS.

For example, here I’ve entered

body {
    background-color: black;
    color: white;
}

WordPress Customizer CSS Dark Mode.

which gives me a black background with white text (a quick dark-mode version of the website). Currently, these are just preview values. If you want to have the changes applied to the live website, click the Publish button at the top of the screen.

Sal Ferrarello
Sal Ferrarello (@salcode)
Sal is a PHP developer with a focus on the WordPress platform. He is a conference speaker with a background including Piano Player, Radio DJ, Magician/Juggler, Beach Photographer, and High School Math Teacher. Sal can be found professionally at WebDevStudios, where he works as a senior backend engineer.

Share this post:

Share on TwitterShare on FacebookShare on LinkedInShare on EmailShare on Reddit
Warning! This is a draft, not a finalized post. See full draft disclosure.

Filed Under: Dev Tips, Draft, Programming Tagged With: Customizer, WordPress

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Copyright © 2023 · Bootstrap4 Genesis on Genesis Framework · WordPress · Log in