Cleaker is the Best WordPress Theme You’ve Never Heard Of

…and I selfishly would like to keep it that way for fear of widespread adoption, but author Adam Walker Cleaveland deserves praise and recognition for his fine work. Prior to my search and conversion to Cleaker I was using 3ColumnK2 which is a mod of the ever so popular K2 theme which I still use for other sites. I decided to switch for a few reasons.

  • I was having IE6 compatability issues where the sidebar was wonky and didn’t appear properly
  • didn’t like being at the mercy of the modder to update based on newer K2 releases
  • I started having some issues with the Sidebar Modules embedded in the latest K2 and once again didn’t want to be at the mercy of K2 for SBM upgrades
  • I was bored

My search for Cleaker took a while. My requirements for a new theme were:

  • 3 Column with content on the left followed by 2 sidebars on the right
  • Flexibility to change the overall theme width as well as the columns
  • Support for Widgets (hence Sidebar Modules)
  • Navigation buttons in header based on Pages
  • Ability to have a custom header image
  • Looked good

This was a pretty time consuming process but in the end it was worth it. Cleaker met all of my requirements and then some. The first step was to prepare by porting over all of my existing theme customizations necessary to Cleaker. I’m pretty good about keeping a text file that identifies every customization I make to my theme along with details and the actual code. These items include content from third party services like Google Analytics, code necessary for plugins, scripts for widgets etc. I highly recommend you do this as it can be a nightmare trying to remember where all these pieces are without them being documented. So edited the templates necessary as well as created all the sidebar modules necessary.

After finishing that process I began to concentrate on remaining issues. Currently I’m having layout problems I haven’t gotten around to with my Slickr plugin which I use for my photos page as well as with my Lifestream plugin for my Lifestream page. I’ve been too lazy to fix them as I struggle nightly whether to work on content or design and content usually wins. Not a huge deal and not the fault of the theme.

Next up was customizing the theme a bit for my liking. As I began to dig through the style.css file I was very happy to see that it was lined with helpful commenting. The main thing I wanted to do was modify the column the overall width of the theme as well as the columns. For anyone else interested it is easily done by editing the style values below:

#wrapper – changed width to 1000px
#header – changed width to 1000px
#content – changed width to 550px
#sidbarRight – changed width to 170px
#sidebarLeft – changed width to 150px
#footer – changed width to 971px
ul#Nav – changed to 1000px

There was still one more step necessary for these column changes to work and that was to modify the “contentbg2.gif” & “header.gif” images. Since I was increasing the content column and extending the overall width of the theme, I needed to move the seperator and add to the right side of contentbg2.gif.

Cleaker contentbg2.gif modified

I also had to increase the width of my header.gif image from 900 to 1000 pixels

I made some other changes too such as incorporating the blockquote style which I liked more from K2 and changed the font weight to bold for the headlines. I will probably play with the color scheme and make some other changes as well in the future.

I am very happy with this theme and urge others that are looking for a great looking, and easily editable theme, to give it a try.

My modified version of Cleaker 2.1 Widgetized is available here

