Alister Cameron // Blogologist

Changing the world. One blog(ger) at a time.

Call for Alpha testers for the next-generation WordPress theme

I’ve been talking for months now about the integration of the wonderful Sandbox and the Yahoo User Interface CSS library. Well, I’ve done it.

Codename: Vanilla

It’s codenamed Vanilla and it’s in “closed Alpha” just for now.

But with all things new, I need some people to step up to the mark and help me test it, refine it and so on. You can do that in the comments below (more about that in a moment).

So what’s the big deal?

The BIG Deal: One Theme, Many Layouts

To my mind, the “Holy Grail” of WordPress theme design is to create themes that look great and are truly flexible. Sure, there’s all that stuff about standards, but bloggers first and foremost choose themes that make their blog look good, and allow them a degree of straightforward flexibility when it comes to making their own customizations.

Up until now that flexibility has been pretty limited. It’s meant being able to change the header graphic, some colours here and there, and so forth. But I reckon we can do better than that!

So Vanilla adds a simple admin screen offering most of the layout options available with the YUI grids. This means that theme developers can now create new WordPress themes (or retro-fit old favourites) so that they can accommodate any one of dozens (maybe hundreds?!) of different layout combinations.

This means Bill the Blogger can use the same theme for his “no-nonsense” one-column blog (with sidebar content at the bottom of the page), while someone like me can choose a three-column layout with, say, both primary and secondary columns on the right-hand-side, or one column on each side, or whatever!

Think about how a theme built on top of the Vanilla platform is more useful and flexible to a newbie blogger than all of the themes out there now!

Think about it… the whole reason why the WordPress Theme Viewer groups the themes according to how many columns they have is because they’re hard-coded that way! You can’t change them to a different column layout without some serious coding, and most bloggers are not up for that.

(Maybe the WordPress Theme Viewer will need to include a new category for Vanilla-built themes… “universal” or something!)

If you’re a theme designers, you might like to consider how many bloggers are not using a given theme of yours, just because the layout/column setup is not to their liking (much as they might have loved the overall design).

Well, no more!

Vanilla gives you the best of both worlds: firstly it’s built on the Sandbox, which is hands-down the best semantic markup you could hope to built a WordPress theme on. Then there’s the YUI CSS library, not least the Grids system, which provides the awesome power to create one theme with a huge number of layout options.

Here’s what the Vanilla Settings page looks like (in WordPress Admin):

Vanilla Theme Settings

Vanilla’s settings page (in WordPress Admin) lets you rapidly choose a one-, two- or three-column layout, along with a number of options for page widths and column positions. This gives you literally hundreds of layouts (i.e. column combinations) to choose from!

Here’s what the settings form looks like. Just three select-boxes does the trick:

Page Width:
Outer Column (fixed width):
Inner Column (relative width):
Page Width
This setting determines the overall width of the entire content of your page (not the browser window width, of course). You have three fixed-width options, which are all centered, and one full-width (100%) option.
Outer Column
The outer column can be set to one of three fixed widths, and either to the left or right of the page. It is a quirk of YUI CSS Grids (and related to IAB “standards”) that these widths differ slightly between the left-hand and right-hand positions on the page.
Inner Column
The width of the inner column is measured relative to the width of the main content area. For the three fixed page width options, the inner sidebar also has a fixed width, however for the 100% page-width option, the inner sidebar width is “fluid” and will proportionally resize, relative to the browser window (as will the content area).

Layout Notes

  1. The leftmost sidebar column will always contain the primary sidebar, meaning that if both sidebar columns are used (whether set to the same side of the page or not), the primary sidebar will always appear to the left of the secondary sidebar.
  2. For a one- or two-column layout (where either the outer or inner sidebar column is set to “none”, or both) the displayed column will contain both the primary and secondary sidebars, the latter following on immediately from the former. In the case of a one-column layout (where no outer or inner sidebar column is used) the primary and secondary sidebars will appear below the content area.

