8 web design add-ons for Django

In the last year, I’ve defined a quite stable fundation for my django projects. In this post I’m enumerating template design components that saved my day by reducing development time while keeping code readable, concise and standard-compliant.

1. Blueprint CSS framework

While not a django-specific add-on, Blueprint CSS framework is a perfect companion for django template designers: it features cross-browser style reset, a 24-column grid layout, a nice looking typography and a print-friendly style.

2. django-uni-form

django-uni-form implements UniForm CSS framework in Django: you can render your forms as stylish xhtml-compliant divs using a simple template tag filter and add form layout information to your Form classes.

3. django-compress

Optimization of CSS and Javascript distribution can greatly improve web client rendering times: django-compress outputs concatenated and minified files and handles smart client-side caching.

4. django-userskins

Using django-userskins you can enable user-selected themes in your application.

5. django-tabs

For your navigation bar, you can use django-tabs to highlight active tab (possibly with multiple navigation layers), by combining Django template extension mechanism and a special template tag.

6. django-reversetag

Default url tag is quite primitive, but using reverse tag introduce by django-reversetag, you can resolve urls from variables and string literals, which is very useful if your view or named view is computed at run-time.

7. macros template tags

Django macros template tags help you apply DRY criterias in your templates, while maintaining separation between presentation and logic. Download macros.py and save it into your app’s templatetags folder.

8. smart_if template tags

smart_if template tag add-on replaces default if/else/endif tags with a custom version that allows basic yet useful value comparisons. Download smart_if.py and save it into your app’s templatetags folder.

Tip: original smart_if doesn’t support elif syntax. You can find amended version here.

This entry was posted in Coding, Tips and tagged , , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

15 Comments

  1. codysoyland
    Posted February 3, 2010 at 10:50 PM | Permalink

    Good overview of some various options. I'd like to recommend a couple of other webdesign-related tools. One is Typogrify: http://jeffcroft.com/blog/2007/may/29/typogrify…

    Another thing I'd like to recommend for template designers is django-template-repl (shameless self-promotion). This makes it easier to debug template tags: http://www.codysoyland.com/2009/dec/13/django-t…

  2. Posted February 3, 2010 at 11:04 PM | Permalink

    @codysoyland: thanks for your suggestions. Will try them asap :-)

  3. Posted February 4, 2010 at 4:32 PM | Permalink

    I've been using django-compress and it works well, however it's annoying that you need to list the css/js files in your settings.py. A web designer should be able to define the css/js right in the template. That's why I've recently switched to django_compressor (http://github.com/carljm/django_compressor). Has the same feature set, but the css/js can stay in the templates, and it's also actively being developed.

  4. Posted February 5, 2010 at 12:30 AM | Permalink

    It's worth pointing out the functionality of the smart_if tag has been incorporated into the `if` tag for 1.2 (see http://docs.djangoproject.com/en/dev/releases/1…)

  5. Posted February 5, 2010 at 11:37 PM | Permalink

    Hi Ozan, thanks for pointing out. I will update my post asap.

  6. RyanBalfanz
    Posted February 24, 2010 at 7:34 AM | Permalink

    Thanks!

  7. Posted August 7, 2010 at 6:39 PM | Permalink

    I am just starting a new site with Django and found your post via google. Thanks for the information. I believe some of the add ons will come in real handy

  8. manyvisitor
    Posted August 18, 2010 at 11:12 PM | Permalink

    The information you provide is quiet helpful, why I was not able to find it earlier. Anyways I’ve subscribed to your feeds, keep the good work up.thanks.
    seo

  9. Posted September 9, 2010 at 11:15 AM | Permalink

    Never used Django before, however seems quite interesting. Thanks

  10. Posted September 10, 2010 at 9:28 AM | Permalink

    I would like to mention two more tools http://googlecode.blogspot.com/2010/05/introducing-google-font-api-google-font.html and http://code.google.com/webfonts/preview#font-family=Vollkorn (tool which lets you preview and live-edit fonts which are part of the Google Font API)

    These both are nice tools for web designers

  11. Posted September 13, 2010 at 4:39 AM | Permalink

    Those are really helpful and I find it quite easy to use also. Thanks for sharing!

  12. Posted October 5, 2010 at 1:16 AM | Permalink

    Great collection of addons thank you very much.

  13. Posted October 20, 2010 at 8:45 PM | Permalink

    very good article
    keep it going guys
    this might be a future

  14. ricky
    Posted November 22, 2010 at 9:11 AM | Permalink

    I’m all for the cause but not for this sort of action. I think idiots is too strong but I would rather see none interventionist protests.Symbiosis Mba

  15. Posted November 23, 2010 at 10:08 PM | Permalink

    I heard about django but haven't used it. Thank you for posting this article it made me think to try using django. great stuff.

4 Trackbacks

  1. By uberVU - social comments on February 3, 2010 at 10:00 PM

    Social comments and analytics for this post…

    This post was mentioned on Twitter by geekscrap: 8 web design add-ons for Django http://goo.gl/fb/LeS4 #coding #tips #django #template #templatetag #webdesign…

  2. By links for 2010-02-04 at a convenient truth on February 4, 2010 at 6:02 PM

    [...] Geek Scrap: 8 web design add-ons for Django (tags: python django) « links for 2010-02-02 [...]

  3. By Weekly Digest for February 6th | William Stearns on February 7, 2010 at 5:28 AM

    [...] Shared Geek Scrap: 8 web design add-ons for Django. [...]

  4. [...] 8 web design add-ons for Django [...]

Post a Comment

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

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>