Fervens Drupal theme

Fervens Drupal theme

This theme was designed by Design Disease and brought to you by Smashing Magazine.

This theme features a 3 column layout that has a base idea of "freshness". Summer is my favorite time of year as it always amazes us with a rainbow of sensation and colors, making this time of year the best of all. The green of the plants and trees, the blue of the water….I love this time of year :)

Features

  • Supports all default Drupal theme features; Logo, site name, slogan, mission, node user pictures, comment user pictures, search box, favicon, primary links, and secondary links.
  • Choose between the best of both worlds; fixed or liquid width (theme settings).
  • Choose between 3 column types and positioning (theme settings).
  • 9 available block regions optimised for advertisement placements.
  • Nifty rounded corners on selected block regions.
  • Integrated Superfish dropdown menus (primary links).
  • Right-to-left (RTL) support.
  • Completely CSS based, tableless design.
  • Validates XHTML 1.0 Strict and CSS 2.1.
  • Compatible and tested with all major web browsers; Firefox 3, Firefox 2, IE8, IE7, IE6, Google Chrome, Safari, Opera.
  • Supports IE6 and below with the help of Whatever:hover script and IE PNG Fix.

Download

Live demo

47 comments

Anonymous's picture
Larry
Wed, 13/01/2010 - 09:32

I Love it... i'll buy you a

I Love it... i'll buy you a coffee if you can point me in the direction of how to add 1) shaded boxes & 2) coloured blocks (as per your demo site)

thanks,
Larry

admin's picture
Wed, 13/01/2010 - 13:54

Hello Larry, I would

Hello Larry,

I would appreciate that if you buy me a cup of coffee :)

But what do you mean by the shaded boxes and coloured boxes?

What you see on my demo site http://demo.kahthong.com/?theme=fervens is what you get from http://drupal.org/project/fervens (version 2.2)

Anonymous's picture
Anonymous
Wed, 13/01/2010 - 15:41

colored blocks for

colored blocks for instance...as per your demo! or boxes with different shades on them.. ie. different colors

admin's picture
Wed, 13/01/2010 - 18:20

Well the blocks automatically

Well the blocks automatically inherits the colours.

For example, the sidebar right's first block gets dark green, second block will be lighter green, and etc.

As for the sidebar left, only the first block gets black, and the rest will be light grey.

I hope I have cleared your doubts? :O

Anonymous's picture
James Bradley
Mon, 01/02/2010 - 01:06

Thank you for the great theme

Thank you for the great theme ;)
I like the colors combo!

Anonymous's picture
Tue, 16/02/2010 - 01:43

more options

I agree good design. However are there any optiosn for inserting graphics onto the master template?

admin's picture
Tue, 16/02/2010 - 08:08

Hello stan, Thanks for using

Hello stan,

Thanks for using Fervens!
Regarding your question, do you mean like inserting graphics onto the header (background) or something?
You can file a feature request by following this link http://drupal.org/node/add/project-issue/fervens

Anonymous's picture
Wed, 10/03/2010 - 03:45

Website width

Wauw, first off all, this is a really nice theme. Simple and colourful makes it nice and fresh.

A question:
In the configuration you can choose between: Fixed width (940 pixels wide) or Liquid width (Maximum 1280 pixels wide.
In what, and where CSS file can i edit the width settings by custom?
Fixed, looks good, but makes my content layout a bit small. Liquid is also nice, but the wider the screen, the wider the left and right columns will get.

I want to experiment with some widths.

Anonymous's picture
Wed, 10/03/2010 - 07:46

Found it

Its in style.css.
The comments in this piece of css are from me. :)

/* 
* With admin/build/themes/settings/fervens choose from 3 options:
* Fervens A (Sidebar left, content, sidebar right)
* Fervens B (Sidebar left, sidebar right, content
* Fervens C (Content, sidebar left, sidebar right 
*/

/*
* left-and-right: 3 columns, left, middle and right
* left: 2 columns, left and middle
* right: 2 columns, middle and right
*/

