Fervens Drupal theme

Fervens Drupal theme

Fervens is my fourth Drupal theme at Drupal.org. 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 :)

For the original Wordpress theme, visit here.

The Fervens Theme is released under Creative Commons - Attribution-Share Alike 3.0 license. This means that you may use it for your personal and commercial projects and you may also make any changes, just try to keep the credits in the footer :-) Appreciate that! Please link to this article if you want to spread the word. You may modify the theme as you wish or contact me for paid customisations.

Features

  • Choose between fixed or liquid width (theme settings).
  • Choose between 3 column types and positioning (theme settings).
  • CSS3 rounded corners on selected block regions.
  • Style for Superfish dropdown menus.
  • Right-to-left (RTL) support (TODO).
  • Completely CSS based, tableless design.
  • Uses 960 grid system (both fixed and liquid layout).

Live demo

Note that this theme has been removed from Drupal.org due to licensing restrictions. However, you may still use it and download from my website here. Please drop me a comment below for bug reporting and to receive future update notifications.

Thanks for your support!

132 comments for 'Fervens Drupal theme'

Larry's picture

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

Larry's picture

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

admin's picture

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

stan winchester's picture

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

oomkoen.nl's picture

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.

oomkoen.nl's picture

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

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

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

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

Anonymous's picture

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! :)

Abhishek Singh's picture

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

gabriele's picture

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

Marko.B's picture

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

Marko.B's picture

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 :-)

toneddu2000's picture

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

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.

toneddu2000's picture

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

admin's picture

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.

Royal's picture

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

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.

SuperZambezi's picture

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

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.

crusoe's picture

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

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.

crusoe's picture

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

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.

admin's picture

Hi thanks fr yr support ;)

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

Anonymous's picture

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

Anonymous's picture

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

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?

admin's picture

Yes, of couse :)

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

Thanks fr yr support!

admin's picture

Hi guys,

I have completed rewrite of Fervens for Drupal 6 using 960 grid system, cleaned the codes and styles alot.
Please update your versions, make sure to clear your Drupal caches at admin/settings/performance.

Thanks!

sahar's picture

thank you for your nice theme it helps very much...
I will appreciate your help about how can I add a drop down menu (such as in the demo) just by hovering and Id like to have horizontly in the top of the page.

thank you
sahar

admin's picture

Hi Sahar,

Thanks for using my theme. For the dropdown menu, the feature is already built in with Fervens. Please refer to the Readme.txt file on how to activate the dropdown. You need to set your primary menu links to 'expanded'.

admin's picture

Oh sorry I didnt get you earlier.

Now i understand what you're referring to.

You should place the menus inside Primary Links (created by Drupal default). It will automatically be activated.

abhid90210's picture

Cool theme. Please make a D7 version also.

Thanks,

:D

Jason's picture

Hi.
First I have to say that I love your theme and will be using is shortly for a site redesign.
Just one small issue that I can't seem to get my head around, when using the "content top" region, it is adding the rounded corners like the main content div gets. This ends up leaving little triangle beige bits in each corner.
I hope that is clear. The issue can be viewed at http://beta.lakehillpreschool.org , check out the corners surrounding the 2 picture slide show.
Let me know if you need any other details. Any help would be appreciated.

Cheers,
Jason

admin's picture

Hi Jason,

Thanks for using my theme :)

I just noticed the issue with content top mentioned by you to be honest. The colour is too light, can't really see the difference easily.
Anyhow, I'll fix this issue asap and post the update here.

Jason's picture

Hi
No problem!
Thanks for replying so quickly. I look forward to an update.

Cheers,
Jason

Jim Wurster's picture

Hi,

I really like your theme, but am getting a js snapfish error:

Error: $("#primary ul.menu").superfish is not a function
Source File: http://jwurster.us/themes/fervens/script.js?I
Line: 24

Can you please advise how to fix this? From looking at other comments, perhaps it is because I'm not using the primary link menu in the header.

Thank you, jim

Sanjay's picture

Hi,

Thanks for the great theme...I was wondering whether you were planning to port Fervens to Drupal 7 -- I really want to upgrade from Drupal 6, but I cannot do so if the theme doesn't support Drupal 7.

Thanks,
Sanjay

andypost's picture

A half of year passed and there's no public repo for theme's code (I know about different licensing)

