A 2-column Django-admin form

Django is great. The bundled admin interface makes it better. But as the number of items on the form gets bigger, the amount of wasted space increases because the layout is single column. Coupled with left alignment on wide-screen monitors, my users usually end their day with a condition we call “eyeballs misalignment”.

So I improvised and changed the form (and StackedInline) to a 2-up layout. No more “eyeballs misalignment”.

The corresponding template for Django 1.2.1 (/contrib/admin/templates/admin/includes/fieldset.html) looks like this, modified lines highlighted:

<fieldset class="module aligned {{ fieldset.classes }}">
    {% if fieldset.name %}<h2>{{ fieldset.name }}</h2>{% endif %}
    {% if fieldset.description %}
        <div class="description">{{ fieldset.description|safe }}</div>
    {% endif %}
    <table border=0 width=100%>
    {% for line in fieldset %}
        {% cycle '<tr>' '' %}
        <td width=50%>
        <div style="border-bottom:0" class="form-row{% if line.errors %} errors{% endif %}{% for field in line %} {{ field.field.name }}{% endfor %}">
            {{ line.errors }}
            {% for field in line %}
                <div{% if not line.fields|length_is:"1" %} class="field-box"{% endif %}>
                    {% if field.is_checkbox %}
                        {{ field.field }}{{ field.label_tag }}
                    {% else %}
                        {{ field.label_tag }}
                        {% if field.is_readonly %}
                            <p>{{ field.contents }}</p>
                        {% else %}
                            {{ field.field }}
                        {% endif %}
                    {% endif %}
                    {% if field.field.field.help_text %}
                        <p class="help">{{ field.field.field.help_text|safe }}</p>
                    {% endif %}
                </div>
            {% endfor %}
        </div>
        </td>
        {% cycle '' '</tr>' %}
    {% endfor %}
    </table>
</fieldset>

BUT, here’s the caveat: TextField will mess up the layout a bit due to CSS. And since I do not use TextField extensively, I prefer to leave it at that (minimal hacking). Please leave a comment if anyone find other field types that do not display/work properly.

p/s: All hail source code posting!
Posting Source Code « Support — WordPress.com

Advertisements