/* First choice Fervens A */
/* With 3 columns are left and middle together 70%, right is 30%*/
body.fervens-a-sidebar-left-and-right #sidebar-left-and-main {
  float: left;
  width: 70%;
}

/* Left is always 25%. Example, with 2 columns, left and middle is left 25% and middle 75%. With 3 columns are left 25% and middle 75% within the 70% of left-and-main. A formula would be (left + middle) + right. */
body.fervens-a-sidebar-left-and-right #sidebar-left {
  float: left;
  width: 25%;
}

/* Middle is always 25%. Example, with 2 columns, left and middle is left 25% and middle 75%. With 3 columns are left 25% and middle 75% within the 70% of left-and-main. A formula would be (left + middle) + right. */
body.fervens-a-sidebar-left-and-right #main {
  float: right;
  width: 74.9%;
}
body.fervens-a-sidebar-left-and-right #main-inner {
  padding: 0 10px;
}

/* Right is always 30%*/
body.fervens-a-sidebar-left-and-right #sidebar-right {
  float: right;
  width: 30%;
}
body.fervens-a-sidebar-left #sidebar-left {
  float: left;
  width: 25%;
}
body.fervens-a-sidebar-left #main {
  float: right;
  width: 74.9%;
}
body.fervens-a-sidebar-left #main-inner {
  padding-left: 10px;
}
body.fervens-a-sidebar-right #sidebar-left-and-main {
  float: left;
  width: 77%; /*70%*/
}
body.fervens-a-sidebar-right #main-inner {
  padding-right: 10px;
}
body.fervens-a-sidebar-right #sidebar-right {
  float: right;
  width: 23%; /*30%*/
}

/* */
body.fervens-b-sidebar-left-and-right #sidebar-left-and-right {
  float: left;
  width: 50%;
}
body.fervens-b-sidebar-left-and-right #sidebar-left {
  float: left;
  width: 35%;
}
body.fervens-b-sidebar-left-and-right #sidebar-left-inner {
  padding-right: 10px;
}
body.fervens-b-sidebar-left-and-right #sidebar-right {
  float: right;
  width: 64.9%;
}
body.fervens-b-sidebar-left-and-right #main {
  float: right;
  width: 50%;
}
body.fervens-b-sidebar-left-and-right #main-inner {
  padding-left: 10px;
}
body.fervens-b-sidebar-left #sidebar-left-and-right {
  float: left;
  width: 25%;
}
body.fervens-b-sidebar-left #main {
  float: right;
  width: 74.9%;
}
body.fervens-b-sidebar-left #main-inner {
  padding-left: 10px;
}
body.fervens-b-sidebar-right #sidebar-left-and-right {
  float: left;
  width: 30%;
}
body.fervens-b-sidebar-right #main {
  float: right;
  width: 69.9%;
}
body.fervens-b-sidebar-right #main-inner {
  padding-left: 10px;
}
body.fervens-c-sidebar-left-and-right #main-and-sidebar-right {
  float: left;
  width: 85%;
}

/* */
body.fervens-c-sidebar-left-and-right #main {
  float: left;
  width: 69.9%;
}
body.fervens-c-sidebar-left-and-right #main-inner {
  padding-right: 10px;
}
body.fervens-c-sidebar-left-and-right #sidebar-right {
  float: right;
  width: 30%;
}
body.fervens-c-sidebar-left-and-right #sidebar-left {
  float: right;
  width: 15%;
}
body.fervens-c-sidebar-left-and-right #sidebar-left-inner {
  padding-left: 10px;
}
body.fervens-c-sidebar-left #main-and-sidebar-right {
  float: left;
  width: 85%;
}
body.fervens-c-sidebar-left #main {
  padding-right: 10px;
}
body.fervens-c-sidebar-left #sidebar-left {
  float: right;
  width: 15%;
}
body.fervens-c-sidebar-right #main {
  float: left;
  width: 74.9%;
}
body.fervens-c-sidebar-right #main-inner {
  padding-right: 10px;
}
body.fervens-c-sidebar-right #sidebar-right {
  float: right;
  width: 25%;
}

