Templates Tags and Filters

Nuit provides a handlful of template tags and filters designed to abstract some of the complexities of writing templates for the framework.

Tags

extend

Extends another template, passing any keyword arguments to the parent template (prefixed by nuit_). For example:

{% extend 'nuit/base.html' topbar=True %}

results in the variable nuit_topbar being available (and set to True) in nuit/base.html.

menu_section

Intended for use inside one of either the left_menu or right_menu blocks. This block wraps any content in the markup required to render a section of the menu correctly.

The following arguments are optional:

title

Default:None

The title of this section. If ommitted, no title will be displayed.

link_name

Default:None

When used in the right_menu block, these sections appear under the gear at medium screens and smaller. This attribute defines the name of the link to be displayed in that menu which will activate the popup. This is required if title is not set. If ommitted, and title is set, then the title will be used.

id

Default:None

A unique ID to use for the section. If ommitted, then the result of the link_name attribute calculation will be run through Django’s slugify function, and that result used.

is_list

Default:False

Whether this section contains a list of links or not. If True, then the correct HTML will be wrapped around the content to display the list in the right way. This is intended to be used with the menu_item template tag.

Example usage:

{% block right_menu %}

    {% menu_section "Details" link_name="Show some details" %}
        <p>These are some details.</p>
    {% end_menu_section %}

    {% menu_section "More stuff" %}
        <table>
            <tr>
                <td>A table</td>
            </tr>
        </table>
    {% end_menu_section %}

{% endblock %}

menu_item

Renders the HTML for a menu item. Intended for use between menu_section tags with is_list set to True. If the link resolves to a view that the user doesn’t have permission to access, the link will not be displayed. Takes the following arguments:

link

The URL for the menu item. You can use a view identifier, which will be reversed if possible.:

{% menu_item link='name.of.my.view' name="My URL" %}

name

The display name of the link.

always_display

If you want the link to always be displayed, even if the user can’t access it, set this to True.

id

Default:slugified name

A unique ID for the link, intended for use by the set_active_menu tag. Is applied as a class to the <li> prepended with menu-.

app_menu

Renders the main application menu. Intended for use in the right_menu block, and should be filled with menu_item links. One optional argument:

title

The title of the application - displayed above the menu items.

Example usage:

{% block left_menu %}
    {% app_menu 'My Application' %}
        {% menu_item name='Page One' link='/page-one/' %}
        {% menu_item name='Page Two' link='/page-two/' %}
        {% menu_item name='Page Three' link='/page-three/' %}
        {% menu_item name='Page Four' link='/page-four/' %}
        {% menu_item name='Page Five' link='/page-five/' %}
    {% end_app_menu %}
{% endblock %}

set_active_menu

Renders an invisible element used by Javascript to set the active class on a menu item for this page. This must be within a template block that renders to the screen - it doesn’t matter which one. It produces no visible output. The only required attribute is:

active_menu

The unique ID of the menu item to be activated. To highlight the menu item in the example above, the required code would be:

{% set_active_menu "my-url" %}

pagination_menu

Used internally by Nuit in the nuit/generic/list.html template to generate the pagination links for a paginated list of objects. The required attributes are:

page_obj

The Django Page object for the current view of data. This is provided by Django’s ListView and Nuit’s SearchableListView.

show_totals

Default:True

Whether to show the total number of objects or not.

foundation_form

Renders a form using Foundation’s form styles in the given layout. Takes one required arguement, and one optional:

form

The Django Form object. Works with all standard Django Form classes.

csrf_enabled

Default:True

Whether to include the CSRF token or not.

collapse_container

Default:False

Whether to collapse the side padding of the form elements.

Further options are specified between the foundation_form and end_foundation_form tags. For more details, see the Forms documentation. Example usage:

{% foundation_form my_form_object %}
    title, first_name, surname
    email_address
{% end_foundation_form %}

Filters

message_class

Given a message object from Django’s django.contrib.messages, returns a string containing the CSS alert-box class for Foundation alert boxes corresponding to the message’s level (DEBUG, INFO, SUCCESS, WARNING or ERROR). Used to style the message alert boxes:

{% for message in messages %}
    <div data-alert class='alert-box {{message|message_class}}'>{{message}}</div>
{% endfor %}