(Understanding the “why” behind these points requires an appreciation of how YUI CSS Grids have been designed to work.)

Using the YUI Grid Builder

By far the easiest way to play around with Vanilla’s layout settings (and to learn how the Grids work) is to use the YUI Grid Builder. Once you are happy with what you see there, enter those settings into the form on the Vanilla settings page and you’ll have the same layout structure in Vanilla.

Important note: Vanilla’s use of the YUI CSS grid system is limited, compared to the YUI Grid Builder (in terms of row and column options). This is reflected in the range of choices available for the inner column (a couple of the YUI CSS Grid options you can play with in the Builder make no sense for a blog layout).

Theme Developer Notes

Design one theme with many layout options.
If you know your CSS well enough you should be able to design a great looking theme that won’t break, no matter what layout options are selected above. Go on, I dare you!
You’re ahead before you’ve started.
The YUI CSS library means your theme development starts ahead of the rest. The strange differences between browsers have been cleaned up, there’s a rock-solid grid to build off, and the optional Base.css file gives you a headstart on default CSS settings for the most common elements.
Very minor differences from the Sandbox.
Vanilla is based on the Sandbox theme, with just four renamed elements:

  1. div#wrapper is renamed div#doc/doc2/doc3/doc4
  2. div#header is renamed div#hd
  3. div#container is renamed div#bd
  4. div#footer is renamed div#ft
  5. Err, nothing. That’s it!

YUI CSS requires the addition of extra DIVs and classes, but these need not be styled, as a rule.

Tricked up sidebars, but they take care of themselves.
Vanilla’s “logic” controlling the display of sidebar content (and the surrounding HTML markup) is, well, messy. But the good news is you’re still just styling div.sidebar and/or div#primary and div#secondary.
Converting existing Sandbox themes (skins) is easy!
In light of the above, you should by now realize that converting an existing Sandbox theme to Vanilla is pretty easy. (I converted Sandpress–the Sandbox competition’s winning entry–in just a couple of hours, having never looked at the CSS before. And this wasn’t just a conversion to the grid, but to YUI’s Reset CSS as well.)

So Who Wants To Play!?

Vanilla will remain in “closed Alpha” for as short a time as possible. The purpose of this is to avoid releasing the theme with too many embarrassments to myself! No, but seriously, I’d rather get some key theme designers to give it a run through its paces first, so we can iron out the most obvious issues. I’d rather fewer bug releases at the start so what people get first up is at least stable and tested.

Secondly, I’m hoping Vanilla can go to beta with a few simple themes ready for release, which demonstrate these exciting new capabilities.

For all this to happen quickly and with little fuss, I’d like to send out an invitation to accomplished Sandbox and/or WordPress theme developers and designers, who’d like to take Vanilla for a serious “spin”. My simple criteria are that a) you have already created at least one WordPress theme for public consumption, and b) you have time to either play around creating a new one on Vanilla or retro-fitting an existing theme for Vanilla.

If you have developed a popular WordPress theme that you’d be prepared to rework for Vanilla, I’d especially like you to get involved.

Either way, please apply to join the Alpha test in the comments below, or via my contact form, or by email to .

Let’s make this BIG!

(Oh yeah, and I won’t be emailing people with updates and stuff. Please subscribe to my RSS feed for that.)

wordpress, blogging, wordpress themes, sandbox theme, sandpress theme, wordpress theming, blog themes, theme viewer, vanilla theme, alister cameron, yahoo user interface, yui, css grids, yui css, alpha test

32 Comments