I think having code on github could help this theme grow

Mike's picture

Can you please tell us when the fervens-theme will be available for Drupal 7?

We are all waiting (un)patiently ;-)

admin's picture

Sorry for the late reply Mike!

Been really busy lately. I will roll out Agregado and Fervens for Drupal 7 by August (next month).

Do check back here or subscribe to my feed to get updates.
Thank you!

admin's picture

Hahaha!!
Coming soon! Give me a few more days.
Been busy at work :(

David Giard's picture

Hi, i had nothing to do, so i ported fervens to drupal 7, didn't know at the time if you where working on it or not. Anyway, Here is what i have so far. I probably forgot a few things and the only test i did was to check if the front page load correctly. But here it is:
http://launchpad.net/drupal-theme-fervens/fervens-7.x-3.0-dev/fervens-7....
If you want to help or submit bugs there is the url: https://launchpad.net/drupal-theme-fervens/

admin's picture

Hey David,

Nice work there, I'm actually really in the midst of converting to Drupal 7 with my small free time.
I've done Fervens A (but part B and C is still undone).

I've simplify quite a few things (they are no longer in your version of Fervens D7).

Anyway, great to see that you're taking the initiative to help out!
I'll try to complete all 3 parts and see how we'll work it out to merge it.

admin's picture

The official port of Fervens for Drupal 7 is out.

Please download and test =)
Post your comment here if you have any issue or wanna say simple "Hi" or thanks.

admin's picture

Ooops sorry guys, please re-download the 7.x-1.0 version. Forgotten to include the maintenance page.

admin's picture

Oh my, very sorry about that!

The folder name should be "kt_fervens" (in order to separate between Drupal.org's Fervens).

Please re-download the file kt_fervens-7.x-1.0.zip from above.

Itzhak's picture

Hi,
Thank you for a very nice theme. simple and good.
1. I'm using it with some RTL Languages, but when the site is flipping to hebrew, the site Columns are not flipping to the right - they should be rearrange from right to left - D6 version used to have that issue as well.

2. also, logo and slogen are not aligned to the right.

3. D7 theme update is still unable to locate the info file - i had to install it manualy

Thank you very much for your help!

admin's picture

Hello Itzhak, thanks for using Fervens for Drupal 7!

Yes RTL language is still pending for D7 (i've marked in my post above with "TODO" tag).

I'll come out with an RTL and new free theme pretty soon. Sorry! =(

Fasl Mannings's picture

I love this theme, simple, clean, easy to use and it reminds me of my jojoba oil plantation I owned when I was a kid. But I can't use it on Drupal 7, gives me an error! Please fix it!

litwol's picture

I enjoy this theme. thank you for making it. but i can't help but wonder: Why do you manage code here via zip files? Why is it not tracked in a revisioning system? if you don't want to use drupal.org's code revisioning then at least you can sign up for free http://github.com project account. Keeping this theme in a public revisionins system will help trust future development of this theme and make it easier for users to invest their sites into this theme and use it. Please consider putting your code into git somewhere. thanks.

admin's picture

Hey thanks Litwol.

This theme wasnt allowed to be hosted in Drupal.org because of licensing issues with the original design.
Therefore had to do it here. I haven't thought of using Git to manage though.

Will push my codes there later today and update.

Thanks!

admin's picture

Superb! :P

Thanks for support!

borort's picture

Hi, I am appreciated with your theme, esp. for D7.
By the way, I am still facing one problem: the textarea (body, comment) doesn't support Wysiwyg CKeditor. I am not sure what cause the problem.

admin's picture

Hmm it does supports any rich text editor.

You need to set it to use the editor's default CSS file (and not the theme).

Goto admin/config/content/wysiwyg/profile//edit
under CSS group, edit 'Editor CSS' to use editor default style.

admin's picture

Do you have Firebug enabled?
What errors do you see? Can you screenshot the problem too please?
Nobody reported this before nor I've experience, something new :O

borort's picture

The follow error when I click on Edit tab of any contents:

jQuery is not defined
wysiwyg.js?lteuaw (line 237)
})(jQuery);

admin's picture

Ok that seems like a conflict with another plugin or something. A quick way to examine is to switch to Bartik (default theme) and see if you still have that error.

Otherwise you may need to file an issue at WYSIWYG module page.

Pages