This Post Has 36 Comments

  1. Wow – thanks for such a great post about Cleaker! I’m glad you’re such a fan of it – I am as well ;) Your mod of it looks great! Feel free to donate for Cleaker here (http://pomomusings.com/design/) so I can continue to put together great themes!

  2. Wow – thanks for such a great post about Cleaker! I’m glad you’re such a fan of it – I am as well ;) Your mod of it looks great! Feel free to donate for Cleaker here (http://pomomusings.com/design/) so I can continue to put together great themes!

  3. Is it possible to share your theme? I like the increased column width.

  4. Is it possible to share your theme? I like the increased column width.

  5. Goldy…you’re wish is my command. I have now provided a link to my version at the end of the post above. Enjoy.

  6. Goldy…you’re wish is my command. I have now provided a link to my version at the end of the post above. Enjoy.

  7. awesome! thank you.

  8. awesome! thank you.

  9. More Cleaker love ! :)

    I do like your blockquote modification.

  10. More Cleaker love ! :)

    I do like your blockquote modification.

  11. I based my new theme off of the wonderful cleaker too.

  12. I based my new theme off of the wonderful cleaker too.

  13. could you tell me how you made the right sidebar transparent?
    Or how I could change its color?

    Its somethng Im trying to edit from the original theme

    thankyou.

  14. could you tell me how you made the right sidebar transparent?
    Or how I could change its color?

    Its somethng Im trying to edit from the original theme

    thankyou.

  15. Thank you for the writeup on how you altered this theme. I’ve been tweaking this theme myself and appreciate you sharing your experience.

    http://garlinggauge.com

  16. Thank you for the writeup on how you altered this theme. I’ve been tweaking this theme myself and appreciate you sharing your experience.

    http://garlinggauge.com

  17. I am having a really difficult time getting the widgets to work. Did you have problems getting them to work? I dont think that I need the widget plugin since I am using WP 2.2.

  18. I am having a really difficult time getting the widgets to work. Did you have problems getting them to work? I dont think that I need the widget plugin since I am using WP 2.2.

  19. I can’t get the sidebars to play nice in IE6!

    How did you do it? I’d like to place the edits in an IE conditional statement.

    Pretty please…

    Martin

  20. I can’t get the sidebars to play nice in IE6!

    How did you do it? I’d like to place the edits in an IE conditional statement.

    Pretty please…

    Martin

  21. Oh, it seems even this site is not rendering properly in IE6… I loaded your site into my IE6, and the first sidebar gets pulled under the second sidebar. Same with my site…

    Any ideas?

  22. Oh, it seems even this site is not rendering properly in IE6… I loaded your site into my IE6, and the first sidebar gets pulled under the second sidebar. Same with my site…

    Any ideas?

  23. This is what I did to make IE6 work:
    ===========================================================

    /* #wrapper {width: 950px;} */
    #content {
    width: 500px;
    margin-right: -5px;
    float: left;
    color: #000;
    padding: 20px;
    }
    #sidebarLeft {
    width: 75px;
    float: right;
    color: #000;
    background: #D7D8C4;
    padding: 20px 20px 20px 5px;
    overflow: hidden;
    }

  24. This is what I did to make IE6 work:
    ===========================================================

    /* #wrapper {width: 950px;} */
    #content {
    width: 500px;
    margin-right: -5px;
    float: left;
    color: #000;
    padding: 20px;
    }
    #sidebarLeft {
    width: 75px;
    float: right;
    color: #000;
    background: #D7D8C4;
    padding: 20px 20px 20px 5px;
    overflow: hidden;
    }

  25. Oops, my syntax was stripped out. I used IE conditional statements to feed IE that bit of CSS. Please just assume the greater/less than signs here:
    ===========================================================
    !–[if lte IE 6]
    style type=”text/css”
    /* #wrapper {width: 950px;} */
    #content {
    width: 500px;
    margin-right: -5px;
    float: left;
    color: #000;
    padding: 20px;
    }
    #sidebarLeft {
    width: 75px;
    float: right;
    color: #000;
    background: #D7D8C4;
    padding: 20px 20px 20px 5px;
    overflow: hidden;
    }
    /style
    ![endif]–
    ?php wp_head(); ?
    /head

  26. Oops, my syntax was stripped out. I used IE conditional statements to feed IE that bit of CSS. Please just assume the greater/less than signs here:
    ===========================================================
    !–[if lte IE 6]
    style type=”text/css”
    /* #wrapper {width: 950px;} */
    #content {
    width: 500px;
    margin-right: -5px;
    float: left;
    color: #000;
    padding: 20px;
    }
    #sidebarLeft {
    width: 75px;
    float: right;
    color: #000;
    background: #D7D8C4;
    padding: 20px 20px 20px 5px;
    overflow: hidden;
    }
    /style
    ![endif]–
    ?php wp_head(); ?
    /head

  27. Hello!
    Very Interesting post! Thank you for such interesting resource!
    PS: Sorry for my bad english, I’v just started to learn this language ;)
    See you!
    Your, Raiul Baztepo

  28. Hello!
    Very Interesting post! Thank you for such interesting resource!
    PS: Sorry for my bad english, I’v just started to learn this language ;)
    See you!
    Your, Raiul Baztepo

  29. so funny, i'm in the market for a new wordpress theme, and two worlds collide, Adam is a college friend of mine and Mark is an LA friend of mine, funny to see the two of them come together a few years ago.

  30. so funny, i'm in the market for a new wordpress theme, and two worlds collide, Adam is a college friend of mine and Mark is an LA friend of mine, funny to see the two of them come together a few years ago.

  31. Ummmm, you thought it was good – but….I see you’ve changed. So you think **THIS** theme is better than Cleaker?!?!?

    Ha :) Was just searching for if people still use it or not and found this post. Too funny. My oh my how themes have changed……

Comments are closed.

Close Menu
%d bloggers like this: