Fresh, elegant, clean, lightweight, simple and a blog like Vanilla theme!
It attempts to bring out the importance in your forum's content while looking as sleek as possible.
Tested and looks good in:
FF 2.0.0.7
IE 7
Safari 3.0
Version History:
1.5 - Updated for Vanilla 1.1.5a
1.4 - Updated for Vanilla 1.1.3, various css updates and fixes.
1.3 - Fix for IE7 gab at the end of the pages.
1.2 - CSS validated with 0 errors and 0 warnings, CSS fixes to accommodate some add-ons (thanks to jimw).
1.1 - Fixed CSS bug (gab between .Discussionoverview and .Topics when discussion overview extension is enabled)
1.0 - First release
Support this theme
Thanks!
Other Requirements (if any):
sjeeps Screenshots: (Updated for Blogger 1.4)


Really really nice. Thank you.
Yeah, I like it. But, why did you choose "Blogger"?
sjeeps @garvin
I couldn't find a better name! 
There seems to be some issues with the discussion overview plugin. You should check it out. There is a huge gap under the category name and the discussions.
There is also a problem when viewing member profiles.
Overall its the best theme on here.
Uploaded version 1.1 of Blogger.
sjeeps @Alslinet
"There seems to be some issues with the discussion overview plugin. You should check it out. There is a huge gap under the category name and the discussions."
Fixed by changing #Discussions float from "none" to "left" and adding a spacer to discussions.php to clear the .PageList
Screenshot: (Updated)
"There is also a problem when viewing member profiles."
This's my screenshot: (Updated)
And I don't see anything wrong with it, could you show me a screenshot for your site?
Uploaded version 1.1 of Blogger.
Im running it at a rather high resolution so you might not be able to see it as clear. It looks kinda squished into the side. Just thought i would mention it while i was leaving a comment you see.
And thanks for fixing my number one problem.
Great theme. Only thing I'm missing is a little colour. The default theme does a great job of managing a lot of content on a page and making it visually easily digestible. I'm running a blog as a front page of one of my forums, and with that in mind, this works really well, but the discussion page feels like a lot of undifferentiated rows of text. That's not a strong criticism, just some feedback. Good work, and it's great to have an alternative theme for one of my forum's that I'm actually going to use... ;)
Ah. Just figured it out. I think the niggling thing for me is that links aren't differentiated until rollover - or at least there's an inconsistency between links in the discussion list (underlined) and links on the sidepanel (nada, except for the rollover effect).
sjeeps @jsamlarose
"Only thing I'm missing is a little colour"
Well, the main 2 colors I used is just black and white. However, changing a:hover color or .ContentInfo h1 color to whatever you want should take care of that "little colour" you're missing. :)
A new theme (Grace) should be out be out soon with more calming and soft colors, thank you very much for the feedback.
I fixed a couple of things to make the css valid.
I changed all the
to
in the default.php.
In the footer.php file, I added a after the:<p class="Vanilla"><a href="http://www.getvanilla.com" title="Get vanilla!">Vanilla Powered</a>
In the default.php, I changed: // some space<br /> //$Panel->AddString('<br/><br/><br/>', 100); /*jimw - replace with h2 below*/<br />to<br /> $Panel->AddString('<h2>Albums</h2><div id="AlbumList">',100); /*jimw*/<br />
and added the following after the "foreach" code: $Panel->AddString('</div>',100); /*jimw*/
<code></code> is your friend... ;)
sjeeps Thanks jimw, I've been trying to upload a new source file for 2 days with some CSS fixes and the missing "</p>" in the foot.php file but guess what?
I'm having trouble with it again (I'm using 7-zip) and i get this:
"You are not allowed to upload (Blogger.zip) the requested file type: application/force-download"
Any idea?! :)
I've also had this problem with both 7-zip and WinRAR. I guess something's changed in either the newer versions of these utilities and/or the config of the addons site. Sure is annoying though.
<assumption>Have you tried creating a ZIP file using the built in Windows zip creation?</assumption>
I found a few more things I updated in the vanilla.css file for the "update checking" facility in Vanilla. There is an image that is used to show it is checking and then the add-on info is colored if okay or not. Here it is:/* Update Check form */<br />/* remove jimw for new Update stuff in Vanilla 1.1.2<br /><a href="/search?Search=%23Form">#Form</a>.UpdateCheck p.Description {<br /> padding: 0px !important;<br /> margin: 0px 0px 10px 0px !important;<br /> }<br />*/<br />/* Update Check form add jimw for Vanilla 1.1.2 */<br />.UpdateOld .Name,<br />.UpdateGood .Name,<br />.UpdateUnknown .Name,<br />.UpdateChecking .Name {<br /> padding: 0px 0px 4px 23px !important;<br /> }<br />.UpdateOld .Details,<br />.UpdateGood .Details,<br />.UpdateUnknown .Details,<br />.UpdateChecking .Details {<br /> font-weight: normal;<br /> }<br />.UpdateOld,<br />.UpdateUnknown {<br /> background: <a href="/search?Search=%23FFFFCC">#FFFFCC</a>;<br /> }<br />.UpdateGood {<br /> background: <a href="/search?Search=%23FFFB97">#FFFB97</a>;<br /> }<br />.UpdateChecking {<br /> background: <a href="/search?Search=%23FFFEEC">#FFFEEC</a>;<br /> }<br />.UpdateOld .Name {<br /> background: url(ico.alert.gif) no-repeat top left;<br />}<br />.UpdateGood .Name {<br /> background: url(ico.check.gif) no-repeat top left;<br />}<br />.UpdateUnknown .Name {<br /> background: url(ico.unknown.gif) no-repeat top left;<br />}<br />.UpdateChecking .Name {<br /> background: url(progress.gif) no-repeat center left;<br />}<br />
sjeeps @[Stash-]
"Have you tried creating a ZIP file using the built in Windows zip creation?"
Yep, and it didn't work either!
Must be an addon site/browser problem in that case then...? Mark?
I found a conflict with the date display and the CategoryIcons add-on. I have a fix for it in the CategoryIcons style.css file:<br /><a href="/search?Search=%23Discussions">#Discussions</a> li ul{<br /> padding-left:2px; /*was 65 and moved from below where it was included with the Category items*/<br /> /*jimw was 15 - changed for Blogger theme*/<br />}<br /><br />/*Image overlap fix*/<br /><a href="/search?Search=%23Discussions">#Discussions</a> li li {<br /> height:20px; /*jimw was 40 - changed for Blogger theme*/<br />}<br />/**********************/<br /><br />.Discussion{<br />position:relative;<br />}<br /><br />.DiscussionCategory {<br />/*width:60px !important;*/ /*jimw - removed for Blogger theme*/<br />/*height:60px !important;*/ /*jimw - removed for Blogger theme*/<br />/*padding:0; margin:0;*/ /*jimw - removed for Blogger theme*/<br />text-indent:-9999px; /*moves the Category name off the page*/<br />position:absolute; top:4px; right:2px; /*change to right if you want the image to the right*/<br />}<br />
I also noticed that the Bling add-on didn't show. I found that the AboutVanilla css was removed. I guess so that it could be put in the footer. In any case, If you want it back, just remove:<br /><a href="/search?Search=%23AboutVanilla">#AboutVanilla</a> {<br /> display: none;<br /> }<br />.floatLeft {<br /> float: left;<br />}<br />
and replace with:<br /><a href="/search?Search=%23AboutVanilla">#AboutVanilla</a> {<br /> margin: 20px 0px 20px 0px !important;<br /> border-top:1px solid <a href="/search?Search=%23ccc">#ccc</a>;<br /> background-color:#f9f9f9;<br /> padding: 3px 0px 3px 0px;<br /> text-align:center;<br /> color:#bbb !important;<br /> width:180px;<br /> }<br /><a href="/search?Search=%23AboutVanilla">#AboutVanilla</a> a {<br /> color:#d0d0d0 !important;<br /> text-decoration:none;<br /> }<br /><a href="/search?Search=%23AboutVanilla">#AboutVanilla</a> a:hover {<br /> color:#aaa !important;<br /> text-decoration:underline;<br /> }<br />
Uploaded version 1.2 of Blogger.
sjeeps CSS file is now valid with 0 errors and 0 warnings :)
1.2 - CSS fixes to accommodate some add-ons (thanks to jimw).
hi :)
i am not an experienced user.
i copied the directory into the themes directory,
i then went on the settings menu and changed to Blogger, saved,
and here's what I got:
(partial) printscreen here:
http://mega.ist.utl.pt/~sdsa/vanillaps/ps.JPG
any help?
sjeeps Did you check this box?![]()
no. i'll do that now though, see what happens.
why did it just work?!
also, after switching, the box got unchecked.
"saving" again leaves it as is.
changing back to the default one requires the same trick.
Uploaded version 1.3 of Blogger.
sjeeps, just in case you were wondering I successfully uploaded an extension in ZIP format using the 4.52 beta of 7zip.
sjeeps [-Stash-], I found out this morning that uploading a zip to the add-ons site using IE works fine BUT not with FF!!
This is bloody peculiar, especially since I uploaded my ZIP with fx2...
Please excuse my n00bishness! If I wanted to update this so that the [X new] items link showed up as red if x>0, what might I have to do?
Thanks in advance for anyone that can point me in the right direction...
sjeeps Just add this line to vanilla.css:#Discussions .Topics .DiscussionNew a {color: red;}
You can change the color to anything you want.
Thanks sjeeps - but that just chances that bit of text to red, regardless of whether there are new discussions or not. I'm trying to work it out so that the [x new] block will stand out particularly when there are new items - working along the same methodology as distinguishing the display of a discussion with NoNewComments, and one with NewComments. The red helps, but if all of the "new" text is red, there's not enough of a difference - the eye doesn't instantly skip to those discussions with new comments. I guess I could write something to hide the [x new] block if $new_items=0 - but I wouldn't know what variable to attend to, or where to put it, and I'm sure there's a more elegant way of doing it...
Found it.
Pasted the following into vanilla.css:
.NewComments .DiscussionNew a {
color:#c00 !important;
}
Does exactly what I was looking for.
Hi. I implemented Blogger at Iateapie.net and it works great except for the IE7 bug where there is a huge gap at the top of the content and I am using the latest version. Could you let us know what the fix was, so I could check my templates - not sure if it could be because I also made it fix width.
sjeeps @tanyat
In your modified vanilla.css file change this:#Content <a href="/search?Search=%23title">#title</a> {<br /> background: transparent url('vanilla.gif') no-repeat 0 34px;<br /> width: 90%; /* edited from 60% */<br /> font: 400 30px/38px Georgia, "Times New Roman", Times, serif;<br /> margin: 0;<br /> padding: 30px 0 20px 70px;<br />}<br />
To:<br /><a href="/search?Search=%23Content">#Content</a> <a href="/search?Search=%23title">#title</a> {<br /> background: transparent url('vanilla.gif') no-repeat 0 34px;<br /> width: 80%; /* edited from 60% */<br /> font: 400 30px/38px Georgia, "Times New Roman", Times, serif;<br /> margin: 0;<br /> padding: 30px 0 20px 70px;<br />}<br />
You need the #Content #title width to be no more than 80% or 500px.
I'll release Blogger 1.4 soon with some nice modifications.
Thanks so much sjeeps - I had #Content #title set to 90% and changing it to 80% did the trick.
I know absolutely nothing about coding and such but since you are already working on another version of this great theme - I'll add my little discoveries. I changed #Container to a set width (850px) to get a fixed width center aligned layout and changed the search settings as described in another part of the forum to fix that page.
Things that happened (probably because of this change). If the text of the discussion title (on the comments page) is very long, it doesn't continue on another line - it just gets cut off by the "bottom of the page" text which is on the right.
On the discussions page, if the discussion title is long, it shifts to below the date instead of being beside it with the text continuing on another line.
I look forward to seeing the next version - and thanks again!!
sjeeps Ok, I'll get that fixed.
Thanks
Version number changed from 1.3 to 1.4.
Uploaded version 1.4 of Blogger.
sjeeps New in 1.4:
- Added the index url to the forum's title.
- More stylish comments page.
- Added discussion title to the discussion link.
- Some new graphics.
- major fixes to display the theme properly in IE7.
- Better and friendlier font.
Requires Vanilla 1.1.3
I LOVE this theme. Great job!
Just one thing tho, I have the page default set to categories, but once I installed this theme it reverted back to the default page of discussions. I have changed hte settings but i have had no sucess. Can anyone help me out with this? Thanks!
sjeeps @erryl
This has nothing to do with the theme...
"It is not possible to use a 'friendly url' for the default page, please use a 'dynamic url' instead:"
All you have to do is just go to Default Page Settings and set your default page to just categories.php, it works fro me.
Thanks!
Thanks!! Sorry about my new-ness!!
sjeeps,
Is there any way to get a timestamp on the front page, like the old Vanilla?
Truthmaster
Ah, I fixed it. added the line back into the discussion.php file. Exactly what I needed. Thanks anyways and feel free to add to 1.5, if you want. :-) It's Mark's code anyways. haha. I can send you the php file.
Truthmaster.
One more question. I would like to change the color of the mouseover in the Header from that green to another color that matches my logo better. Love the colors, just want to make it match more. I have bben thru all the things I know to look at.
Can yhou direct me tothe correct file to edit the color? THANK YOU!
I know I'll feel really dumb when you tell me, but I have spent so long already. Thanks so much.
:) I'm still hunting. Not trying to be a pain but I am so frustrated with myself. Any direction you guys can help with is so appreciated!! :)
I think the line you want to change is:#Nav ul li a:hover, <a href="/search?Search=%23Nav">#Nav</a> ul li.TabOn a {background: url('nav-arrow.gif') no-repeat center bottom;color: <a href="/search?Search=%23FDCCFF">#FDCCFF</a>;} /*jimw <a href="/search?Search=%2369AE1D">#69AE1D</a>*/<br />
This changes it from green to pink.
Addons are custom features that you can add to your Vanilla forum. Addons are created by our community of developers and people like you!
We review addons to make sure they are safe and don't cause bugs. An addon is considered to be "Vanilla Approved" once our review process is complete.