Support

Upgrades

Custom CSS

About the Upgrade

What is the Custom CSS Upgrade?
The Custom CSS Upgrade allows you to use your own CSS (Cascading Style Sheet) to customize the appearance of your blog. CSS allows you to change fonts, colors, borders, backgrounds, and even the layout of the blog.

The cost for the Custom CSS upgrade is 14.97 credits ($14.97) per year per blog.

Please note that CSS can be a fairly tricky technical job. The upgrade will allow you to use a custom CSS stylesheet, but making it look the way you want is up to you! CSS can behave differently in different web browsers. See the CSS Help section for more information. You should have some knowledge of CSS before purchasing the upgrade – or at least a willingness to learn!

Does the CSS upgrade let me edit HTML?
No. The CSS Upgrade is CSS only. You can change the appearance of a theme, but not its HTML markup, PHP code, or content.

You can choose to apply your custom stylesheet to any of the themes available on WordPress.com. The Sandbox theme offers flexible and semantic HTML that’s ideal for use with a custom CSS upgrade.

Does the CSS upgrade let me upload my own theme?
Not exactly. You can use the CSS upgrade with a “Skin” for the Sandbox theme, since these are normally CSS stylesheets.

You can’t upload themes made of PHP or HTML files (which means most WordPress themes). This is for security and compatibility reasons. The only exceptions are for VIP bloggers.

Can I use the CSS upgrade to make minor visual changes to an existing theme?
Yes (within the limits of CSS, and your skill as a CSS designer, of course). You can choose to apply your CSS to an existing theme in addition to the standard stylesheet used by that theme. This makes it possible to make minor changes (such as color and font changes) with just a few lines of CSS.

Can I use the CSS upgrade to make major changes to my blog’s layout?
Probably – it depends on what you’re trying to do, how capable you are at writing CSS, and how flexible you are about your methods. You can choose to apply your custom CSS to any theme in addition to or instead of the standard stylesheet for that theme. There are more than 50 themes to choose from, which provide various types of basic HTML structure and layout for you to start with. The Sandbox theme in particular can be rearranged into many types of 1, 2 and 3 column layouts.

If you’re not sure whether or not an existing stylesheet or CSS technique will work with a particular theme, you can use the CSS Preview function to try it out before upgrading – see the next question.

I’m not sure if the CSS upgrade is for me. Can I try before I buy?
Yes! Visit the Appearance -> Edit CSS tab on your dashboard. You can write or paste your own CSS stylesheet into the text box provided, and use the Preview button to see how it will look with your currently selected theme. The CSS changes you try with the Preview function are only visible to you, so you can test and edit to your heart’s content.

We highly recommend using the Preview function to try your stylesheet  changes and CSS techniques before deciding whether or not to upgrade.

If you’d like to preview your custom CSS with a different theme, but without changing the appearance of your live blog, you can register a second blog and use it for testing. Just make sure you choose the right blog if you decide to upgrade!

I purchased the CSS upgrade and changed my mind. Can I get a refund?
We generally do not provide refunds. Please use the Preview function to try your custom CSS before purchasing the upgrade.

Is my custom CSS stylesheet used instead of, or in addition to, my theme’s standard stylesheet?
Either, it’s up to you. There are two options available on the Edit CSS page:

  1. Add to existing CSS – this will load the theme’s standard stylesheet first, then apply your custom CSS rules afterwards. Start with this option if you just want to make some minor adjustments to a theme, such as changing the text or background color.
  2. Start from scratch and just use this – the theme’s standard stylesheet won’t be loaded at all. Start with this option if you want to design everything yourself.

How do I upload images for use with my CSS?
You can upload an image as an attachment to any Post or Page, then refer to it by its direct URL from within your CSS stylesheet. You’ll find the direct URL of each image on your Manage/Uploads tab. Here’s a simple example of how to use a background image in your stylesheet:


div#content {
background-image: url(http://example.files.wordpress.com/2007/08/example.jpg);
}

I messed up. How can I reset my theme’s stylesheet?
Go to Appearance -> Edit CSS, remove all CSS code from the editor, and click Save Stylesheet.

What happens when my Custom CSS Upgrade expires?
You must renew your Custom CSS Upgrade after one year. If you fail to renew the upgrade, your custom CSS will no longer be applied to your blog. Thus, even if you do not plan on making future changes to your stylesheet, you will still need to renew your upgrade in order to keep any changes you have made in the past.

↑ Table of Contents ↑

Color Schemes

As themes become more customizable, or for if you choose to set up a domain of your own, color combinations are quite useful. Please take a look at the following resources for some help in this area:

↑ Table of Contents ↑

CSS Help

We do not offer CSS support or training directly, but there are a TON of great resources on the web to get you started into learning more about HTML and CSS. There is a learning curve, but CSS is a very valuable and reusable skill.

Here are a few tips we live by:

  1. Be careful! Often Support staff aren’t able to help you reverse errors made in your CSS code.
  2. Develop your stylesheets offline.
  3. Use a validation service, like this one.
  4. Use Firefox as your browser and download the Web Developer Toolbar add-on, which allows you to edit stylesheets on a live page.

Tutorials

References

Forums and Mailing Lists

Books — if you’re old-school