admin's picture
Wed, 10/03/2010 - 08:13

Haha.. Glad that you found

Haha.. Glad that you found your way. I was gonna reply this.
I will be adding more comments in my themes when I have free time.

Anonymous's picture
Anonymous
Fri, 19/03/2010 - 16:40

RTL support

Hi,

I've added an RTL language and all seems OK with the logo switching properly to the right (I added some code to the header template.php to do this). The RTL page direction is OK for text and H1 etc. However, I can't get the primary menus to start on the right.

I am also interested in switching the layout of the A, content, B etc to be RTL. Cany you help me with an easy way to do this? I see that the #primary is defined as float right but it's not getting picked up. For some reason I don't see that the -rtl style sheet is getting picked up or I could just redefine things there. Any ideas?

Thanks so much!

admin's picture
Fri, 19/03/2010 - 16:46

Hello there, I understand the

Hello there,

I understand the problem. I'm working on a new fix for Fervens (along with other bugs).
Hopefully this will be addressed as well :)

Give me about 2-3 days for the new patch.

Thanks,
Adam Leow

Anonymous's picture
Anonymous
Fri, 19/03/2010 - 16:52

1st solution found

OK... silly me, have a bad case of pre-morning coffee stupids!

I added #primary { float: right; } to the style-rtl.css and all is great now!

Will attempt to adjust the other things also now! :)

Anonymous's picture
Fri, 02/04/2010 - 15:41

Great Design

It is indeed a great design. I love it and look forward for enhancements to this theme. Thanks a lot.

Anonymous's picture
Drupalist
Sun, 04/04/2010 - 21:49

Thanks for the wonderful

Thanks for the wonderful theme too! Great job and hope to see more..

Anonymous's picture
Sat, 10/04/2010 - 05:54

thanks for your work

Well, thanks a lot. We have chosen the fervens theme for our drupal site. Thanks also to the creator of the theme.

Best regards, Gabriele

Anonymous's picture
Thu, 15/04/2010 - 22:31

why 940

Just to ask, why is width 940 and not usuall 960 ?

admin's picture
Thu, 15/04/2010 - 22:57

I'm referring to this

I'm referring to this http://960.gs/demo.html

Actual 'viewing' area is only 940px. Correct me if I'm wrong.

Thank you!

Anonymous's picture
Thu, 15/04/2010 - 23:08

hmm

Not sure, but fusion(drupal) uses 960px also.
Looks to me like its 940pixels with 10 pixel padding for each side so it comes to 940 but main element is 960px width, and that you made main element 940px if i am not mistaking so its than smaller :-)

admin's picture
Fri, 16/04/2010 - 09:16

You are right, I'm missing an

You are right, I'm missing an additional 10px gutter on each side.
Could you please create an issue at http://drupal.org/node/add/project-issue/fervens ?

Thanks :)

Anonymous's picture
toneddu2000
Fri, 16/04/2010 - 18:13

Different regions theming

Thx a lot for this great theme! I'm using as isnpiration for a them I'm working on. There's just a thing I didn't understand: how can I theming right region different than the left one? In tour theme right region uses different colors and nifty corners are nested above each others, in the left one, instead colors are different and nitfy too? How can achieve that result? Thanks in advance

admin's picture
Tue, 20/04/2010 - 08:35

I'm sorry toneddu2000 but I

I'm sorry toneddu2000 but I don't get your picture yet. What are you trying to edit in Fervens theme?

FYI, the design is based on original version for WordPress.

Anonymous's picture
toneddu2000
Mon, 26/04/2010 - 19:55

No, thanks I did it! I tried

No, thanks I did it! I tried to understand how left blocks were different in style than the right ones, but finally I got that was a css rule!Thanks

Anonymous's picture
Chris
Mon, 10/05/2010 - 02:01

