This guest post was written by Jean-Baptiste Jung, who maintains a blog (written in French) that covers WordPress. If you have webmaster or WordPress knowledge and are interested in writing a post for Hack WordPress, please contact us.

Inspired by the well-known Mimbo theme by Darren Hoyt, OpenBook is a free Magazine style Wordpress theme, which doesn’t require you to manually edit a file.

I first realeased this theme in January, but at this time it was only available in French. So it is the very first English version.

OpenBook Wordpress magazine theme

Download OpenBook

Download OpenBook 2.2 Wordpress Theme: zip archive

If you’re looking for a live demo, check out my personnal blog which uses this theme.

OpenBook Features

Here’s what you can expect in OpenBook theme:

  • Magazine-style homepage, including 2 columns and SmoothGallery for your featured posts.
  • 100% Gravatar compatible.
  • Custom fields to insert images on the homepage gallery, on homepage posts and in categories posts.
  • Magazine-style dropdown-menu for your categories.
  • Not manual editing required. After installing the theme, you’ll find an OpenBook tab under Design, where you can set up the options for the theme, including featured posts, featured category, blog logo, number of posts to display on the gallery, categories to display on the blog homepage…
  • If you hate Internet Explorer 6 as I do, you’ll probably be happy: OpenBook have an option which litteraly crash IE6 if checked. If unchecked, IE6 will not crash and people who (still) use it will see your blog just as other users.
  • Compatible with Firefox 2, Firefox 3 beta, Safari, Opera, Internet Explorer 7 and Internet Explorer 6. (OpenBook is also probably compatible with other browsers like Konqueror, I just haven’t tested it myself)
  • Widget-ready sidebar
  • SEO-friendly titles
  • Page templates for Links and Archives
  • Compatible with Wordpress 2.3 to 2.5.1

Installing OpenBook

OpenBook install is like installing any Wordpress theme: Unzip the archive, and upload the openbook22-en directory into the wp-content/themes of your Wordpress install.

Then, go to your WP administration panel, Design » Theme and select OpenBook.

OpenBook Wordpress magazine theme

Now, you should go to Design » OpenBook and fill the various fields:

  • Your blog logo url
  • ID of your featured category
  • Number of posts to display in SmoothGallery.
  • IDs of categories to display on the homepage.
  • If you want to make any IE6 crash, just check the related checkbox. :D
  • Number of posts to display on the homepage, by category

Configuring SmoothGallery

SmoothGallery is a very pretty mootools script by Jonathan Schemoul which display posts along with big images. In order to configure it, you must create a new category (In this exemple, we’ll call it featured) and report its ID to Design » OpenBook.

When you want to show a particular post in the SmoothGallery, just edit the post and check the featured category. Of course, you can add the post to other categories as well.

Now, you should define an image that will display in SmoothGallery. Juste create a custom field, give it featuredimg as key and your image url as value. Once saved, the post will be displayed in SmoothGallery.

The ideal SmoothGallery image size is 600*250 pixels. You can use different size, but the image will be cropped or will not fill all the available space.

Using custom fields to display images in posts

As I said above, it is possible to assign one or more image(s) to a post. Theses images will be displayed on the homepage, or in categories pages, depending of the custom field used.

Here’s the custom fields keys, and the place where the images will be displayed.

  • featuredimg » The image will be displayed in SmoothGallery (Only if the related post is in the featured category)
  • Image » The image will be displayed along with its related post, on the homepage.
  • catimage » The image will be displayed in category pages. Ideal size is 125*125 pixels.

Please note

The OpenBook theme is (and will stay) 100% free. I also try to always help people who use it as much as I can. The only thing that I’m asking, is that you leave my link on the theme footer. Thanks in advance ;)

Edit on July 3, 2008: I just wrote a simple tutorial for modifying OpenBook color scheme. You can read it here.

Digg This! | Stumble it! | Add to Del.icio.us | | Print This! |

