MyCSS

MyCSS is a WordPress plugin that allows you to attach your personal CSS stylesheet to your blog, regardless of the theme you might be using. This is useful for users who want extra control over the presentation of individual blog entries by using self-defined CSS classes without worrying about compatibility issues when switching theme from one to another.

Another reason you might want to use this plugin is if your blog uses other plugins that require CSS styling. While some blog themes support certain plugins “out of the box”, you can style them yourself using MyCSS and make minimal changes as you switches themes since they are all in one place, i.e. my.css.

It is always a good idea to not heavily modify a blog theme’s original CSS whenever possible (to make future theme update easier). Any extra CSS classes you added yourself can be put into MyCSS editor, which will definitely save you time managing your blog’s presentation in the long run.

The closest plugin I found that implements a similar function is “Fixed Stylesheet – Quick n’ Dirty Hack”. However, what is lacking in this dirty hack is the convenience of editing the custom stylesheet. Using this hack, one has to edit the stylesheet using a text editor, upload it to your blog directory via FTP, then only will any changes take place.

MyCSS plugin takes an extra step towards better organizing your custom stylesheet by adding a new panel under “Presentation” menu that allows you to do instant changes to your stylesheet easily. ;)

For your information, this site is powered by MyCSS and you can take a look at the stylesheet to have a feel how would one utilize it.

See MyCSS in action

For advanced users…
If you make heavy use of “Edit CSS” feature found in Firefox’s Web Developer Toolbar while stying your WordPress blogs, then you’ll definitely increase your productivity by having an extra tab opened with MyCSS and copy desired CSS changes directly from Edit CSS panel into MyCSS textbox. Save, refresh, done! :D

Features

• imports user-defined stylesheet, independent of blog theme used
• provides convenient stylesheet editor in admin panel for fast editing
• does not write to your WordPress database

Usage

Once activated, you can either upload your self-defined stylesheet to “wp-content/plugins/MyCSS/my.css” or copy and paste your CSS codes into the editor under “Presentation” menu.

Make sure “my.css” is writable on your server, a “644″ permission should suffice. Below’s the message you’ll see if “my.css” is not writable:

my.css is not writable

Similarly, if “my.css” cannot be found, you will get the following warning:

my.css cannot be found

Something you should know…
Elements in your blog posting using CSS classes defined in “my.css” will lose their CSS formatting in RSS feeds. This is due to the fact that RSS feed does not support external stylesheet, thus all CSS classes will have no effect in RSS readers.

Tips

Due to the limitation of CSS classes in RSS feeds mentioned above, you should always try to use classes together with standard XHTML tags to allow RSS readers to render those elements closer to the way you intended than completely ignoring your CSS classes. For example:

Example Header

Instead of using <span class=”myheader”>Example Header</span>, you should really use <h2 class=”myheader”>, and the CSS will look something like this (just for reference):

h2.myheader {
  font-size: 1.6em;
  color: #777;
  margin-bottom: 13px;
  padding: 10px 0 7px;
  border-bottom: 1px dotted #ccc;
}

One of the tips I can give you is that you might want to use “!important” whenever your CSS in my.css does not show up (usually due to conflicts with theme’s stylesheet). btw, I’m no pro at CSS so if any of you know a better way of using CSS classes in your blog entries, feel free to share your opinion here. :)

Installation

1. Download and extract the “MyCSS” folder
2. Upload the “MyCSS” folder to your WordPress plugin directory, usually “wp-content/plugins”
3. Activate the plugin in your WordPress admin panel

Download

MyCSS plugin 1.1 for WordPress 2.5+ (4kb .zip)

If you are using older version of WordPress, please download MyCSS 1.0 from here instead.

If you like this plugin, express your love by donating and sharing this plugin with your readers!

Support

If you have any questions, suggestions, or found any bugs in this plugin, feel free to post them in your comments. I’ll try my best to answer them but there’s no guarantee, so don’t be disappointed if you do not hear back from me promptly. :/ If you find this plugin useful and feel like donating some money for my effort, please use the PayPal button above, thanks! <3

History

1.1 [2008.04.18]

• Updated admin panel markup for WordPress 2.5

1.0 [2006.07.25]

• Initial release