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.
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:
Similarly, if “my.css” cannot be found, you will get the following warning:
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
- Download and extract the “MyCSS” folder
- Upload the “MyCSS” folder to your WordPress plugin directory, usually “wp-content/plugins”
- 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.
|
This plugin has been downloaded 1854 times since May 9, 2007 ( 890 times since version 1.1 ) |
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



56 responses so far ↓
BloggingPro China » Blog Archive » WordPress Plugin: MyCSS
// Jul 27, 2006 at 1:06 am
[...] MyCSS,让你自定义一些CSS内容而不用直接修改模板。 css themes [...]
MyCSS · WordPress插件中文站
// Jul 27, 2006 at 2:01 am
[...] 插件页面: 点击进入 [...]
daniel
// Aug 13, 2006 at 5:31 am
Have a look at this… it also overrides the themes css, can be changed in the admin panel. you can create multiple css files and toggle them on or off without aczually deleting them, as they are sotred in the database.
http://scott.sauyet.com/php/wp-plugins/stylesheets/
eyn
// Aug 13, 2006 at 9:39 am
Hi Daniel, I do know about that plugin you mentioned before I started making this one. Honestly, that plugin isn’t really doing what I wanted, and its implementation goes against what I’m trying to achieve here. First of all, MyCSS does not touch your WordPress database, so user can feel free to enable and disable this plugin without worrying about leaving “traces” behind.
Also, why would someone need multiple “cross theme” stylesheets when the whole purpose of having one is to make managing theme independent CSS classes easier? The reason of me using MyCSS is to group plugin related CSS classes and custom classes I’ve used in my blog post. I want them to be valid even after I switch to a new WP Theme.
One can easily organize CSS classes within a single stylesheet using proper commenting.
Disruptive Library Technology Jester :: DLTJ under a New Theme
// Aug 13, 2006 at 11:30 pm
[...] MyCSS [...]
posix
// Aug 31, 2006 at 5:41 pm
hey,
this plugin is what i longed for for ages…
i was so happy to find it.
thanks a bunch for making it.
however, it doesn’t work for me :’(
everything went well with the installation of the plugin and whenever i apply changes it confirms them. there are no error messages saying “can not write” or so.
yet no chages are present.
when i edit the exact same thing in the initial css files of my theme (steve lam’s “true blue” (http://stevelam.org/trueblue/) style for k2) the changes are present.
i don’t understand what i am doing wrong.
i feel more like mycss is being ignored at the moment.
i hope you can help me.
thanks again,
posix.
eyn
// Sep 1, 2006 at 11:16 pm
posix, I went to your page and found that your my.css is working fine, I don’t think it’s being ignored, but rather the way you put in your CSS might be the problem. You might want to use Firefox Web Developer extension to help you debug your CSS, it comes with a handy EditCSS feature that show you real-time CSS changes. You might also want to try using !important in order for certain CSS to show up as sometimes your main theme CSS file might have already styled certain elements, and you need to force your custom style to overwrite those.
posix
// Sep 2, 2006 at 8:14 am
thank you eyn.
for some reason, when i tried the plugin again, everything worked fine.
it’s beyond me what i did differently before.
well, anyway, i can now fully enjoy this wonderful plugin.
are you working on other plugins? i’d be very interested :)
kind regards,
posix.
ps. sorry for the double-comment earlier.
Josh // Sep 28, 2006 at 2:06 pm
I cannot detect the plug in after having changed my folder permission
eyn
// Sep 28, 2006 at 11:07 pm
Hi posix, I’m not working on any plugin at the moment, but if you have any interesting ideas feel free to tell me and I’ll see if I can code a plugin for it. :)
And Josh, you might want to try different permission settings for the folder, if it stop working once you change the permission, you can change the permission of “my.css” only instead of the whole folder. I suggest you try out 777 permission on my.css (but not the folder, for security reason) as a last resort, it should work. Tell me if you have any more problems.
posix
// Sep 29, 2006 at 12:56 pm
hmm, personally, i think a plugin at hand of which creating javascript trees anywhere on your blog would be handy.
插件 » Blog Archive » MyCSS
// Nov 7, 2006 at 4:32 am
[...] 插件页面: 点击进入 [...]
Shawn
// Nov 24, 2006 at 9:03 pm
Can someone please help me? I am new to installing wordpress on my hosting account and I downloaded the CSS plug in. I wanna build a wordpress blog and add a customized theme. Can someone e-mail me please and school this ditz on how to do it?
Thank you..:-)
Tip: Lav ændringer i dit tema i et seperat style-sheet (CSS)
// Mar 5, 2007 at 4:36 pm
[...] For nylig faldt jeg over et forslag til, hvordan man kan adskille sine egne ændringer i style-sheet’et (CSS-filen) fra temaets style-sheet. Ser umiddelbart interessant ud, selv om jeg ikke selv har afprøvet tricket. I kommentarsporet til artiklen nævnes to plugins som kan nogenlunde det samme. Links til disse plugins: her og her. [...]
麦子的blog » Blog Archive » yo2试玩两日笔记
// May 7, 2007 at 9:43 am
[...] 转到提问时间:现在还有的东西没玩转,就是这个MyCSS + Page Header & Footer功能上说是Add your own theme independent CSS classes into the stylesheet below,或者在博客的头部或者为不插入html代码,后者倒是比较熟悉,前者就比较郁闷了,呼唤 chris 和 penglei ,还有其他知道的yo2网友 。 [...]
Weblog Tools Collection » Blog Archive » APAD: MyCSS
// May 10, 2007 at 12:20 pm
[...] Plugin MyCSS [...]
MyCSS: Plugin para Wordpress | Kabytes
// May 10, 2007 at 1:15 pm
[...] Plugin MyCSS Posts relacionados [...]
MyCSS, plugin para Wordpress « Cosas sencillas // May 11, 2007 at 4:02 am
[...] plugin para Wordpress En el blog KABYTES, tenemos un nuevo plugin para Wordpress , se llama MyCSS , sirve para poder agregar de forma sencilla nuevos estilos, independientemente del theme que [...]
我爱水煮鱼 » MyCSS // May 13, 2007 at 11:38 am
[...] 插件页面: MyCSS [...]
Grapefeed » Blog Archive » MyCSS
// May 14, 2007 at 5:16 pm
[...] MyCSS: The best WordPress plugin you never thought you needed. (link via Weblog Tools Collection) Share This Entry These icons link to social bookmarking sites where readers can share and discover new web pages. [...]
yourCSS, permite que usuarios personalizen tu sitio | aNieto2K
// May 15, 2007 at 4:10 pm
[...] unos días que vengo viendo el plugin myCSS, un plugin que permite a los autores de cada blog, persolizar sus páginas y que los usuarios vean [...]
Meme: Lista de Plugins usados | Kabytes
// May 19, 2007 at 1:23 pm
[...] MyCSS: Para incorporar pequeñas fracciones de codigo CSS sin necesidad de “tocar” el principal del blog. [...]
WP Plugins DB » Blog Archive » MyCSS
// May 20, 2007 at 3:54 am
[...] Visit [...]
MyCSS WordPress Plugin » D’ Technology Weblog: Technology News & Reviews
// May 31, 2007 at 9:19 am
[...] more info and download…. [...]
MyCSS WordPress plugin | Gizmostuff
// Jun 10, 2007 at 5:25 pm
[...] and installation information is available at http://www.channel-ai.com/ var addthis_pub = [...]
Mosey
// Jun 12, 2007 at 6:36 am
Wow… great idea! :D This plugin should have come along sooner~~ one of the reasons why I hardly change themes is precisely because I can never remember which parts I’ve edited ^^: Thanks!
随便说说SBTalk » Blog Archive » Quick n’ Dirty Hack vs MyCSS插件
// Jun 12, 2007 at 10:58 am
[...] 数年前,我往往很得意自己举一反三的能力,但是往往不成事,为啥? 懂了一点就放一边了,于是linux玩一半,VBB玩一半,现在开始玩WP。 估计这件事情还是玩一半。不过信奉能用就好的人还是挺多的, “Fixed Stylesheet - Quick n’ Dirty Hack” 不是我的独创,嘿嘿,而有位博友就比较信奉完美了,可以去看看他的MyCSS插件,是带管理面板和在线编辑功能的。 [...]
BUGabundo
// Jun 15, 2007 at 4:23 pm
there a case sensitive problem
the file uses “MyCSS” while the folder is “mycss”
on linux it wont work
Wordpress 中的代码加亮
// Jul 23, 2007 at 3:26 am
[...] Wordpress 中使代码加亮的办法,需要激活 MyCSS 插件,并且保证 WP Lightbox 2 [...]
Martino
// Aug 8, 2007 at 2:45 pm
I´a using this plugin.
Very good. :)
Thanks
Martino :)
pyko
// Aug 28, 2007 at 9:08 am
hi eyn!
thanks for the great plugin :) i had *just* started editing the core CSS file (and felt horrible doing it) then found your plugin, which solves everything! No more guilty feeling of ‘hacking’ the CSS file anymore :)
thanks heaps!!
pyko
心想事成的秘密
// Oct 15, 2007 at 10:21 am
Does it support wp2.3?
cokar
// Oct 28, 2007 at 5:02 am
Thank you!
Externe Links highlighten » bastelbude.com
// Oct 29, 2007 at 11:07 am
[...] des klasse WordPress Plugins MyCSS wird Euch in Zukunft bei den informativsten (externen) Links gleich angezeigt, ob es zu Wikipedia, [...]
BGH Quiz
// Nov 4, 2007 at 10:26 pm
Awesome plugin, thank you a lot. It makes things a lot easier. I like switching themes too much.
Blat News » Blog Archive » MyCSS plugin
// Nov 12, 2007 at 11:45 am
[...] Added the MyCSS plugin. [...]
Blat News » Blog Archive » Fixed up a few more things
// Nov 13, 2007 at 12:13 pm
[...] the MyCSS plugin wasn’t working correctly for the multiuser version of WordPress. It was maintaining only a [...]
Steve Murphy // Nov 14, 2007 at 1:44 am
Fantastic plug-in - thanks for your work!
I’m preparing to go live with a WP-based site that will replace my current (and increasingly stale) static site, and have been busy customizing my chosen theme’s css. And then it occurred to me that it would all be wiped out if I installed the next update to the theme.
Your recommendations regarding Firefox and Web Developer are spot on too.
If I may, here’s a recommendation to those like me who had already done significant work modifying a theme’s style.css page: download a program called Beyond Compare by Scootersoftware. It has been invaluable in identifying and transferring the changes I already made in the theme’s CSS to your plugin, as well as tackling the task of identifying and logging changes to other theme files (mostly php) that I will have to repeat manually upon an update. Very powerful and easy to use…
best,
steve
知更鸟 » WordpressYo2.cn托管用户添加流量统计教程
// Nov 24, 2007 at 8:12 am
[...] 找到并“启用”:MyCSS+page Header&Footer 插件。或者到http://www.channel-ai.com/blog/plugins/mycss/ 安装。(Yo2.cn用户可以在列表中直接找到) [...]
从申请免费空间到构建wordpress博客的详细图解|免费搭建自己的wordpress博客 » | “华”众取宠CNadman.CN
// Nov 28, 2007 at 7:04 pm
[...] MyCSS + Page Header & Footer [...]
点名游戏:Wordpress插件之我选择 | 『掌上浮云』
// Jan 9, 2008 at 8:06 pm
[...] 5、MyCSS + Page Header & Footer 作者: Yaosan Yeo. [...]
blog-thing : 七十二松提供插件介绍 // Feb 15, 2008 at 10:26 am
[...] MyCSS 自己写css滴,您若不知道什么是css,那就继续往下看吧。 [...]
72松47个wordpress插件小解 | 虾米盒子 // Mar 14, 2008 at 5:37 pm
[...] MyCSS by Yaosan Yeo [...]
City Recluse » Blog Archive » 我在yo2博客上启用的插件
// Mar 17, 2008 at 1:30 pm
[...] MyCSS + Page Header & Footer - [...]
我所使用的WordPress Plugins | Perfect Blue | MissZ.NET
// Apr 8, 2008 at 6:48 am
[...] MyCSS 编辑CSS的一种方便方法,用来做google webmaster tool的验证最好了 [...]
michael lee
// Apr 14, 2008 at 4:34 pm
Under the WP 2.5 admin panel, the text entry area for the MyCSS admin page is restrictively narrow.
It can be fixed by adding a value for “cols” on line #68 of mycss.php - the result looks like this on mine:
rows=”25″ cols=”120″ tabindex=”1″
Patota*
// May 3, 2008 at 3:16 pm
ótimo! great!
awsome ;)
管智鹏
// Jun 2, 2008 at 6:44 am
宝贝呀!!必备插件儿!!
Paul
// Jun 10, 2008 at 6:05 am
MyCSS will not over-ride Theme Editor in Wordpress 2.51 ?
File permissions 644 ok.
__MaX__
// Jun 24, 2008 at 2:12 pm
Hello Yaosan Yeo,
I worked on a multiblog version for your plugin, you can find some details here :
http://blogs.nofrag.com/__MaX__/2008/jun/24/38301-dev-mycss-improved-v1-for-wordpress/
Let me know if it’s a problem for you :)
Top 3 Most Underrated Wordpress Plugins | Hayes Potter // Jun 28, 2008 at 6:07 pm
[...] My CSS - This plugin creates a theme independent style sheet, it’s great for global classes, or if you switch themes kind of often. [...]
My CSS 插件使用 | 生色活香 // Sep 1, 2008 at 8:03 pm
[...] My CSS插件支持blogger自己利用css对模板自定义。 [...]
Top 65+ WordPress Plugins | ShanKri-la
// Oct 9, 2008 at 8:18 pm
[...] MyCSS - Preserve and maintain your CSS changes easily through theme version updates. [...]
72松47个wordpress插件小解 // Nov 4, 2008 at 5:29 am
[...] MyCSS by Yaosan Yeo [...]
Reasons To Wordpress - The MyCSS Syndrome
// Nov 4, 2008 at 8:33 am
[...] Not so much because I’ve found a plug-in that supports CSS customization, not even because I’ve found one that does exactly what I wanted, but because it was even named exactly as I would have named [...]
» Image Caption - WordPress Plugins Catalog
// Nov 15, 2008 at 9:26 am
[...] MyCSS by disabling default CSS [...]
Leave a Comment