CSS for individual blog entries

I’m occasionally faced with a small problem when writing blog entries. I want to style specific chunks of content, but I don’t know where to put the CSS. Inlining everything is simply not an option, yet the blog-wide style sheet is also not the appropriate place for code that only pertains to a specific post.

I’m sure a simple WordPress plugin would take care of the whole problem by including a textarea for each post in which I could write my post CSS. The CSS would be dropped into the <head> of the page on load.

The only problem I foresee is any page where multiple posts are present. I’m not sure how WordPress constructs its pages, and there might not be support for including CSS or multiple inclusions. I’m currently in communication with a good WordPress plugin developer about the difficulty of such a project.

I’ve already done a number of searches for an existing plugin of this nature, and the onl relevant item I found was another question of the same nature as mine. If anyone knows of such a plugin already in existence, please let me know!

Responses: 4 so far Feed icon

  1. Christine D. says:

    I know the theory of how I'd approach this, but I'm at work at the moment so I can't really tinker with it at the moment (:

    It's definately possible to only include the CSS when a page is being displayed on its own (preventing any bizarro world multiple conflicting CSS issues), though.

  2. Xaprb says:

    This is a nifty idea. I think this is probably one of the major reasons many bloggers just include links to demo files, where they can do whatever they want with the CSS they are discussing. Same with JavaScript, too.

    Of course, if you are showing 5 posts and they each have some custom CSS dropped in, you are at risk of some kind of conflict between posts on the same page, so maybe nobody's done this just because it's a can of worms. I can think of ways to do it, though... if each post is in its own container (depends on your template), you could limit the CSS's effect to descendents of that container.

    I'm no WP developer, but I've looked at the DB schema and if I recall correctly, you'd need to add a column for said CSS.

  3. Tim McCormack says:

    Christine: Well, if it could only be done (reasonably) for post-pages, that would confine it to content after the "read more" link. Which would be okay for me, since I only have brief teasers, requiring no extra styling. Good to hear that you think it's possible!

    Xaprb: Until I can have it integrated into WordPress, I'm adding entries to my theme's style.css file, preceding each selector with "#post-xxx", where xxx is the post id. That's obviously not an ideal solution, but when something else is in place, I'll be able to drop the styles straight in.

  4. Tim McCormack says:

    Looks like someone made a plugin for this: http://wp-plugins.net/plugin/per_post_css_js/

Commenting is not yet reimplemented after the Wordpress migration, sorry! For now, you can email me and I can manually add comments.