We both know that the most important impression you need to make is your first one. So after more than two years, Drupal has a new default theme. The new theme is called Garland and was created by Stefan Nagtegaal and Steven Wittens. Garland will ship with Drupal 5.0.

Better yet, we added a color picker that allows administrators to change the theme's color scheme without having to touch a single line of HTML/CSS. So not only brings this new default core theme raw beauty, it is actually the easiest to customize Drupal theme in existence.

A lot of hard work went into the creation and selection of a new core theme. Thanks to everyone who submitted candidates that weren't chosen in the end. We'll add (or replace) more themes in future versions of Drupal. Great job guys!

A screenshot of Garland in action

Comments

RobLoach’s picture

Can't wait for Drupal 5.0! Great job, Stefan and Steven... Robert Douglass posted some notes about it here.

chess2u.com’s picture

Very nice theme and approach !
But nobody cares about valid CSS code: http://jigsaw.w3.org/css-validator/

------
DruChess
------

Steven’s picture

The Garland stylesheet is valid, provided you validate against CSS3, not CSS2.

Still, don't stare yourself blind on validators, especially for CSS. The CSS specification explicitly says how parsers should deal with CSS rules they don't understand, so as long as you respect certain rules, there is no problem in using proprietary or unsupported styles.

--
If you have a problem, please search before posting a question.

chess2u.com’s picture

Agreed, thanks !

------
DruChess
WinDict
------

SSHGuy’s picture

I do not understand why people car so much about these validators these day, if a site is working in all browsers, it is valid for me :-)

______
SEO Blog

bertboerland’s picture

sure, you want "best viewed in browser x", "mslookup" to do nslookups, netbios or ipx as internet protocol and only want to be able to watch televisionshows on tvsets from philips while your new car can only use shell petrol.

if you dont care about standards, you will be ruled by those making their own "standard". they have tried that, we won. and we are not going back.

--
groets
bert boerland

--
groets
bert boerland

mango’s picture

I didn't think it was worth commenting on the stab at valid coding, but I fully agree with Bert. Can you imagine if you could only phone people using the same phone company and the same mobile phone brand? What a mess!

Obviously the author wasn't even thinking about other uses of web pages, such as mobile internet, feed readers and the like. Why is this so difficult to understand?

styro’s picture

The first step in debugging a rendering issue with your HTML or CSS is to check whether or not it is valid.

If your HTML or CSS has bugs in it, you are asking browsers to make a complete guess at how to render it. Some may try to ignore it, some may make wild assumptions as to want you really wanted - this can lead to issues that pop up in seemingly unrelated parts of the page which can lead to a game of whack-a-mole as you end up chasing symptoms rather than fixing the real issue.

Trying to get invalid markup/styles to render consistently across browsers is way harder than trying to get valid markup/styles to render consistently.

Browsers can act in seemingly random fashion sometimes - adding extra entropy into the equation with buggy code seems a bit silly.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

hanovirati’s picture

That was always my opinion as well, if it's good in major bworsers it's good overall. But probably validated code has some benefits as well.

Evgenij’s picture

I do not understand also, why a Theme must be validated, if it is compatible to all Browser.

Gaco’s picture

... "why a Theme must be validated, if it is compatible to all Browser. "

It is a LOT easier to validate against a set of standards, than trying to test against ALL browsers.

I know, when I do web development, I make sure my sites look decent in Mozilla (Firefox), IE and Opera. But also validate against the standard, because I'm pretty sure there are MANY other browsers out there. After validating, I still have to go back and make sure the sites look good, due to some browser (you know who) doesn´t adhere to the standards.

Furthermore, there are guidelines for writing CSS for other media than Screen. What if some blind person would like to ready your Blog you have in your site, then, he/she will get all this -noise- not related to the content itself.

ojkelly’s picture

This theme looks very good. and the ability to change the color? Awesome.

Give yourself a pat on the Back

--
ojk007.com

bertboerland’s picture

an inline colorpicker was also in a very old theme (hence no ajax) called "polder", the ability to alter colors form /within/ the theme without editing stylesheets was something that was rather nice for the non css savy under us, good to see it back by default.

