rob.cogit8.org

Django Templates and YUI Grids

Recently I was playing around with YUI grids to make a 2 column layout. The grid builder is awesome to quickly set up a site skeleton. I was wanting a site that had a full width layout for some pages and a side column for some other pages that had extra meta data about the main content area. I saw that YUI grids was able to do this by simply changing a class name on the major DIV element.

So what I did was set the default wide width in my base template like so:

 <div id="doc2" class="yui-t{% block coltype %}7{% endblock %}">

That makes the class "yui-t7" by default, which according to the YUI Grids docs is "One full-width column".

For templates that require a side column you add your content to your side column block and also simply override the coltype block using Django's template inheritance by adding this to your template file and you've got YUI grid magic!

{% block coltype %}6{% endblock %}