Last weekend, a good friend of mine told me he wanted to redo his personal site in Drupal. His needs are quite modest; so modest, in fact, I could probably have pointed him at Wordpress and he'd have gotten exactly what he needed very inexpensively. But of course, we're both tech geeks, and he's already got experience with 2 Drupal sites and so it makes total sense to do this in Drupal.

Naturally, I immediately had ideas and went off and even though he was just asking me for advice, I took the piece of HTML he was using as a guideline and built his theme for him. And since his needs are modest, I figured the site could be done using Drupal 5 since very few addon modules are actually needed, and D5 itself is relatively stable now. And a little instability is fine for what amounts to a specialized blogging site.

The style he was using was a simple monochrome; the only real challenge was that he likes to embed images with his posts, and doing that by default in Drupal isn't terribly easy (but lo, with CCK it's much easier. In fact, if the stuff I did could be turned into a module, it'd be very worth it; hopefully it will be soon. But that's for another story). In the past, I generally based my themes on bluemarine. I know bluemarine works, and generally there's a handfull of CSS to modify and I know most of the admin stuff will continue to look decent, and things will do what I want.

But being as how this is 2006 and not 1999, I figured I should use a tableless theme. Ok, so Garland is the new Bluemarine. Right? Well, yes in the sense that it's the Drupal default.

But if you ever have the urge to build a theme based on Garland, here is my advice. First, let me summarize it in one word:

Don't.

Garland is a really twitchy theme to modify; it's using negative margins and relative positioning to push stuff around, and it turned out to be not all that easy to move or remove and still have a functioning site. After a few hours of playing I got something that was ok, and then I discovered that something else was broken.

Eventually I gave up, downloaded the current version of Zen, and used it as a base. Magnifique: 30 minutes later I had what I wanted, and the rest of the time I spent was tweaking the design, not banging on the theme. And once I got done with all that, I got to thinking:

This struggle personifies a struggle that is going on within the Drupal community right now.

Garland and Bluemarine are two aspects of Drupal. Garland's purpose is to be a beautiful theme. (I'll let y'all debate that; personally I find it not aesthetically pleasing, but nicer than bluemarine.) It does what it does quite well and I'll grant that it's a nice introduction to Drupal.

Bluemarine, on the other hand, is meant to be functional, nothing more, nothing less. It does what it does, and it's easy to bend, twist, push, prod pull and snap into place. You can do a few minor hacks to Bluemarine and get pretty good results. Bluemarine is highly flexible.

On the other hand, Garland is pretty much good for what it's good for. But if you want something else, you're not going to be able to push it into doing that. Sure, it shows off a nice aesthetic, and has a pretty spiffy color picker, but that's pretty much all it does. Once you start trying to reposition stuff, you're in for a headache unless you're a CSS master.

I think Drupal is in the process of struggling between two forces, and we have to be careful. We need Garland, but we can't let Garland actually dominate. Bluemarine has dominated for years, and we've seen the weakness that bluemarine brings: it looks blah, it's pretty confusing and it doesn't really draw the crowd in. Garland wows 'em with beauty, but it doesn't let them do anything really cool with it.

Drupal's power is in its Power. We have to be very careful to not let our attempts to beautify Drupal rob it of its power. I'm still not convinced that having Garland be the only new theme to ship with Drupal 5 is the right move. I still think we should have Zen in there, so that the kids who want to play with Drupal can grab Zen, tweak a bit, and have their own theme relatively quickly. PHPTemplates are scary enough as it is; but complex CSS is going to be an impediment to actually doing something with it.

I want prettier. I want easier to use. But I don't want less flexible.

A different take on identity

I think the real identity crisis in Drupal is:
(1) Is Drupal something you use to do X (blogging, podcasting, etc.).
(2) Is Drupal something you can build into a solution for doing X.

I would suggest the ultimate goal/direction is not Garland vs. Zen, but how do you build Garland out of Zen? That way folks can hack on the pre-configuration to their heart's content, but there is something that does X out the box.