(--
groets
bertb

--
groets
bert boerland

rentex’s picture

Looks great!!

jakeg’s picture

Am I being to blind to find this, or is the colour picker not in cvs yet?

Jake
---
School and university yearbooks

Heine’s picture

mcgwest’s picture

I have the color module enabled but am still not seeing the color picker when I go to the garland configure page. Any ideas?

The theme looks great!

Thanks.

mcgwest’s picture

I didn't have the PHP GD library enabled. All is well.

Oceria’s picture

I DID have the gd lib enabled on my server (and the color module), but I still can't see the color picker in the settings page in the Beta-2. What am I doing wrong?

jbc’s picture

Ditto.

Have just installed Drupal5 Beta2, ("a work of art"!) and no colour picker can be found!

I am using Apache server via XAMPP and the GD section within phpinfo says it is all enabled, as is the color module. But no colour picker. Anyone know what the problem might be?

thanks!
John

marky’s picture

If you're sure you've got at least the gd library available, have a look here.

--
/marky

Oceria’s picture

I'll be damned. Setting files to public made the color-picker come up perfectly. Strange though that you need to set files to public to change them. In my opinion a small security item and something that should not be there in the final version. But then again: it is indeed still a beta. Thanks for pointing us to that particulair post! :)

Oceria doesn't know where this -repeatbutton -repeatbutton is....

owahab’s picture

Dries,

Nice job really from everyone, I liked the theme really much since you started talking about it in the mailing list, I was just too busy to give more eyeballs.

Now that I did, I've some notes on the demo I seen on http://istyledthis.nl/ and http://www.xcite-online.de/drupal :

1. Resizing the browser to a certain size will make the page vertically scrollable, not only this but the background for the right bar ends before the right bar itself ends, I think this is due to giving a DIV in the top area 100% width and it's the background image carrier. I think the background image might be split between multiple layers.
2. When viewed in Lynx or in Firefox with styles disabled, all page content appear with no spaces between which makes it hard to differentiate between blocks, this can be fixed easily putting few line breaks here and there.
3. If it's not now so when are we going to style buttons and input elements? A background image for buttons will make buttons shiny and really different and a hover for input elements in a la Mozilla style will make up the theme.
4. The page looks really great in the upper part, scroll down and you'll really lose it. This means that any long page will look ugly. I'd like to see the white lines between the content and the right and left bars to continue until the bottom.
5. The theme imports about 6-7 CSS files which means way much CSS files, this has effects on connections made per single page request.
6. It's really awesome, it's the best theme I've ever seen for Drupal.

Hope this wasn't too much.

Steven’s picture

The version at iStyledThis.nl is quite old and outdated. The latest demo is at http://acko.net/garland .

Also, if you have bugs to report, please use the issue tracker. Posting comments on announcement threads is quite useless.

--
If you have a problem, please search before posting a question.

owahab’s picture

Sorry if that offended anyone.
I reviewed the above link and posted an issue.
Thanks Steven.

3dsoft’s picture

Looks cool! You have done a good job.

horse ranch
-----------------
www.joelle.de

gopher’s picture

Excellent job on the new default theme. Simple, stylish, slick. The color picker is great too.

Cool_Goose’s picture

It's great :D. Hmm :D
------------------------------------------------------
Be Smart, Think Free, Choose OpenSource.

prameya’s picture

neat.. i cant wait to upgrade to drupal 5.0

oh is the upgrade automatic?

CJNepal.org | Nepal News and Blogs - The Community!

Bahattee’s picture

Fantastic theme!

pichot’s picture

The theme looks great! Another important step in improving new users' first impression of Drupal.

Jonathan

PS - Will we be able to integrate the color picker into some of our own themes?

shishira’s picture

And no TABLES

Great theme

mortendk’s picture

wow looks great :)
i knew mr wittens had a greater goal with his jQuery color picker plugin ;)
a pad on the back and a beer in the bar to the lads!

/morten.dk *king of Denmark*

dvessel’s picture

I'm really digging the color picker. How on earth does it produce that gradient on the fly from both ends? Very slick Stefen's ;). Congratulations for putting out an amazing job.

joon

solipsist’s picture

It uses PNG images with alpha channels.

--
Jakob Persson
Drupal developer, web designer and usability consultant
http://www.jakob-persson.com

--
Jakob Persson - blog
Leancept – Digital effect and innovation agency

dvessel’s picture

I mean the color preview on the header. The gradient is dynamic from both ends. Definitely goes beyond transparent png's. There is a bit of stepping or posterizing but still it does the job very well.

joon

Steven’s picture

It's just a bunch of divs with a solid background color, calculated on the spot.

--
If you have a problem, please search before posting a question.

frankzzsword’s picture

Amazing, cant wait for drupal 5 :WOW:

------------------------
Always remeber, whatever do, the best be

Walt Esquivel’s picture

The theme looks great and the color picker ability is wonderful!!!

I look forward to not having to go into my styles file to mess with CSS for color changes and not having to then FTP the modified file to my server. This is awesome!!!

Congrats and thank you so much! I look forward to Drupal 5.0!! You guys rock!!!