CSS problems

Hello -

I just installed your theme on a fresh install of drupal 6.16 and have noticed these 2 css problems below. Any idea on how to resolve this?

Thanks :)
Chris

http://imgur.com/tuBxs.jpg

http://imgur.com/CUll1.jpg

admin's picture
Mon, 10/05/2010 - 12:37

Hello Chris, Thanks fr using

Hello Chris,

Thanks fr using my theme!

The problem you had above is because the default blocks are automatically assigned to the first block region of Fervens. (The header)

All you need to do is goto "admin/build/blocks" and assign those blocks to either sidebar. That should solve your problem.

- Leow

Anonymous's picture
Chris
Tue, 11/05/2010 - 07:27

Thanks! sorry for bothering

Thanks! sorry for bothering you about simple drupal knowledge :P

Chris

admin's picture
Tue, 11/05/2010 - 13:12

No problem, happy to help you

No problem, happy to help you :)

Everyone was once a newbie, including me.

Anonymous's picture
Wed, 26/05/2010 - 06:45

Great template

Thank you for this great template.

If my website succeeds in getting views your theme will be used world wide! :D

My website is about the new Mobile Kin phone.

But again, great template. Worked fine for me.

admin's picture
Wed, 26/05/2010 - 08:43

You are welcome Royal, all

You are welcome Royal, all the best with your site with my theme :)

admin's picture
Sat, 05/06/2010 - 15:02

Fervens has been removed from

Fervens has been removed from Drupal.org due to issues with licenses (GPL and CC).

However, you may now download directly from my website here.

Please see the link under Download section above.

Anonymous's picture
Mon, 07/06/2010 - 15:22

Great Theme

I was looking everywhere for another theme to use and I couldn;t find one better than this. :) My only concern is the green blocks on the right are quite big in width and I was wondering if there was a way to make them smaller and the body bigger.

Thanks for the great theme and any help. :)

Anonymous's picture
Mon, 07/06/2010 - 15:23

Great Theme

I was looking everywhere for another theme to use and I couldn;t find one better than this. :) My only concern is the green blocks on the right are quite big in width and I was wondering if there was a way to make them smaller and the body bigger.

Thanks for the great theme and any help. :)

admin's picture
Mon, 07/06/2010 - 18:50

Sure, edit style.css, look

Sure, edit style.css, look for #sidebar-right
From there you can edit the percentage of width it should occupy. Reduce it to your liking, but make sure to increase back on the #main part.

Anonymous's picture
crusoe
Wed, 09/06/2010 - 23:42

How do I get the right bar to appear?

Complete Drupal newb here. Currently, the right side bar isn't showing up. How do I enable it? Awesome theme btw!

Anonymous's picture
crusoe
Thu, 10/06/2010 - 04:35

I also have the same question

I also have the same question as SuperZambezi. I've looked through the style.css and there are numerous instances of #sidebar-right

body.fervens-b-sidebar-left-and-right #sidebar-right {
float: right;
width: 64.9%;

body.fervens-b-sidebar-right #sidebar-left-and-right {
float: left;
width: 30%;

body.fervens-c-sidebar-left #main-and-sidebar-right {
float: left;
width: 85%;

body.fervens-c-sidebar-right #sidebar-right {
float: right;
width: 25%;

You get the idea. Any help would be great!

admin's picture
Thu, 10/06/2010 - 10:42

If your sidebar isn't

If your sidebar isn't enabled, you should goto admin/build/blocks and place some blocks into the sidebar region.

Regarding the widths, depending on which Fervens type you're using (A, B, or C), you'll adjust the width accordingly. Example for Fervens C would be..