This approach allows you to serve three masters:
(1) "I don't want to think" users get the sexy pre-configuration of Zen.
(2) "I want to do something cool" users can start with the base Zen and do something cool.
(3) Drupal developers can rebuild the theme from the ground up

:)

I like the fact that Garland

I like the fact that Garland is hard to modify. Themes can be cheapened by people altering them poorly for their own websites.

I'm not against people re-using themes (that would be silly) but from a marketing/branding point-of-view, I'm very happy in this case. Garland will be Garland, an extension of the Drupal brand (with alternative coloring so we don't all go insane).

Pity for the designers

(sorry for the long post)

You're totally right... it's crazy to use Garland as a generic base theme, if you have a custom design in mind. That's what I've been saying since day one :). But you seem to look for various scapegoats, when the real problem is simply that CSS support sucks big fat hairy cock. Really.

The reality of tableless CSS is that it's one big, ugly hack. CSS1-2 has no concept of columns, so we use floats to fake them. But 90% of all CSS 'techniques' are patch jobs that fail to work in some situation or other. For a generic CMS, this is hell. For example, equal height columns means you can't use anchors on elements. Most pre-made CSS layouts can't even handle a 'clear' inside them, and no tableless theme out there can handle wide content well. In fact, the only time tableless really works, is for minimalist themes, where there are few or no borders or backgrounds. It is very frustrating to work with CSS, and to have to cope with unrealistic expectations set by various supposed CSS experts, whose templates fall apart at the slightest hint of non-trivial contents and markup.

Many developers underestimate what a nightmare it is to do a pretty looking, CSS-based theme. I've done tons of coding and lots of CSS, and there is no doubt that CSS is insanely more frustrating and draining. Think of those couple times when you ran into a PHP problem: an API function is written in a less than ideal way, or there is a language bug which you have to work around. Sucks eh.

Now instead, imagine that your code has to run on 5 or 6 different versions of PHP, each of which supports only a buggy subset of everything. Oh, and you have to run on PHP3 too (hello IE6). A CSS designer's job consists of nothing but these problems day in day out.

But I think you're missing one thing here: you've said before that you're not a designer person at all (re: garland discussions). The truth is that Garland is a designer's theme, and that Bluemarine was a coder's theme. I know there was some fuss in the Garland discussions about whether coders' opinions are valued as much, and I still feel the same way. If you don't know CSS, you don't do graphics editing, and you can't create a good color scheme, then you should not be doing theming. If a designer comes at you and says that we should have a module downloader/installer in Drupal Core, a coder can rightly point to practical problems such as security issues or update problems. This applies in reverse too: if a coder wants a flexible, utopian, clean, semantic theme, the designer is going to have to disappoint and instead come up with something that actually works.

Within the limits of the theme, Garland offers a large amount of new power. It's not just about being able to change the colors, but that we provide the base template in a form which is useful for designers: namely, the base.png. You can edit this file in Photoshop, or make your own, and have a theme that looks quite different. The images are sliced and composited for you. If you do graphics editing as well as know your CSS, Garland is not quite the monolithic "one look suits all" theme you make it out to be.

And that is even ignoring the simple fact that all the cases where Bluemarine was used before, we will now at least have an attractive replacement theme: e.g. quick prototype demos to clients, small sites on a tiny budget or even just your own development.

As far as Zen goes: I personally think it is a bit of a pipe dream. For non-trivial designs, you always need extra wrappers, extra markup, or simply need to shift stuff around in the document. And the CSS knowledge needed to make a beautiful theme on bare markup is very rare too. Zen is a base to start from, but will not result in an explosion of fabulously designed, clean, tableless, one-size-fits-all plug-and-play themes. The same problems I encountered in Garland will trouble other designers.

I think the choice of not including Zen in 5.0 was a good one. It is mostly a practical choice: to limit the amount of code going in so late to the absolute minimum. Zen can be refined in contrib, can be prominently linked in the Theme Developer's Guide, and still reach almost the same exposure as it would being included in core.

Nono...

