Thesis Theme: Introducing The Custom CSS and Custom Functions Files
People, the time has come to take the plunge. The plunge where? Into the fancy schmancy customization that you could be doing, right now, if you only knew how to use the custom.css and custom_functions.php files in your Thesis installation. Now, if you don’t use Thesis, don’t despair–all of the lessons we are learning about how to use css can be transferred to other blogging platforms. You will just have to jerryrig and retrofit to suit your format once we get into the nitty gritty of CSS. If you do have Thesis, though, you need to learn about these two different files because they are what is going to make your customization attempts as effortless as possible.
Broad Strokes Introduction To Thesis Structure
So, you already know that Thesis has a lot of on-screen options for customizing. This can help you do things like change the default font and font size, decide how many teasers to use, and switch betweent a one-, two- or three-column format for the theme. But what if you want to do things like change the color of the default font? Or change the location of the navigation bar? Or change the header pic? These things cannot (yet) be changed with the simple point and click interface on Thesis. You have to use the custom files.
Custom.css is the file that keeps all of your own customizations to the style sheet of your website. The way you can think of things to be changed by using the custom.css file is that they are questions of style rather than function. Yeah, I know, that sounds stupid, but it gets more complicated when you’re in the midst of changing stuff, trust me. Things that can be changed with this file are basically divorced from the technical functioning of your site, they only have to do with how it looks. So you could, for example, make your comment link smaller or remove the brackets, or change the way a url looks (take out the underline, add bold, etc.), or change the background color of a part of the site with custom.css. In certain situations, you can also tell things not to display with CSS, but it doesn’t work the other way–you can tell the navigation menu not to display when you don’t want it somewhere, but you cannot just make a navigation menu appear solely with css.
Custom_functions is where you alter your site with actual structural changes, e.g. change where the navigation appears, change where the widget appears, change what happens when the website calls up the header. Generally speaking, if you want to move elements around or add a new element, you have to create a custom function for it. Back in the olden days, you could do this only by changing the core theme files, which seems like a small distinction, but after you’ve upgraded to new versions of software enough times, you will be able to appreciate why having a custom_function files is really great. You can update all of your files–both for new versions of wordpress and for new versions of Thesis–without having to worry that the changes won’t carry over. That’s why you always want to use these files to make changes. They are easily reversed, and easily saved between changes in the software that will happen (inevitably) later down the road.
In the coming weeks, I’ll give you a bunch of tutorials on how to change specific things on your thesis-themed website. For now, just figure out where your files are. You can use Fetch to find yourblogsurl.com/wp-content/themes/thesis_15/custom/ and there you will see the files. Find them, and start thinking about the changes you want to make to your site. Are they structural, or style questions, primarily? Are they things that concern how information appears, or where it appears? The answers to these questions will be key to figuring out what you want to do with your site.