By reikiman on

Okay, here it is: CSS based themes for Drupal

I ended up packaging 22 separate themes in the one distribution, most of them cribbed from the wordpress style competition site that was posted earlier.

- David Herron, http://7gen.com

Comments

kolar’s picture

kolar commented

Here are more than 100 Styles from the wordpress style competition for Drupal.

http://www.langmi.de/themebrowser

reikiman’s picture

reikiman commented

However a) I chose only the ones I liked, b) a couple proved harder to modify than I wanted to deal with at the time.

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

3dsoft’s picture

3dsoft commented

Darn! You didn't include the "human_condition" one.
Seems like I gotta get to know styling in css better.

Anyway, thanks a lot for your contribution

gte451f’s picture

gte451f commented

How does one download any of the themes? They may not be available for download but since the site is in german, I had a hard time following links.

dman’s picture

dman commented

What link did YOU click?
EDIT:
Ooops, I see you were referring to the other post. Anyway, the themes are the same - David made a collection of (re-used) themes that are also on display for easy preview at the 'themebrowser' site.
Not everything at themebrowser is in the package, but everything in the package can be previewed at themebrowser.

The article is still right there, but the bundle itself is
http://7gen.com/files/cssimple.tar

Interestingly, the CSS for the page itself is broken or something
:-/

There were a couple of issues idendified - to do with the major & minor site links on a clean system - I dunno if this bundle has patched that.

.dan.

.dan. is the New Zealand Drupal Developer working on Government Web Standards

druvision’s picture

druvision commented

I've translated the german text of the wonderful Langmi themes with Google. Here is the translation. Indeed, the basic version can be downloaded, but I don't know where to download all the addons. Can someone enlighten me?

Amnon
-
Personal: Bring Dolphin's Simple Joy to your Work - Job - Career
Professional: Small Business Web Hosting Strategies, עסקים ברשת - מדריך ליזם

ArunK’s picture

ArunK commented

Where can I download these from?

PurpleEdge’s picture

PurpleEdge commented

Excellent! Thank you.

cel4145’s picture

cel4145 commented

I am maintaining about 50 sites for teachers. They'll love all the choices that these themes will give them :)

venkat-rk’s picture

venkat-rk commented

Sounds great. But, I can't see the download link anywhere on the page.

3dsoft’s picture

3dsoft commented

at the bottom of the page in the left corner.
Right beneath "Attachment Size".

venkat-rk’s picture

venkat-rk commented

Thanks, I missed it because of the graphic just above the link.

reikiman’s picture

reikiman commented

I redid cssimple to use the PHPTemplate model rather than .theme. It caught my attention that 4.7.0 is going to prefer PHPTemplate, and that method is actually pretty nice.

I also did a couple small fixes to some of the themes.

It's on the same page as linked above.

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

michelle’s picture

michelle
she/her
Primary language English
Location Wisconsin, USA
commented

I looked at them but lost interest when I saw they weren't PHPTemplate. Gonna take another look now!

Thanks for doing this,

Michelle

likoma’s picture

likoma commented

David,

Great work! Perfect timing! I had been struggling with Spread Firefox for several hours this afternoon (seems so long ago, I can't even remember what the problem was) when I said to myself, "I just want a simple 3-column CSS theme ... " Sigh. Found you!

In progress, but one glitch so far--probably my doing. Using metaldreams and on the contact page, the left sidebar moves a third of the way across the content area covering the fields. This only happens in IE for Windows (Firefox is fine). I've made it a fixed width (780px) and if I leave that out or make it fluid, it's OK, but I can't figure out where the problem is.

I can fix just that page by making the negative margin for #content-left (in threecol.css) -225px or so and then it looks fine, but every other page is messed up--the sidebar is probably way off to the left somewhere. So it's a conflict with the contact page (the tables and fields, I guess). I don't see a way to upload a file to a comment, so I put a screen shot here.

Tired on a Friday night. Any ideas?

Again, thanks for the great work!

Best regards,

- Bradley

reikiman’s picture

reikiman commented

I'm on a Mac running Firefox (having divorced myself of Microsoft's feeble attempts at software long ago) and I knew this was a risk. But, heck, with IE 5.5 / Mac there's some problems that need to be debugged. *sigh*

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

reikiman’s picture

reikiman commented

Viewed using firefox/mac

