Getting started#

1. Install#


pip install iommi.

Add iommi to installed apps:

    # [...]

Add iommi’s middleware:

    # These three are optional, but highly recommended!

    # [... Django middleware ...]


    # [... your other middleware ...]



The iommi middleware must be the last middleware in the list!

By default iommi uses a very basic bootstrap base template. We’ll get to how to integrate it into your site later.

2. Your first form#

Pick a model from your app, and let’s build a create form for it! I’m using Album here, but you should replace it with some your model. Add this to your

from iommi import Form

urlpatterns = [
    # ...your urls...
    path('iommi-form-test/', Form.create(auto__model=Album).as_view()),
▼ Hide result

3. Your first table#

Pick a model from your app, and let’s build a table for it! Add this to your

from iommi import Table

urlpatterns = [
    # ...your urls...
    path('iommi-table-test/', Table(auto__model=Album).as_view()),
▼ Hide result

If you want, add a filter for some column:

urlpatterns = [
    # ...your urls...
    path('iommi-table-test/', Table(
        columns__name__filter__include=True,  # <--- replace `name` with some field from your model
▼ Hide result

4. Your first page#

Pages are the method to compose complex pages from parts. Add this to your

from iommi import Page, Form, Table

class TestPage(Page):
    create_form = Form.create(auto__model=Artist)
    a_table = Table(auto__model=Artist)

    class Meta:
        title = 'An iommi page!'

then hook into

urlpatterns = [
    # ...your urls...
▼ Hide result

5. A simple function based view#

It’s often useful to have a function based view around your iommi code to do some basic setup. So we’ll add an example for that too. With iommis middleware you can return iommi objects from your view:

def iommi_view(request, name):
    return TestPage(title=f'Hello {name}')

urlpatterns = [
    # ...your urls...
▼ Hide result

6. Make iommi pages fit into your projects design#

So far all the views we’ve created are rendered in plain bootstrap. Let’s fit the iommi views you’ve already added into the design of your project.

The simplest is to add something like this to your

# These imports need to be at the bottom of the file!
from iommi import Style, Asset
from iommi.style_bootstrap import bootstrap


Where my_project/iommi_base.html could look something like this:

{% extends "iommi/base.html" %}

{% block iommi_top %}
    {% include "my_menu.html" %}
{% endblock %}

{% block iommi_bottom %}
    {% include "my_footer.html" %}
{% endblock %}

After you’ve set up your base style successfully, all the test pages you made before (form, table, page, view) are now using your style.