Update 26 Oct 2012: Thesis 2.0.1 is out and you shouldn’t need to go through this install procedure. My tests have shown that the skins are automatically installed and configured on new Thesis installs.
Thesis 2.0 is out, and it is a completely different animal to Thesis 1.x!
I’m sure it’s capable of some amazing things, but it’s also going to take a bit of getting used to, and those that jump in face-first might get a bit confused by what they see.
Firstly, on the download page there is a plugin that will enable you to play around with Thesis when logged in, while still serving your active theme to visitors. If you are installing 2.0 on your site and want to port your design over, I recommend using that plugin. I more strongly recommend using a test site to play around with Thesis 2.0 and get used to it. I won’t be installing it on this site until I’ve had more experience with it, and I almost always develop my themes on a test site anyway.
Install & Activate
Image may be NSFW.
Clik here to view.
Installation and activation is the same as any other theme: you upload Thesis to your wp-content/themes folder and activate it on the Appearance > Themes panel in the dashboard (unless you are using the plugin I mentioned, in which case follow its instructions).
Get Started
Image may be NSFW.
Clik here to view.
Do not click the “check out your site now” link. It will be blank, and maybe scary. Do click the “Click to get started” button, which will install the default skins and folders where your custom skins, boxes and packages will go.
Save your CSS
Next you need to head to the Skin Editor to save your CSS. The link to the Skin Editor can be found under Skins in the menu on the Thesis admin page.
Image may be NSFW.
Clik here to view.
Once there navigate to the CSS tab in the top left corner.
Image may be NSFW.
Clik here to view.
In Thesis 2.0 CSS is generated mainly from CSS packages, which are modules designed to help you style all your fonts, links, widths, colours, backgrounds etc via a visual interface. The settings for all of these are in the Skin Editor and when you’ve got things the way you like you need to save and recompile your CSS file. For now your CSS file hasn’t been compiled yet, so you need to do that. You don’t need to change the package settings at this point, just click the “Save and Compile CSS” button.
Image may be NSFW.
Clik here to view.
It is possible to write custom CSS from the editor, or use style.css from a child theme if you want. In time many more packages will become available as developers have the chance to write them.
Now! you can check out your site
Now that your skins are installed and the CSS is saved you can check out your site without having a heart attack.
The Thesis Classic skin is the default and looks like Thesis 1.x did. From there you can check out the Skin Editor. The HTML section allows you to rearrange, add and remove elements of the page and the CSS section allows you to edit the styles for your site. There is also a Thesis Blank skin that you can use to build your own skins from scratch. All skin settings are saved in the database, so you can switch between skins at your leisure and things will be as you left them if you want to switch back.
Tips for the Skin Editor
- Boxes = page elements that you can add to your templates in the HTML editor
- Packages = CSS packages that have a visual interface for you to input your style preferences, which automatically generate the CSS for you
- Variables = bits and pieces of CSS that you can assign a value to and use in your CSS and packages. E.g., you could name a variable “color1″ and give it the value
#000and then in your CSS packages instead of picking or typing in a colour you type$color1. This will be handy: you can change colour schemes by only changing your colours in one place, or you could use it for regularly used values like padding and margins etc. - To move HTML elements within a container just drag the box. To move elements between containers shift+drag.
- Each type of WordPress page can have a unique template. To change which template you are editing click on the name of the template at the top left of the HTML editor.
- You can copy one page template to another by selecting the template you want to copy to in the editor and then click on the name of the template again, in the 3rd column of the popup you can select the template you would like to copy from.
Have fun!