Walt Esquivel, MBA, MA
President, Wellness Corps; Captain, USMC (Veteran)
$50 Hosting Discount Helps Projects Needing Financing

mango’s picture

Absolutely fabulous! Wonderful job guys!

rays’s picture

This is so Web 2.0!

ezichko’s picture

I thought the same thing, hehe.!
You only have to add a reflection to the logo and a beta next to it.

drubeedoo’s picture

Stefan and Steven, your hard work really shows. Thanks for making such a highly visible and aesthetically pleasing addition to the project. The new face of Drupal 5 is a great step towards a professional and polished look out of the box. Thank you both very much.

seaneffel’s picture

Nice work!

Already I am visualizing a color picker randomizer to play nicely with Garland. Each page load or each user gets a random color scheme, maybe with some parameters so it wouldn't be unreadable. Maybe it would randomize a parent color, then each lighter shade would be a calculated child value. Anyone have any ideas?

StevenSokulski’s picture

Why not allow each user to customize the site's colors upon login to their liking. Or use it for a profile module to let the users customize their page without jacking up the site (*cough* MySpace *cough*).

bugz_nz’s picture

This new theme looks great. Ideal for a default - simple and stylish.

Well done to all those involved.

rbrooks00’s picture

I hadn't seen this anywhere so I figured I'd just ask - has this theme been tested against FF 2.0 and IE 7 yet? I'm running FF 2.0 and it seems to work fine on Steven's test site but I can't install IE 7 at work (IT won't allow it) or at home (I have a non-intel mac) so I don't know if it looks a-ok or not.

Other than that really good work! I'd been following this discussion on the dev list for the most part and I wasn't supremely jazzed up about the design, but the addition of the color picker really rocks and is a great use of the jquery stuff.

===
BuyBlue.org | The Blue Fund | Lullabot

styro’s picture

Just a FYI: Firefox 2 has the same rendering engine as 1.5. You only need to worry about IE7 :)

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

sepeck’s picture

It's been tested in pretty much the full range.

-Steven Peck
---------
Test site, always start with a test site.
Drupal Best Practices Guide -|- Black Mountain

-Steven Peck
---------
Test site, always start with a test site.
Drupal Best Practices Guide

styro’s picture

it wasn't very clear I was talking in general about testing sites in Firefox 2, rather than whether the new theme was tested in IE7.

I should've just left off that dig at IE7.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

StevenSokulski’s picture

Why? If you can't take the occasional dig at IE when amongst developers and themers then where can you?

sepeck’s picture

This theme has been tested and works with IE7. Feel free to rant against IE7 elsewhere.. ;)

-Steven Peck
---------
Test site, always start with a test site.
Drupal Best Practices Guide -|- Black Mountain

-Steven Peck
---------
Test site, always start with a test site.
Drupal Best Practices Guide

jairo.serrano’s picture

Impresionante ¿0.o?

Jairo Serrano
Ingeniero de Sistemas
Drupal Spanish

donkomo’s picture

Nice theme...
I can't wait for Drupal 5.0
And Anybody here can test for jquery for drupal 5.0 aslike yahoo site?? with tab customisation....

Bravo ...

People's Cultural Network
JAKER

squaretone’s picture

candidates that weren't chosen in the end

So do we get a peek at the runners up? Will any of those be making an appearance as contributed themes? I'd love to see some of those.

Eric Lawrence
Developer/UX Designer
http://squaretone.com

ericgundersen’s picture

This looks and works amazingly :) Fantastic job to you all.

ac’s picture

Great job. This is looking like an amazing release.
------------------------------
Alex Cochrane
Spoon Media

pamphile’s picture

This is great news... But I can't stop wondering about the old existing 4.7 theme. not Garland. Will the old theme get added to the Drupal themes ?

Marcel
Drupal powered Wholesale Forum and Community
Travel To China

Heine’s picture

If you download the archive and browse to the directory themes, you will notice that the following themes are in core:

bluemarine, chameleon (+marvin), garland, pushbutton

--
The Manual | Troubleshooting FAQ | Tips for posting | How to report a security issue.

brakkar’s picture

Theme looks good for sure.
But I won't be using it since I already have my fully customized theme.

How difficult will it be for 4.7x theme (phptemplate) to convert to 5 ? I got a heavily customized page.tpl.php .... will it be easy to port it to 5 ?

Cordially,
Brakkar

Michelle’s picture

http://drupal.org/node/64292

Michelle

--------------------------------------
My site: http://shellmultimedia.com

sime’s picture

I just want to say, garland is freakin' sexy. Thanks a heap to Stefan and Steven

