WordPress “Art Direction” Plugin
December 16th, 2008
Update: Version 0.2 is now available. This fixes a small bug that may result in duplicate styles.
Short story:
I wrote a plugin (it’s in beta) available over here: WordPress › Art Direction. The tagline is “Per-post styles for new age art direction.”
Long story:
Automation is the king of convenience. It’s also a killer of creativity and quality. Examples: MP3 vs. Vinyl, Transistors/Diodes vs. Tubes, Xerox vs. Letterpress, Digital vs. Film. The newer technologies allow a quicker route to (perceived) gratification, but the older technologies always deliver a superior end result.
Web sites have gone from home-grown concoctions of HTML thrown together with bits of glue and tape, to vast content management systems automating the entire process. It’s lowered the barrier of entry for publishing on the Web, but it’s also sucked away the creativity.
I’ve been in love with blogging and feel that CMS’s are the way of the future. But, I’ve also been feeling an ever increasing homogenization on the web – in part because of the low barrier of entry for publishing, and the finite amount of designs available to most individuals – and the static nature of these designs.
Earlier this year two things happened on the web that opened my eyes. I designed a theme for WordPress.com, Monotone. It took colors from an image and used them to surround the image and create a somewhat dynamic and unique experience for each entry. A nice blend of dynamic and static qualities.
Elsewhere, a little after the launch of Monotone, Jason Santa Maria redesigned his site using EE – the horror! ;) – to give him more control over each entry’s design. It was a brilliant use of technology!
But, I don’t want to pay for my content management system when there is already a superior, Open Source, and extensible system available. (I’m talking about WordPress.)
So, I wrote a plugin to provide me with the ability to add styles/javascript/whatever I wanted to each entry, I call it Art Direction. It’s in beta right now. So, help me make it better, so we can all enjoy a little more flexibility and creativity.
Caveat: it may invalidate your code, depending on how you use the plugin (due to inline styles). This is a temporary problem.
Sphere: Related Content
Hey man!
This is Brilliant! Ever since I saw Jason’s presentation at An Event Apart SF this summer I was thinking about this. I’m eager to try out your approach and, even though I’m not a programmer, I’ll try to pitch in my feedback!
Keep it up and take care!
Great job, I’ll be employing this in some work that I have currently in progress. Cheers mate!
Awesome plugin. Sure beats manually going in via FTP to find the unique id / class for each post, then styling to taste. Will a future update offer the option to write styles to a global stylesheet? art-direction.css in your themes directory?
I will be implementing this plugin on my wp site immediately ;)
Thanks Noel.
Excellent! I can’t wait to give this a try on upcoming projects.
This is amazing. Originally a print designer (mainly magazines), I can’t wait to use your plugin to give life to various ‘articles’ on an online magazine site I run.
I will be sure to provide feedback once I’ve given it a run.
Thanks.
I like the idea and definatley don’t want to bring down your idea for a name, however, when I saw this in my reader, I thought it was a plugin for some type or Artwork Gallery or something. Just wanted to give you the heads up. Look forward to trying it.
[...] Automattic colleague Noel has released a new plugin for WordPress called Art Direction, now in beta: Automation is the king of convenience. It’s also a killer of creativity and quality [...]
Hi Noel,
Great plugin! I’ve been looking around for something to do this over the last few days, and was pleasantly surprised to find out you made it so recently.
While troubleshooting some CSS issues, I noticed that my style was being inserted into the page twice. I discovered that this is caused by a bug:
(starting on line 16)
if( is_single() or is_page() )
echo str_replace( ‘#postid’, $post->ID, get_post_meta($post->ID, ‘art_direction_single’, true) );
echo str_replace( ‘#postid’, $post->ID, get_post_meta($post->ID, ‘art_direction_global’, true) );
Since there are no brackets surrounding the if statement, the second line is run regardless of the if condition. This will cause the global styles to appear twice in the front-page listing!
-C
@chromakode Thanks for the note. It was a bug. Version 0.2 is out and addresses that issue.
Thanks for all the great input and encouragement! I really appreciate it and hope the plugin proves useful!
[...] WordPress “Art Direction” Plugin This new WP plugin, currently in beta, allows you to individualized styles for each post (ala Jason Santa Maria’s redesign of his personal website). [...]
[...] WordPress “Art Direction” Plugin, from Automattician Noel Jackson. Basically allows you to do what Joe Santa Maria does for his blog without all the custom code and template hacking, just a simple plugin. (0) PreviousPost [...]
Excellent news…been looking for something like this for a while.
[...] Art Direction Plugin [...]
Wow very cool! I just wrote a tutorial on using a colors.css file to hold all of the colors for you design, which allows you to change color schemes really quick. People have been seeking ways to vary colors based on post, this is a really awesome direction for this!! Thanks so much! Wish I could have told people about this before the tutorial.
I am really, really interested to tear into this one. I have been wondering about this for a long time, and glad that someone jumped up and is making it happen. I will install and play around with this, and get you feedback as I progress with it.
Thanks!
This looks great, if you can work out the inline/validation problems it will be superb!
[...] Wordpress Art Direction Plugin [...]
sounds like a great plug in!
Wow – I wrote a plugin to do this about a year ago and I’ve only used it a couple of times and never bothered to release it – now I find out that there are lots of people wanting this. Doh! Well done.
Actually, the technology transition was from tubes to *transistors*, not transformers.
Very nice. I’ve been using custom fields to give my posts a unique look.
My question for this plug in is: are you using custom fields? If so, then in table: wp_postmeta, the meta_key is defined as varchar(255). How would this plugin handle key values that exceed 255 chars?
Thanks,
@chrys Thanks for that!
Wonderful. This will enable me to write more tutorials and show examples without bloating my style files and forever slowing down my front page.
That seems like a really coo feature!
Nice stuff. Really:)
However, I don’t agree with your opinion about Expression Engine. Comparing Wordpress to Expression Engine tells me you don’t respect/know the strengths of each CMS and the weaknesses. EE can handle far greater complexity and flexibility of content management to the (control panel) user(s) than WP. In this age of free software it is easy to loose sight of the simple fact that you get what you pay for. That said I love WP and EE both for what they are.
[...] about? color manipulation and art direction in themes with? PHP. Noel recently came out with the Art Direction plugin, which allows for custom per post styling, i.e. allowing you to control the look of each [...]
Thanks for this. A library of styles would be helpful.
[...] Art Direction provide the ability to add styles to each entry (tags: plugins wordpress templates) [...]
Nice! I’ve already said to Matt(ma.tt) thanks for providing a link to that.
Cheers.
Cool plug-in, but I had to uninstall it from my site. It was the cause of a blank line error (http://validator.w3.org/feed/docs/error/WPBlankLine.html) that broke my RSS.
[...] which seems to trouble so many Wordpress users on the ‘net. Finally figured out that the Art Direction plugin was the culprit. Luckily, it was not something that I used very [...]
Thanks for this. A library of styles would be helpful.
However, I don’t agree with your opinion about Expression Engine. Comparing Wordpress to Expression Engine tells me you don’t respect/know the strengths of each CMS and the weaknesses. EE can handle far greater complexity and flexibility of content management to the (control panel) user(s) than WP. In this age of free software it is easy to loose sight of the simple fact that you get what you pay for. That said I love WP and EE both for what they are.
Awesome! Another print designer looking forward to seeing how this works out. Imagine, designing articles!
Great work, thanks a million! I’ll be sure to drop you some feedback once i’ve given it a run.
[...] Wordpress Art Direction plugin [...]
[...] talk about color manipulation and art direction in themes with PHP. Noel recently came out with the Art Direction plugin, which allows for custom per post styling, i.e. allowing you to control the look of each [...]
An incredibly n00b question (I apologize, but this is more direct than me stumbling through it with a headache on my own):
what do I write in the single page or global code boxes to create pages? Could you please explain in condescending/simplified language to a beginner how this process works?
thank you…
Apologies in advance for the the n00b question, but:
what precisely do I put in the global and single page code fields? do I merely hit the insert tag buttons and a pagination system will automatically create a numbering sequence, or is there (most likely) more involved?
Any and all responses tinged with frustrated exasperation at my lack of plugin/css are welcome, as long as actual guidance/help is also included.
many thanks…
[...] often-overlooked casualty of the content management system is art direction. While there may be some systems that allow for it, this is still a lot to ask of a client if they do not have in-house designers. Could making style [...]
[...] Art Direction WordPress plugin [...]
[...] out Noel’s Art Direction plugin for WordPress, which provides the ability to add styles or JavaScript to each entry, without a lot [...]