body.fervens-c-sidebar-left-and-right #main-and-sidebar-right {
  width: 85%;    /* 85 + 15 = 100% */
}
body.fervens-c-sidebar-left-and-right #main {
  width: 69.9%;    /* 69.9 + 30 = ~100% */
}
body.fervens-c-sidebar-left-and-right #sidebar-right {
  width: 30%;
}
body.fervens-c-sidebar-left-and-right #sidebar-left {
  width: 15%;
}
body.fervens-c-sidebar-left #main-and-sidebar-right {
  width: 85%;    /* 85 + 15 = 100% */
}
body.fervens-c-sidebar-left #sidebar-left {
  width: 15%;
}
body.fervens-c-sidebar-right #main {
  width: 74.9%;    /* 74.9 + 25 = ~100% */
}
body.fervens-c-sidebar-right #sidebar-right {
  width: 25%;
}

Place the above code into style-custom.css

Change the corresponding widths (see comments in CSS code above). Make sure they tally and equals ~100%.

The reason I use X.9% and not absolute value is for IE6 bug fix.

Anonymous's picture
crusoe
Fri, 11/06/2010 - 04:12

Thanks for the tip, it worked

Thanks for the tip, it worked perfect! I've got another question. The right hand sidebar. Lets say I wanted to swap out Recent Comments for a News Aggregator, how would I go about doing that?

admin's picture
Fri, 11/06/2010 - 08:48

That is not theme related

That is not theme related issue.
Just goto the admin/build/blocks (Site building > Blocks) and manage your blocks.
Drag and drop the blocks to your preferred region. Thats it.

Anonymous's picture
Wed, 16/06/2010 - 20:57

Subscribe

Love Fervens. :) Anyway just commenting to get updates due to Drupal removal.

admin's picture
Wed, 16/06/2010 - 21:03

Hi thanks fr yr support ;) It

Hi thanks fr yr support ;)

It was unfortunate that the license doesn't allow the theme to be GPL-ed.

Anonymous's picture
Anonymous
Thu, 08/07/2010 - 07:53

I feel sad theme has been

I feel sad theme has been removed from drupal... will we get any more updates of this theme please?

admin's picture
Thu, 08/07/2010 - 09:27

Yes sir, the theme will still

Yes sir, the theme will still get updates here. No worries :)

Anonymous's picture
Thu, 26/08/2010 - 04:26

WYSIWYG

Hello there,

My entire visual editor disappeared two weeks ago and I am at a loss as to what happened. I use Fervens. The visual editor is still on the boxes but not the main content sections.

It this by any chance a known Fervens bug and if so, is there a fix?

Thanks!

Anonymous's picture
Thu, 26/08/2010 - 04:27

WYSIWYG

Hello there,

My entire visual editor disappeared two weeks ago and I am at a loss as to what happened. I use Fervens. The visual editor is still on the boxes but not the main content sections.

It this by any chance a known Fervens bug and if so, is there a fix?

Thanks!

admin's picture
Thu, 26/08/2010 - 07:37

What do you mean by Visual

What do you mean by Visual Editor? Are you using CKEditor or TinyMCE?

There were no updates on Fervens, it is very unlikely it would cause your site to break.

Can you send me the link to your site so I can inspect?

Anonymous's picture
Anonymous
Sat, 28/08/2010 - 06:28

Do you intend to make version

Do you intend to make version for drupal 7 ?

admin's picture
Sat, 28/08/2010 - 08:23

Yes, of couse :) I already

Yes, of couse :)

I already have plans for Drupal 7. Very soon!
Will keep this page updated.

Thanks fr yr support!

Post new comment

The content of this field is kept private and will not be shown publicly. If you have a Gravatar account, used to display your avatar.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <code> <pre> <ul> <ol> <li>
  • Lines and paragraphs break automatically.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • Each email address will be obfuscated in a human readable fashion or (if JavaScript is enabled) replaced with a spamproof clickable link.
  • Syntax highlight code surrounded by the {syntaxhighlighter OPTIONS}...{/syntaxhighlighter} tags.

More information about formatting options

Mollom CAPTCHA (play audio CAPTCHA)
Type the characters you see in the picture above; if you can't read them, submit the form and a new image will be generated. Not case sensitive.