zevgreen’s picture

I love this theme. The only thing that I had an issue with was the images put into the page need to be sized correctly otherwise they bleed over the blocks on the right. Other than that, well done!

----
Zev Green
work@zevnet.com

pamphile’s picture

This is a Garland installation I installed for my wife on "Loving Ways".

Loving Ways
http://www.lovingways.com

Marcel
Football blog

fraew’s picture

theme looks great, but any chance at expanding the color picker to include secondary link color? i think at the moment it picks the opposite shade of primary links (relative to the base color?), which can be a bit of a nasty combination...

beholder’s picture

Why don't authors make all links in garland underlined? It is serious usability problem I think.

--
the beauty is in the eyes of the beholder

bertboerland’s picture

i hate it when people say "there is a module for it", or "that can be themed". but here the later is true. it is rather easy to edit the css file to underline links. trivial i would say

there is no complete inline css editing module within drupal that i know of, so vi (or notepad :-) is your friend here

--
groets
bertb

--
groets
bert boerland

beholder’s picture

I know that it is easy to edit CSS file, but people who will use this theme by default may not want to edit core theme files. And they may not know anything about needing of underlying links. Bluemarine has bolded its links — it's better then nothing, while garland highlights links only by color.

--
the beauty is in the eyes of the beholder

luckydad’s picture

Hi-

I am a newb to drupal and CSS, would you be so kind as to tell me how to
edit the Garland theme css files to make all links underlined?

I have modified style.css and node.css to no effect. It appears that a
number of classes affect the navigation links (menu-1-etc.) but this class
is not defined in any of the imported CSS files. Is it created in the php
template files?

Please help.

Thanks,

Michael

Michelle’s picture

Welcome to Drupal. :)

Please start a new forum post for support requests. This is a really old post and your question is not as likely to be seen.

By the way, Garland is notoriously hard to modify so you may want to start with an easier theme.

Michelle

--------------------------------------
See my Drupal articles and tutorials or come check out life in the Coulee Region.

artist.lupein’s picture

I bet you have changed color scheme. Garland is a specific theme - it uses color module which generate new CSS out of default CSS and color settings.

What you need to do is get color settings for Garland theme back to default (Blue Lagoon) and than edit the CSS. Once you do your changes to CSS you can set your preferred colors again.

If you are interested how this works, there is an article here - http://drupal.org/node/108459.

Hope this helped you.

--
Lupein
Drupal themes - themeartists.com

claus2080’s picture

hey very nice features, but i think with drupal 5 a lot of documentation is missing.
documentation is what made drupal big, as it allowed people to extend the core.

but i feel that with 5 documentation is not being done. color module is something magical and i don't have a clue on how to interface it with templates i am writing. it would be great if it was explained somewhere. all i see is color.module and color.inc with very little insight about what is going on and about how i can use them in my template.

open source is not only releasing the code but also documenting it so other people can also work with it.

StevenSokulski’s picture

I think right now most of the people that worked on color module are pretty busy trying to make 5.0 ready for release. I would assume that once 5.0 is out of the nest some very complete color.module docs will show up. I looked as well, but would rather see 5.0 launch first then some nice docs rather than docs that are slapped together in between working on 5.0 projects.

bradlis7’s picture

I created a few issues on the topic, one requesting documentation (http://drupal.org/node/99712), and one with problems (http://drupal.org/node/100026). I think the color.module right now is pretty specific to the Garland theme, so I'm not sure if we'll have it working well for other themes for 5.0.

--
Bradlis7.com | Churchofchristnet

meignorant’s picture

Hey!
I am new here and don't understand everything, but why comment module appears broken in Garland (beta 2)? When page is viewed in IE 6 and 7 there is no "Add new comment" link visible.

meignorant’s picture

My apologies. It has nothing to do with the browser. Adding comments is disabled by default for not-authenticated users. I was using Firefox and naturally was authenticated only in Firefox. False alarm, sorry..

hk30’s picture

Muslim guy’s picture

Just wanna share with newbies on how we managed to copy from Joomla 1.01 default side menu (its color is dark grey and hover is red) and make our Drupal sites more 3D :) It looks like piano keys. Anybody can create own menu_bg.png to have the color of choice