There Are 60 Responses So Far. »

  1. 1 Leland
    Monday, May 19th, 2008 at 7:26 am

    Amazing for a free theme, or even a paid theme (if it was). Seems the bar for free WordPress themes is being set higher and higher. Thanks for sharing.

  2. 2 jbj
    Monday, May 19th, 2008 at 7:30 am

    Hi Leland, and thanks for your compliments.
    In my opinion, a “free” theme must not be a premium theme with less features. OpenBook is free and will stay free, but I really want it to be a quality theme, not a theme you choose because you don’t want to pay for a premium theme :)

  3. 3 Kyle Eslick
    Monday, May 19th, 2008 at 8:19 am

    @ JBJ - I concur. This theme is incredible for a free theme. I think it is definitely of the quality that people would gladly pay for it.

    I’m currently working on figuring out what site I want to use it on. :mrgreen:

  4. 4 skarld
    Monday, May 19th, 2008 at 9:00 am

    Congratulations, great new theme.That’s what I’m talking about! I have downloaded and added it to my collection.

  5. 5 Mat
    Monday, May 19th, 2008 at 11:14 am

    A very nice theme ! I knew already but it is wonderful !

  6. 6 Trisha
    Monday, May 19th, 2008 at 2:04 pm

    This is a really terrific theme - like everyone else I can’t believe it’s free (but very glad that it is)……it’s apparent that a lot of care and thought went into this and I’m impressed - it’s much better than many free ‘magazine’ style themes I’ve seen. I can’t wait to use it! Thank you, thank you, thank you for offering this theme for free.

  7. 7 jbj
    Monday, May 19th, 2008 at 3:54 pm

    Thanks to all of you for your kind comments! I really, really appreciate it! :)

  8. 8 zania
    Tuesday, May 20th, 2008 at 4:16 am

    This is a wonderful theme. I can hardly believe it’s free.
    Thank you so much!

  9. 9 Eric
    Tuesday, May 20th, 2008 at 3:21 pm

    You have just raised the bar. Fantastic! Cheers.

  10. 10 ian
    Tuesday, May 20th, 2008 at 11:11 pm

    Very nicely done..:-) Looks great, and is good to see some excellent WP work still being offered without a premium price..;-)Hope it bring you lots of well deserved kudos.

  11. 11 Marc
    Wednesday, May 21st, 2008 at 5:19 pm

    When viewing a category page, the header seems to be off in IE7.

  12. 12 cuzzy
    Thursday, May 22nd, 2008 at 5:49 pm

    Amazing theme and free. It is slick and stylish. Actually considering using and and going through the pain of changing over.

    thanks for the great work.

  13. 13 Jean-Baptiste Jung
    Saturday, May 24th, 2008 at 2:44 am

    @Marc: That’s possible. I don’t use windows so testing in ie is always a pain for me.
    I think that putting more negative margin-bottom to #shadow should fix the problem.

    @All: Thanks – Or thanks again – for your compliments regarding my work. I really, really appreciate it :)

  14. 14 Josh
    Saturday, May 24th, 2008 at 4:46 am

    You’re a champ… thats a fantastic theme, I was looking for one for my new blog and it suited perfectly.

    Just one question… I added Disqus to my blog and it integrated fine except for one thing… the comment line thing runs through the “comments” title now, anyway to fix that?

    You can see what I mean here:
    http://shippingseven.com/?p=35

  15. 15 PJ
    Saturday, May 24th, 2008 at 7:04 pm

    Loving the option to crash IE6 :)

  16. 16 Jean-Baptiste Jung
    Monday, May 26th, 2008 at 1:13 am

    @josh: Thanks for your compliments :) Solving your problem is easy: instead of just h3, you must do: <h3>&ltspan>TITLE</span></h3> so edit the comments.php and it will be all good ;)

  17. 17 John
    Friday, May 30th, 2008 at 12:11 pm

    A fantastic theme, very well done!

    I have applied it to my site, but the smoothgallery is placed in the center of the screen, not left-justified, and covers up part of the “recent stories” section. Is there any particular reason for this?

    Thanks again for the free theme!

  18. 18 Izz
    Friday, May 30th, 2008 at 11:23 pm

    Hi, thanks for the great theme! I really love it. :) Just wondering why the smoothgallery didn’t work. Any way to fix this? You can try to see it: http://www.animexon.com. Anyway thanks again for making this theme free.

  19. 19 Izz
    Saturday, May 31st, 2008 at 1:09 am

    Hi, no worries. The smoothgallery is working now. Cheers. :)

  20. 20 Jean-Baptiste Jung
    Saturday, May 31st, 2008 at 4:26 am

    Hi John;
    No, it should be placed exactly as it it on my blog. Any link where I can see your problem?

    jbj

  21. 21 ARS
    Tuesday, June 17th, 2008 at 7:44 am

    Thanks for sharing this theme! ;)

  22. 22 steve
    Sunday, June 22nd, 2008 at 6:40 pm

    hey there, I love this theme.. I am having a few minor problems..

    My smooth gallery doesnt seem to load the same as yours?

    Also the image doesnt crop in internet explorer? I am not sure what to do is the link

    http://www.igniteyourministry.com

  23. 23 Mike
    Sunday, June 22nd, 2008 at 10:03 pm

    I love this theme. But I am having a hard time understanding how to configure it. What is the ID? In your example you use numbers to specify the categories for the home page as well as for the featured item. My categories are names like ‘Apple’, ‘iPhone’, and ‘Windows’. What should I be specifying to make these show up? All I see in the bottom section is one category called ‘Uncategorized’. I have tried using numbers and the names above, but this doesn’t seem to make any change.

    Thanks in advance.
    Mike

  24. 24 Atle Grimseid
    Tuesday, June 24th, 2008 at 9:33 pm

    Great theme =) Good job!
    I have the same problem as Marc. In the archive, and when reading a post the header is just crap. Look at this:

    Front (Index)
    http://baredritt.no/images/front.PNG

    Inside a post: (Single)
    http://baredritt.no/images/inside-post.PNG

    I tried to do what you told Marc to do, with absolutely no result =( Any ideas?

    And again.. GREAT THEME! :D

  25. 25 Atle Grimseid
    Tuesday, June 24th, 2008 at 9:52 pm

    Sorry for another comment. This is my last! I was just writing wrong up there. This is correct!

    If you go to ie.css, and change this:

    #nav2{
    margin-bottom:-10px !important; /*ie7*/
    margin-bottom:1px; /*ie6*/
    }

    to this:

    #nav2{
    margin-bottom:0px !important; /*ie7*/
    margin-bottom:1px; /*ie6*/
    }

    the header is just perfect also in IE :)

  26. 26 zets
    Thursday, June 26th, 2008 at 3:28 am

    Hi jbj. Thanks for this theme. I’m already using Mimbo so I just took some of solutions you added to this theme. One of them is Smooth Gallery. But I have a problem and don’t know how you managed to solve it. This is what it is:

    If you visit this page; http://boonika.net/page-example/ using IE7 you’ll notice a strange behavior when going over navigation bar with your mouse. When there’s a lot of content Page resizes to its defined min-height (840px) size. It corrects itself when you go over sidebar links. Same happens with archive.php; http://boonika.net/category/category1/ and all other pages. Can You help?

  27. 27 Kyle Eslick
    Thursday, June 26th, 2008 at 7:32 am

    Hey guys,

    Just FYI - JBJ is on vacation I believe, but I’m sure he’ll do his best to answer your questions upon his return.

    Just wanted you guys to know there may be a small delay in his response.

  28. 28 zets
    Thursday, June 26th, 2008 at 7:57 am

    Huh… better ever than never:)

  29. 29 jbj
    Friday, June 27th, 2008 at 4:20 am

    Hi guys, as Kyle said, I was in vacation, so sorry for the delay in my response :)

    @all: About the Internet Explorer problem with the menu: This will be corrected in the next version of OpenBook, which will be for 1 or 2 weeks. I suggest you to suscribe to this feed so you’ll know when it will be released.
    For now, don’t hesitate to use Atle Grimseid solution which will works fine.

    @zets: weird problem. I never heard about this one, and it’s not easy for me to correct it because I don’t have windows and ie7… I’ll look for it on Monday, when I’ll be able to have a windows machine.

    @Atle Grimseid: Btw, can you provide me a copy of the OpenBook files that you translated in your language? That will be very appreciated.

    @Mike: The ID is the category ID.Kyle wrote a cool post some days ago, and I think you’ll find what you’re looking for there.

  30. 30 Jean-Baptiste Jung
    Friday, June 27th, 2008 at 8:27 am

    By the way, I just found that OpenBook is featured on WPThemez, so don’t hesitate to vote for the theme. You don’t need to register.

    Thanks!

  31. 31 Mauro Borquez
    Saturday, June 28th, 2008 at 10:58 am

    hi! your job is incredible
    i work in found a solution for a problem in ie6 and 7 with the position of the smoothgallery
    my solution is, change this lines in the ie.css
    #myGallery{
    position:relative !important;
    position:absolute; /* ie6 only */
    left: auto !important;
    left:30px;
    }
    the problem is over! i’m happy
    greetings for all

  32. 32 Jean-Baptiste Jung
    Sunday, June 29th, 2008 at 3:16 am

    Hi Mauro and thanks for your contribution. I’m glad to see people getting involved and sharong codes/ideas with me :)
    I just started working on the new OpenBook version, so stay tuned!

  33. 33 Mauro Borquez
    Sunday, June 29th, 2008 at 4:51 pm

    for nothing! if you need help for the next version just tell me
    greetings

  34. 34 zets
    Monday, June 30th, 2008 at 6:08 am

    Hey Mauro (or anyone else), do you know how to solve my problem (look above for my first post)? Thanks in advance.

  35. 35 Mauro Borquez
    Monday, June 30th, 2008 at 7:17 am

    Hi Zets, check the css in the lines where say clearfloat or search hidden
    there is the problem
    sorry for my english jeje

  36. 36 zets
    Monday, June 30th, 2008 at 7:41 am

    Thanks a lot. I’ll check those lines.

  37. 37 Mauro Borquez
    Monday, June 30th, 2008 at 7:48 am

    if you need more help add me in msn messenger (info@emebe.com.ar)
    cheers

  38. 38 JR
    Tuesday, July 8th, 2008 at 1:46 am

    Hey JBJ,

    I absolutely LOVE the theme. Thanks so much for it. I just have one small question. When I place an image on the homepage using the “Image” custom field…the articles on the right column wrap nicely around the image…the images on the left do not for some reason. Any Suggestions? You can see what I mean here:

    http://www.truthmerchants.com

    Thanks again,

    JR

  39. 39 charles
    Monday, July 14th, 2008 at 3:20 am

    very good theme, and free ! Fantastic !
    I love it !!!!!!
    A small question , How to put banners in the Sponsors section ?
    Thank you !

    Charles



Leave A Comment