But I think you're missing one thing here: you've said before that you're not a designer person at all (re: garland discussions). The truth is that Garland is a designer's theme, and that Bluemarine was a coder's theme.

I definitely didn't miss that point; perhaps I understated it but that was exactly the microcosm that I was pointing to. It's the dichotomy between power and beauty.

And you're right, I'm not a designer, but I do feel I have an eye for design. I dabble enough in it that while I cannot create from scratch, I can do a fair job of replication and tweaking to make things look at least acceptible. I in no way expect to be put into actual design work but I feel I know enough about the topic to be at least be included in discussion about it.

Garland is not quite the monolithic "one look suits all" theme you make it out to be.

I don't think I actually said anything of that sort; but there's nothing you can do to Garland where it won't still look fundamentally like Garland, just with a different color scheme and maybe some tweaked graphics. If you go much beyond that you're far better off starting from a better base or even from scratch; and at the level you're talking about, I suspect it would be more from scratch.

I admit -- I'm likely biased because I do not find Garland to actually be attractive. I don't like the way it frames things, I don't like the default color choices and fades. I do find it better than bluemarine by a fair bit, but in the same way that you find Zen to be unattractive, I find Garland to be unattractive. Beauty is, as always, in the eye of the beholder.

From your response, I think I failed a bit in where my point actually was meant to go. I think I ended up talking about Garland vs Zen too much, what I really wanted to point out -- and not in a "We need to do something about it" way was that Garland is a microcosm of Drupal right now. All of the points that you and I both bring up are reflected in the larger scheme of Drupal. I hadn't really intended to make this a "Garland sucks" post, that isn't my intent, but yes, I'm clearly more over in the coder's corner.

Should it do everything out of the box? Should it be beautiful? What exactly should it be?

Finally, I don't argue that CSS is broken, in part because browser support for it is so completely varied and in part because it just doesn't address enough of what it needs to do. In theory CSS3 would be better. But CSS is what we've got. There are some very silly things that are just impossible with CSS, and the whole float/clear thing doesn't work as well as it ought. I think this is as much browser implementation as it is a problem with CSS itself, though I could be wrong. I haven't read the actual spec in that level of detail.

bluemarine hasn't gone anywhere

in drupal5, we did not take anything any. we *added* a new theme, and made it the default. bluemarine is still there for anyone who wants. zen is also there for those who like that flavor.

zen would have gottten in but it was madness just before code freeze, and i think dries did well to limit the sope of the changes then.

all it takes is a few blog and forum posts like this to guide people to zen/bluemarine and they most will find the recommended way.

Power

I think the fight for power is over.
Drupal is - with views, cck, panels, forms etc - a PLATFORM.
The purpose of Garland is to lure people into Drupal who have yet to learn the beauty of power, by giving them the candy they know so well - a slick design out of the box.
Once they're here - they'll hopefully learn to appreciate the REAL value of Drupal.
In my opinion this last statement is what I worry about.
The Drupal community could drown in designers and usability "experts" who want to water down all the power of Drupal - with the distinct goal of making it look and work just like all the "other" OS CMS's out there.
They won't succeed - it's too late. But they may make a lot of noise and take away focus.
And that would be a real shame.
Because Drupal really NEEDS to make the decision and realize that it's a platform.

On that platform we can have a couple of implementations of out of the box blogging system, small website content management system, community system etc.

Garland great for marketing