If it's appropriate, maybe Drupal default theme have this to display a nice link/hover for `node title' and `read more'

Otherwise, Garland theme is very nice and we loved it already

We added to style.css

a.read-more:link, a.read-more:visited {
display: block;
background: url(menu_bg.png) no-repeat;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #fff;
text-align: left;
padding-top: 5px;
padding-left: 18px;
height: 20px !important;
height: 25px;
width: 100%;
text-decoration: none;
}
a.read-more:hover {
background-position: 0px -25px;
text-decoration: none;
color: #fff;
}
a.read-more#active_menu {
color:#fff;
font-weight: bold;
}
a.read-more#active_menu:hover {
color: #fff;
}
a.title:link, a.title:visited {
display: block;
background: url(menu_bg3.png) repeat;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #fff;
text-align: left;
padding-top: 5px;
padding-left: 18px;
height: 20px !important;
height: 25px;
width: 100%;
text-decoration: none;
}
a.title:hover {
background-position: 0px -25px;
text-decoration: none;
color: #fff;
}
a.title#active_menu {
color:#fff;
font-weight: bold;
}
a.title#active_menu:hover {
color: #fff;
}

And edit node.tpl.php so that Node title will have class="title"

And upload these small PNGs to a theme folder

http://drupalmalaysia.org/Add-3D-menu.zip

The 3d menu and links can be seen as example at

http://galendaskincare.com

Cheers

nicopepe’s picture

Hello,
This theme is really very nice. I would like to make my own theme from Garland Theme. As i am not an HTML-CSS Expert, i would like to know if there is a documentation or any tutorial to understand what and where to modify this theme ?

Thank you

jmpapi’s picture

Hi,

I'm using the garland theme, because in the other themes, the Tinymce editor doesn't work.
Now I wanted to custom my theme using the color picker. He shows me the preview, but when I apply the color scheme, I still have the original colors.
Anyone any ideas what it could be? :)

kickn’s picture

I'm working on some slight changes and inverting the garland theme - I can see the blend target reference but when I invert the .png's and change the blend target to #000 I get weird colors - light pastels - I'm assuming the calculation is backwards but can't find it in the code - can someone point me in the right direction?

Thanks,

James

MatthewT_01’s picture

I've found the same problems.. I'm getting odd colors in some places when trying to create a them based on black instead of white.
I'm getting a great look on the header.. but the lower half of the page seems impossible to control.

sime’s picture

MathewT_01 and kickn

You'll have more luck posting these issues in the ">drupal issues queue
(Please search first)

romandr’s picture

Agree, Garland is great & very nice, but ...

I have just installed and tested Drupal 5.1 with garland & minnelli themes. It looks fine with Interner Explorer 6.X, but left sidebar (for Navigation and Login blocks) is invisible for Interner Explorer 5.0. No problem with other themes in my installation.

Is there a way to use garland & minnelli with most browsers including old ones (for example IE 5.0) ? Or have I missed something?

Thanks,
Roman

sime’s picture

IE5 is an unsupported browser. What if I asked you to write your post in Latin? It is still used in universities, after all. ;-)

Seriously though, if you need to use garland AND support iE5/IE5.5, the you might find some useful info on this thread: http://drupal.org/node/112842

romandr’s picture

thanks for your link you provided.

dkatzman’s picture

Hi Dries, All,

This appears to be a recurring issue and there has been no real solution so far. Apparently the color changer creates a directory and some files on the webserver, but some servers have some kind of SAFE MODE that interferes with the file creation. So no files are created because the created folder belongs to the webserver and has no 777 permissions...

In my personal case, I have tried modding the htaccess in the files folder and manually chmodding every folder created but it didn't work (the last option does not work because a new folder gets created every time...

You can see there are several Drupal users having this same problem in this thread

  • http://drupal.org/node/110916
  • Please, I need a usable solution asap. I'm running on a schedule!

    Thanks,

    DK

  • www.unmentor.com
  • www.profesorblog.com
  • www.riqueza360.com
  • www.jewishculturela.org
  • www.drbolsa.com
  • jordi_rc’s picture

    Hello

    I tried to change the colors of the default theme, and got an error that says that the memory_limit must be higher than 1.93

    My memory_limit was 8 mb, I use Xampp and it is located at opt/lampp/etc/php.ini on Linux. Seek for the line that says "memory_limit = 8M". Change to "memory_limit = 30M" and restart the server.
    Now Drupal will let you change the colors.

    Maybe your problem has to do with this too. Try to augment the memory_limit, and ask your provider to restart the webserver.

    Jordi R Cardona

    droshani’s picture

    I just installed Drupal 6 with Garland as default and I realized that the site Slogan appear in same size as the Site Title(Name), Is there any way to make the Slogan much smaller may be Italic as well?

    Thanks

    Walt Esquivel’s picture

    I ended up just removing the slogan since Garland doesn't display it very well.

    Walt Esquivel, MBA; MA; President, Wellness Corps; Captain, USMC (Veteran)
    $50 Hosting Discount Helps Projects Needing Financing