Note: Commenter website links are not no-followed, in case
you were wondering... I believe in rewarding commenters!

  1. Posted 8 years, 1 month ago // Permalink

    I’d like to test as a user if needed.

    Gavin

  2. Posted 8 years, 1 month ago // Permalink

    +1 on that! I was just about to convert my current theme to use the YUI CSS Foundation. Then I would have to convert it to Sandbox or some other theme framework. Now I can have both in one and half of the work already done. Great!

  3. Posted 8 years, 1 month ago // Permalink

    I’m not qualified to be an alpha tester (no CSS skills, have never designed a theme) but would be happy to beta test or help in some other way.

    My site http://sandbox.popularlogistics.com is, essentially, a wordpress sandbox and notebook – which I set up in order to teach myself how to use WordPress. So I’m qualified to simulate an end-user of a theme. Low-end, that is.

    Jon

  4. Posted 8 years, 1 month ago // Permalink

    Probably way to late in the game on this, but I wish I could have helped test it :( I’m not the best with CSS, but it sounds really cool and I’m getting tired of my bland look :/

  5. Posted 8 years, 1 month ago // Permalink

    Sorry to everyone waiting for the Alpha code, etc.

    I am mad keen to get it to you, but for those who don’t have it yet, I’ve stopped sending it out until I can alter some key things about it.

    My vision for it has expanded a little and it’s not even ready for Alpha yet… but it will be soon.

    Please sit tight and I’ll be there shortly… sorry!

    –Alister

  6. Posted 8 years, 1 month ago // Permalink

    So please try to keep up the great work all the time. Greetings

  7. Posted 8 years ago // Permalink

    Hi

    I’m in too.
    MC

  8. Posted 8 years ago // Permalink

    Sounds pretty cool, but I still think most people aren’t savvy enough to use any sort of theme with options. They prefer just picking something and it’s done. Or hiring someone to do it for them.

  9. Posted 8 years ago // Permalink

    I’m on the edge of my seat waiting for this! :-)

  10. Posted 8 years ago // Permalink

    this sounds pretty cool. nice use of the yui tool.

  11. Posted 7 years, 11 months ago // Permalink

    I just used Sandbox for my new blog design… but it’d be nice to have the built-in YUI grids and layout selection ability of Vanilla.

    I know you must be busy, so I’ll be patient. :-)

  12. Posted 7 years, 11 months ago // Permalink

    Yeah. I agree with Harris. People tend to love just chuck to go and use themes rather than customable ones like this. But great work. :) I’m enjoying my stay here. Learnt lots of new things for my WP blog.

  13. Posted 7 years, 10 months ago // Permalink

    Has this theme been released already? If yes, where can I download? If not, count me in please!

  14. Posted 7 years, 10 months ago // Permalink

    I’m not qualified cause I never did a I theme, but I would like to be a tester.

    In addition, I can help with the traslation to spanish and catalan.

    regards

  15. Posted 7 years, 10 months ago // Permalink

    Thematic & Vanilla the race is on. I would be interested in testing the code/framework

  16. Posted 7 years, 10 months ago // Permalink

    @James – Ha! I would be disappointed if Ian thought of me as a competitor. I would hope that Vanilla and Thematic both take their places as promoters of best practice. That is my hope. Vanilla is suffering right now under the stress of my workload… it has not had my attention lately, even tho I am using it all the time in the site’s we’re building.

    As soon as I have a moment, I will clean it up, tweak a few things, and then “release” it in a beta.

    Not much longer, folks.

    -Alister

  17. Posted 7 years, 9 months ago // Permalink

    When will it be published? The features sounds kinda nice.

  18. Posted 7 years, 9 months ago // Permalink

    Wow… and there was I lumbering around trying to produce a retarded mutant half-cousin called vanillin 😉
    Lucky I found Themeshapers ‘theme future’ article.
    Can I test it out on a live genealogy site I am setting up?
    Are you able to advance a copy or is it near release?
    All the best,
    Mike

  19. Brandon
    Posted 7 years, 9 months ago // Permalink

    Looking forward to this. Thematic is excellent, though I am slightly partial to YUI Grids… time for a release!

  20. Posted 7 years, 8 months ago // Permalink

    First of all the vanila icecream picture looks too inviting. Secondly I also believe in the look of the blog as first impression is the last impression. The next best is content. Of course content is required to hold on the traffic,but the theme and how easy it is to navigate through the site is also important.

  21. Posted 7 years, 8 months ago // Permalink

    The last mention of this theme was back in February. Will this ever be released? Are we looking at a Duke Nukem 3D time frame?

  22. Posted 7 years, 4 months ago // Permalink

    Folks,

    Not quite a Duke Nukem scenario but close.

    I have put countless hours into Vanilla this last week or so and it’s taken a massive leap forward. Thanks for your patience.

    It is not ready for “users” but it is ready for hard-core PHP/WP developer-types who want to give me their feedback from a technical perspective.

    If you’re a taker, can you please email me at alister at alistercameron dot com.

  23. Posted 7 years, 4 months ago // Permalink

    Hey Al, looks great!

    Don’t know how much use I would be to you testing it though 😉 my knowledge on coding is somewhat limited!

  24. Posted 7 years ago // Permalink

    Congrats on the new framework!

    Would love to play with it if the opportunity is still there!

    Thanks!!

  25. Posted 7 years ago // Permalink

    I appreciate how you comment and treat news about Sandbox. Your comments are never spiteful, you never gloat, and that shows class. When they do well you acknowledge it, when they have a major accomplishment you wish them well and you don’t add to the vitriol spewed when they are struggling. That shows considerable class and adds to your credibility enormously.

  26. Posted 6 years, 8 months ago // Permalink

    Is there a download link ?

  27. Posted 6 years, 8 months ago // Permalink

    I always love when user are called to help in a cool project. I was wondering too though, is there a download link of the updated/final project or i am just blind as usual and missing something 😛

  28. Posted 6 years, 5 months ago // Permalink

    Some news ?

  29. Posted 5 years, 11 months ago // Permalink

    Are there any updates?

  30. Posted 5 years, 10 months ago // Permalink

    , have a quick question, will the vanilla work also on wordpress v3.0? If so, what difficulties i can face?

    thanks for the help in advance.

  31. Posted 5 years, 10 months ago // Permalink

    A freedom for designers, without needing to know or touch PHP. Thanks to the combined capabilities of PHPTAL templates, Carrington’s atomic templates, YUI CSS and full widgetization (including custom widget controls). Thanks to the creator of the Vanilla!

  32. Posted 5 years, 4 months ago // Permalink

    I want to try ur theme, that seems to be so interesting 😀