I really didn't like the new theme when I first saw it as Themetastic but Steven has done an amazing job with it and now it's one of the main selling points of Drupal 5, if only on the surface. As someone who tries to push people towards Drupal as much as possible (I've convinced several projects to use it already) I was always hampered by all the default themes. Now, I can install Drupal for someone (or now even just tell them to install it) and it looks like a professional site out of the box. That is huge! And then, I tell them about Views and Panels (and CCK, Workflow, Actions - and jQuery) and the "sale" is closed.

Frankly, I thought that I'd never use Garland on a site of mine but I recently needed to set up a simple blog and a few color changes later, there it was running with Garland. I will probably change it later but I didn't have to spend the time up front and it won't be awful if I never get around to it.

I hope that an upgraded (even easier to modify) Zen will eventually make it into core distribution - perhaps just a link would be nice. One of the reasons for that is that I also agree with Steven on the limitations of CSS for layout. I'm gratified to hear something that I've privately maintained for a while from someone with such CSS chops. The bottom line is that you have to do CSS layout pretty much all the time for it to become intuitive whereas you simply have to explain table-based layout to someone (in a few sentences) and they can do it from then on (sure there are still a few hacks but it's easier to figure them out). That means that an easy-to-modify CSS-based theme would be a great asset to the Drupal community - how realistic this is, I will have to leave to the experts.

Two cents

I like Garland a lot, love the color module even more, and I and think it is a great default choice for Drupal.

That said, Garland AND BlueMarine tweaking is wayyyy beyond the skills of most non-designer/non-developers. I've seen this firsthand - most end users do not know, and do not want to know the first thing about edting anything with 'icky code' in it. So it's really a matter of preference for the people who do mess with the code. For anyone to say that 100%-css designs are "preferred/better for all designers" isn't any more correct than saying that PHP is better than any other language for all programmers.

My personal preference as a designer is a hybrid css/table combination. For me it is the most easy to configure, and most reliable across browsers way to setup a theme.

yes.. css is a joke...

if it werent for ie5/ie6 and safari, I might actually enjoy doing css themes. the comment about having to work with 5 or 6 different subsets of php and even dealing with php3 simultaneously is spot on.

css themeing is a time drain. there is no sense to it. there is so much trial and error its ridiculous. i am ashamed to say that more than 1/2 my time deploying a site is wasted tweaking css to fit non standard browsers. what was the ie6 team thinking? no png support? DUUUUUUHHHHH!!!???

lately i have been considering doing more tables as well... and even stuffing in alot of dynamic flash to get something that will look the same in all browsers.

many browsers implementation of css is a joke and so is scientology.

wouldnt it be nice if there was some way to bypass it completely and have some abstact theme language for drupal so that what you "see" is what you "get"? what could accomplish this? some advanced ajax drag and drop, resizable, add your jpgs here, stack em there,.... thinga majig? hmmmm....

Angry Donuts

i was googling 'microcosm' and came up with this site. the funny thing is, this summer i was in romania, where there is an actual franchise chain called 'gogoasa infuriata' which i think basically means hot/pissed-off donut. the logo is a little pissed-off/hot donut.

check out:
http://www.gogoasainfuriata.ro

regards,
toby

CSS is for masochists (This is a troll)

I just spent the whole night trying to get CSS to work and I realised that CSS is for people who are in love with pain.

They painstakingly spend a lot of time on their hand crafted CSS to accomplish pretty looking stuff and they feel they ought to wax lyrical about it to justify it. (This is a troll)

The bottom line is what difference does it make to the end users?

There is hardly any economic justification for using CSS (not in my line of work anyway). I hope that one day I will see the light and have to eat my tables.

Garland isn't easy to

Garland isn't easy to modify, that's true.

Garland Is Easy to modify.

Take look at the follow pages:
drupal.org/node/138588
drupal.org/node/132476
vivianbeanland.com/ventura08/garlandmod2.htm

If you look for theme for modification you can start with Drupal Zen Theme. You can se one of the "mods" at Drupal Bluebreeze Theme.

no, garland is a beast to customize

I love vaskos' tutorial-- it's a really creative, attractive design based upon the garland theme. But after successfully implementing (and even trying to contribute a psd with slices vs the available psp file) after 4 hrs, I sat back contentedly... and cried. My design doesn't have a leftnav, so it immediately broke for anonymous users!!

There is no argument that the Garland theme can be themed-- what Merlin rightly forewarned is that it's neither a simple nor straightforward task. In the posted tutorial, the task was followable but very rigid. (And what's up with the 150k bg images? :) )

I love the stretchiness of Garland, but for Drupal 5.x, Zen is the way to roll.

Post new comment

The content of this field is kept private and will not be shown publicly.