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:
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.
