Tutorial: Using WordPress Styles on WordPress.com (Mac)

Customizing CSS is a new trick on wordpress.com, but hosted wordpress users have been doing it for a while.

Alex King has hosted a competition or two based on styling the 'classic' theme.

Here's how to use those great old styles:

1. download and unzip the style of your choice.
2. Go to your wordpress dashboard, and under Presentation, choose the WordPress Classic theme, by Dave Shea.
3. Start Writing a new post. Using the uploader, upload all of the images from the style you downloaded.
3a. for each image, click on it, and make sure the popup says 'using original' at the top. click on 'using thumbnail' if it doesn't. once it says 'using original', click 'close'
4. Open TextEdit on your computer
5. drag style.css from the downloaded style onto textedit
6. click Go > Find (or press cmd+F)
7. search for the name of the first image in the style folder (ex. top.gif)
8. in your new post (on wordpress.com), in the uploader, control+click on the same image, and click "copy image address"
9. switch back to textedit, and paste that address into the 'replace' field. see example
10. click 'replace and find'. this will highlight the name of the image.
11. click 'replace' and the highlighted text will be replaced with the address of the image you've uploaded.
12. repeat steps 6-11 for all the images in the style.
13. click File > Save
14. click Edit > Select All, then Edit > Copy
15. go to the Custom CSS page in your wordpress dashboard, and paste.
16. click preview to see it in action, and click 'save stylesheet' if it looks good!

I imagine this is fixable (though I'm having a devil of a job trying to switch to floated columns) but not without a reasonable level of CSS competence. Presumably this is why Sandbox has minimal styling out-of-the-box; there's nothing to overwrite.

I was planning to adapt some of my old Classic stylesheets, but rather than figure out how to overrule Classic it'll probably be more efficient to convert them to Sandbox.

Do classes and IDs really vary that much between themes? One of the strengths of Sandbox is that its class and ID names look fairly sensible and intuitive to me, so that even if they don't match those used by my existing theme I can easily figure out how they correspond. Of course, there may be designers who go around calling their header and content divs #boodle and #flopsy, but most seem to stick to easily translatable things like, well, #header and #content.