The middle-content area is still pretty wide, so the text entry boxes in the middle column go way out over the right hand column (#content-right)

You probably left the #content margin alone?

For myself I prefer page-filling layouts, so that's what I'm testing for. I see you've centered everything with wide margins on both left and right.

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

likoma’s picture

likoma commented

Thanks for responding.

I just switched it back to fluid and the contact page looks fine in IE Win. Hmm. If I drag my window smaller, however, they close in on the center like, well, scissors. I'll keep messing with it and update my findings here.

I also have a Mac that I test on and I pretty much *don't care* about the tiny percentage of Mac IE users, most have moved to Safari and Firefox and if they haven't, they should!

Best,

- Bradley

sethcohn’s picture

sethcohn commented

Adding screenshots would go a long way toward making it even nicer to install these......

Nice job on the package though... you should get these into CVS

Need Drupal friendly hosting? Many of us use Site5 with good results

dman’s picture

dman commented

Mmm, why no screenshots?
I see a few random attempts with outsized jpegs, but nothing like the Theme screenshot guidelines.

Soo, I thought I'd be nice and prep these for us myself, save you the effort, macro up a screen-shotter. So I set up a clean system to put them all into, ... And the layout fell to pieces on the very first go :(

blorange looks stink in firefox (XP) with the slogan overlapping the heading border, and in IE(6) the white background only appears intermittantly (peekaboo I guess) making the content appear as orange text on gray.
Bad start.

Maybe it was just bad luck, I'll have a look at the others ...
And "blue" comes up with actual errors! Yay.
warning: Missing argument 1 for theme_help() in f:\hosts\drupal_development\wwwroot\includes\theme.inc on line 35.
and (what I guess are) the primary and secondary links display as "Array() Array()"
:-/
Some of that may be due to my squeaky-clean test site, but I dunno.

The missing logos are also causing broken-ness.

A great thought, but it's not yet quite a release.

.dan.

.dan. is the New Zealand Drupal Developer working on Government Web Standards

venkat-rk’s picture

venkat-rk commented

Thanks for raising this. I didn't want to be negative about a great idea, but everyone of these themes caused errors for me on a clean drupal install and viewing on Firefox 1.07 on WinXP Pro.

The most common error was having the admin and menu go way down the page and blocks going all over the page.

I will document them when I have the time.

michelle’s picture

michelle
she/her
Primary language English
Location Wisconsin, USA
commented

These aren't Drupal screenshots, but you can see generally what they look like, at least, by following the link on his site:

http://www.alexking.org/software/wordpress/style_browser.php

Michelle

Will Pate’s picture

Will Pate commented

Someone get this man a CVS account, stat!

http://drupal.org/cvs-account

+1 to screenshots.

sethcohn’s picture

sethcohn commented

You might want to stick a tiny logo.png in each, to eliminate the errors... also rubric is looking for a gradient.gif in a different path.

reikiman’s picture

reikiman commented

You mean cssrubric ....

Change the cssimple/cssrubric/style.css file to read:


body {
	background-image: url("../rubric/images/rubric/gradient.gif");
...

I should just remove cssrubric as that was my first shot at the project and is just a simplification of the rubric style.

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

sethcohn’s picture

sethcohn commented

With the change to phptemplate, the primary and secondary link display code in page.tpl.php is incorrect. Use the code from one of the working phptemplate examples like box-gray or bluemarine (the phptemplate version). As it stands, the links are an array, and print only 'Array'.

Need Drupal friendly hosting? Many of us use Site5 with good results

reikiman’s picture

reikiman commented

That violated the principle of least surprise. Anyway ...

Here's what I'm using at the moment. The default styling for the lists makes it into tabs, which is a nice effect.

<?
  if ($primary_links || $secondary_links) {
    ?><div class="navlinks">
    	<?
	if (is_array($primary_links)) {
		?>
		<ul class="primary">
		<?
		foreach ($primary_links as $link) {
			?><li><?= $link ?></li><?
		}
		?></ul><?
	}
	?>
	<?
	if (is_array($secondary_links)) {
		?>
		<ul class="secondary">
		<?
		foreach ($secondary_links as $link) {
			?><li><?= $link ?></li><?
		}
		?></ul><?
	}
	?>
</div><?
  }
?>

And in layout-common.css


/* For primary and secondary links, we're using unordered lists
 * and turning off list styles.
 */
#navlinks #primary ul, #navlinks #secondary ul {
	list-style: none;
}

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

sethcohn’s picture

sethcohn commented

With the change to phptemplate, the primary and secondary link display code in page.tpl.php is incorrect. Use the code from one of the working phptemplate examples like box-gray or bluemarine (the phptemplate version). As it stands, the links are an array, and print only 'Array'.

Need Drupal friendly hosting? Many of us use Site5 with good results

drupalguest’s picture

drupalguest commented

Glad to see more themes. When I extracted it under the themes directory, it displayed all content in single column. How do I get it to display two/three column?

=====
Drupal hosting - use $60 off coupon: OCTCODE

Kaniva’s picture

Kaniva commented

hmmm what am i missing? im looking all over 7gen and cant find any templates :(

drupalguest’s picture

drupalguest commented

Scroll to the first post on top and click on "CSS based themes for Drupal". Warning: the layout is all messed up when I installed it.

=====
Drupal hosting - Up to $70 off, use coupon: HOTPROMO

PurpleEdge’s picture

PurpleEdge commented

Sounds like your css files can't be found? Are you sure you have installed into the correct folder? Worked on my machine.

pamphile’s picture

pamphile commented

awesome

netbjarne’s picture

netbjarne commented

Sigh - its almost harder to find a theme for drupal 4.7 that to get laid - well, almost...

I've tested the theme pack for drupal 4.7, and although the themes shows up nicely in drupal, they renders horrible in my Opera browser. Are these themes locked to a particular browser? - or is Opera to blame?

---
Testing drupal 4.7 cvs at http://drupaldanmark.dk/

reikiman’s picture

reikiman commented

I honestly haven't tested with other than firefox on OS X.

I only recently installed opera. I can't promise quick turnaround on testing with that, because I am in the middle of moving and will be tied up with that for another 2-3 weeks. Sorry.

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

andre75’s picture

andre75 commented

Downloads gone?
Somehow I cannot download it from your website anymore:
http://www.7gen.com/building-and-promoting-your-own-web-site/content-man...

I was using it on my photo site and I am getting ready to upgrade to 4.7. Would be great if you could check out what's going on.

-------------------------------------------------
http://www.opentravelinfo.com
http://www.aguntherphotography.com

reikiman’s picture

reikiman commented

I had moved my site and forgot to move the files directory. It's there again.

- David Herron - http://7gen.com/

+ David Herron - 7gen.com/, The Long Tail Pipe, davidherron.com/drupal-blogging-hints

andre75’s picture

andre75 commented

Thanks! I appreciate your work.

-------------------------------------------------
http://www.opentravelinfo.com
http://www.aguntherphotography.com