5 Trackbacks/Pingbacks

  1. […] de fondations pour bâtir d’autres thèmes. A ce propos, j’attire votre attention sur le thème WordPress Vanilla conçu par Alister Cameron, blogueur et designer de talent, qui fut membre du jury pour le concours […]

  2. […] base) and so can guarantee a transparent crossover between WordPress and TNG pages. There is also Vanilla which looks like a really good integration of Sandbox and YUI but for the moment it is still in a […]

  3. […] Vanilla: Alister’s own project, which looks to integrate the features of the aforementioned themes, plus add layout flexibility using options (like dropdown page rearrangement), content blocks (as opposed to the rigidity of header, posts, sidebar, footer that we’ve been adhering to) and widgetising those blocks. […]

  4. […] Call for Alpha testers for the next-generation WordPress theme SAVE […]

  5. […] Vanilla – While not necessarily described as a framework, it is based on Carrington and appears to be a lot of potential behind the idea. […]

Post a Comment

Your email is never published nor shared. Required fields are marked *
*
*

    • madmimi.com
    • www.medialayer.net
    • splash.oiopublisher.com
    • marketsamurai.com
    • Advertise Here

  • My Posts in Your In-box!

    Enter your email address here for instant updates in your inbox, whenever I post something new.
    Your email address is in safe hands. Relax!
© Copyright 2008 Alister Cameron. All Rights Reserved Theme // Sitemap // RSS