Custom CSS for WordPress

I was going to write an epic post about my struggles to add a custom CSS class to my WordPress theme so I can better display code and commands in my posts. As it turned out though there is a plugin for that called Simple Custom CSS.

Install this by going to Plugins -> Add New and then searching for it by name.

Note: This assumes that you have admin privileges on your blog and FTP set up.

After that go to Appearance – > Custom CSS and start entering your code.

The CSS class I have defined for code samples is:

div.code {
background: #000;
color: #fff;
font-size: 12px;
border-style: solid;
border-width: 3px;
border-color: #ccc;
padding: 3px;
line-height: 70%;
font-family: monospace;
white-space: pre;
}

In the future I plan on defining classes for aside notes, warnings and other such divisions. It helps me organize my thoughts and hopefully make my content easier to read.

P.S. I’m pretty awful at visual design, please leave some feed back on my choices.

By Ryan McCoskrie

I am a nerd trapped in the country side of North Canterbury, New Zealand trying to get an IT-related career off of the ground. Legal disclaimer: Ryan McCoskrie is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to amazon.com I'm also signed up with Fishpond but they aren't as strict about this stuff.

Leave a comment