Template tags and filters¶

Note

All the following examples it is understood that you have already loaded the bootstrap3 template tag library, placing the code below in the beginning that each template that bootstrap3 template tag library will be used. Read the Installation and Quickstart sections on how to accomplish this.

bootstrap_form¶

bootstrap3.templatetags.bootstrap3.bootstrap_form(*args, **kwargs)[source]¶

Render a form.

Tag name:

bootstrap_form

Parameters:

form
The form that is to be rendered

exclude
A list of field names (comma separated) that should not be rendered E.g. exclude=subject,bcc

error_types
This controls the types of errors that are rendered above the form. Choices are: “all”, “field_errors”, “non_field_errors” or “none”. This will not affect the display of errors on the fields themselves.

Default is “non_field_errors”.

See bootstrap_field for other arguments

Usage:

{% bootstrap_form form %}

Example:

{% bootstrap_form form layout='inline' %}

bootstrap_form_errors¶

bootstrap3.templatetags.bootstrap3.bootstrap_form_errors(*args, **kwargs)[source]¶

Render form errors.

Tag name:

bootstrap_form_errors

Parameters:

form
The form that is to be rendered

error_types
Control which type of errors should be rendered.

One of the following values:

'all'

'field_errors'

'non_field_errors'

default:

'non_field_errors'

layout
Context value that is available in the template bootstrap3/form_errors.html as layout.

Usage:

{% bootstrap_form_errors form %}

Example:

{% bootstrap_form_errors form layout='inline' %}

bootstrap_formset¶

bootstrap3.templatetags.bootstrap3.bootstrap_formset(*args, **kwargs)[source]¶

Render a formset.

Tag name:

bootstrap_formset

Parameters:

formset
The formset that is being rendered

See bootstrap_field for other arguments

Usage:

{% bootstrap_formset formset %}

Example:

{% bootstrap_formset formset layout='horizontal' %}

bootstrap_formset_errors¶

bootstrap3.templatetags.bootstrap3.bootstrap_formset_errors(*args, **kwargs)[source]¶

Render formset errors.

Tag name:

bootstrap_formset_errors

Parameters:

formset
The formset that is being rendered

layout
Context value that is available in the template bootstrap3/form_errors.html as layout.

Usage:

{% bootstrap_formset_errors formset %}

Example:

{% bootstrap_formset_errors formset layout='inline' %}

bootstrap_field¶

bootstrap3.templatetags.bootstrap3.bootstrap_field(*args, **kwargs)[source]¶

Render a field.

Tag name:

bootstrap_field

Parameters:

field
The form field to be rendered

layout
If set to 'horizontal' then the field and label will be rendered side-by-side, as long as there is no field_class set as well.

form_group_class
CSS class of the div that wraps the field and label.

default:

'form-group'

field_class
CSS class of the div that wraps the field.

label_class
CSS class of the label element. Will always have control-label as the last CSS class.

show_help
Show the field’s help text, if the field has help text.

default:

True

show_label
Whether the show the label of the field.

default:

True

exclude
A list of field names that should not be rendered

size
Controls the size of the rendered div.form-group through the use of CSS classes.

One of the following values:

'small'

'medium'

'large'

placeholder
Set/overwrite the field’s placeholder.

label
Overwrite the field’s label.

horizontal_label_class
Class used on the label when the layout is set to horizontal.

default:

'col-md-3'. Can be changed in Settings

horizontal_field_class
Class used on the field when the layout is set to horizontal.

default:

'col-md-9'. Can be changed in Settings

addon_before
Text that should be prepended to the form field. Can also be an icon, e.g. '<span class="glyphicon glyphicon-calendar"></span>'

See the Bootstrap docs <http://getbootstrap.com/components/#input-groups-basic> for more examples.

addon_after
Text that should be appended to the form field. Can also be an icon, e.g. '<span class="glyphicon glyphicon-calendar"></span>'

See the Bootstrap docs <http://getbootstrap.com/components/#input-groups-basic> for more examples.

addon_before_class
Class used on the span when addon_before is used.

One of the following values:

'input-group-addon'

'input-group-btn'

default:

input-group-addon

addon_after_class
Class used on the span when addon_after is used.

One of the following values:

'input-group-addon'

'input-group-btn'

default:

input-group-addon

error_css_class
CSS class used when the field has an error

default:

'has-error'. Can be changed Settings

required_css_class
CSS class used on the div.form-group to indicate a field is required

default:

''. Can be changed Settings

bound_css_class
CSS class used when the field is bound

default:

'has-success'. Can be changed Settings

Usage:

{% bootstrap_field field %}

Example:

{% bootstrap_field field show_label=False %}

bootstrap_label¶

bootstrap3.templatetags.bootstrap3.bootstrap_label(*args, **kwargs)[source]¶

Render a label.

Tag name:

bootstrap_label

Parameters:

content
The label’s text

label_for
The value that will be in the for attribute of the rendered <label>

label_class
The CSS class for the rendered <label>

label_title
The value that will be in the title attribute of the rendered <label>

Usage:

{% bootstrap_label content %}

Example:

{% bootstrap_label "Email address" label_for="exampleInputEmail1" %}

bootstrap_button¶

bootstrap3.templatetags.bootstrap3.bootstrap_button(*args, **kwargs)[source]¶

Render a button.

Tag name:

bootstrap_button

Parameters:

content
The text to be displayed in the button

button_type
Optional field defining what type of button this is.

Accepts one of the following values:

'submit'

'reset'

'button'

'link'

icon
Name of an icon to render in the button’s visible content. See bootstrap_icon for acceptable values.

button_class
The class of button to use. If none is given, btn-default will be used.

extra_classes
Any extra CSS classes that should be added to the button.

size
Optional field to control the size of the button.

Accepts one of the following values:

'xs'

'sm'

'small'

'md'

'medium'

'lg'

'large'

href
Render the button as an <a> element. The href attribute is set with this value.

name
Value of the name attribute of the rendered element.

value
Value of the value attribute of the rendered element.

Usage:

{% bootstrap_button content %}

Example:

{% bootstrap_button "Save" button_type="submit" button_class="btn-primary" %}

bootstrap_icon¶

bootstrap3.templatetags.bootstrap3.bootstrap_icon(icon, **kwargs)[source]¶

Render an icon.

Tag name:

bootstrap_icon

Parameters:

icon
Icon name. See the Bootstrap docs for all icons.

extra_classes
Extra CSS classes to add to the icon HTML

title
A title for the icon (HTML title attribute)

Usage:

{% bootstrap_icon icon %}

Example:

{% bootstrap_icon "star" %}

bootstrap_alert¶

bootstrap3.templatetags.bootstrap3.bootstrap_alert(content, alert_type='info', dismissable=True)[source]¶

Render an alert.

Tag name:

bootstrap_alert

Parameters:

content
HTML content of alert

alert_type

'info'

'warning'

'danger'

'success'

default:

'info'

dismissable
boolean, is alert dismissable

default:

True

Usage:

{% bootstrap_alert content %}

Example:

{% bootstrap_alert "Something went wrong" alert_type='danger' %}

buttons¶

bootstrap3.templatetags.bootstrap3.bootstrap_buttons(parser, token)[source]¶

Render buttons for form.

Tag name:

buttons

Parameters:

submit
Text for a submit button

reset
Text for a reset button

Usage:

{% buttons %}{% endbuttons %}

Example:

{% buttons submit='OK' reset="Cancel" %}{% endbuttons %}

bootstrap_messages¶

bootstrap3.templatetags.bootstrap3.bootstrap_messages(context, *args, **kwargs)[source]¶

Show django.contrib.messages Messages in Bootstrap alert containers.

In order to make the alerts dismissable (with the close button), we have to set the jquery parameter too when using the bootstrap_javascript tag.

Uses the template bootstrap3/messages.html.

Tag name:

bootstrap_messages

Parameters:

None.

Usage:

{% bootstrap_messages %}

Example:

{% bootstrap_javascript jquery=1 %}
{% bootstrap_messages %}

bootstrap_pagination¶

bootstrap3.templatetags.bootstrap3.bootstrap_pagination(page, **kwargs)[source]¶

Render pagination for a page.

Tag name:

bootstrap_pagination

Parameters:

page
The page of results to show.

pages_to_show
Number of pages in total

default:

11

url
URL to navigate to for pagination forward and pagination back.

default:

None

size
Controls the size of the pagination through CSS. Defaults to being normal sized.

One of the following:

'small'

'large'

default:

None

extra
Any extra page parameters.

default:

None

parameter_name
Name of the paging URL parameter.

default:

'page'

Usage:

{% bootstrap_pagination page %}

Example:

{% bootstrap_pagination lines url="/pagination?page=1" size="large" %}
{% bootstrap_pagination page_obj extra=request.GET.urlencode %}

bootstrap_jquery_url¶

bootstrap3.templatetags.bootstrap3.bootstrap_jquery_url()[source]¶

Return url to jquery resource.

Tag name:

bootstrap_jquery_url

Return the full url to jQuery file to use

Default value: //code.jquery.com/jquery.min.js

This value is configurable, see Settings section

Usage:

{% bootstrap_jquery_url %}

Example:

{% bootstrap_jquery_url %}

bootstrap_javascript_url¶

bootstrap3.templatetags.bootstrap3.bootstrap_javascript_url()[source]¶

Return the full url to the Bootstrap JavaScript library.

Default value: None

This value is configurable, see Settings section

Tag name:

bootstrap_javascript_url

Usage:

{% bootstrap_javascript_url %}

Example:

{% bootstrap_javascript_url %}

bootstrap_css_url¶

bootstrap3.templatetags.bootstrap3.bootstrap_css_url()[source]¶

Return the full url to the Bootstrap CSS library.

Default value: None

This value is configurable, see Settings section

Tag name:

bootstrap_css_url

Usage:

{% bootstrap_css_url %}

Example:

{% bootstrap_css_url %}

bootstrap_css¶

bootstrap3.templatetags.bootstrap3.bootstrap_css()[source]¶

Return HTML for Bootstrap CSS. Adjust url in settings.

If no url is returned, we don’t want this statement to return any HTML. This is intended behavior.

Default value: None

This value is configurable, see Settings section

Tag name:

bootstrap_css

Usage:

{% bootstrap_css %}

Example:

{% bootstrap_css %}

bootstrap_javascript¶

bootstrap3.templatetags.bootstrap3.bootstrap_javascript(jquery=None)[source]¶

Return HTML for Bootstrap JavaScript.

Adjust url in settings. If no url is returned, we don’t want this statement to return any HTML. This is intended behavior.

Default value: None

This value is configurable, see Settings section

Tag name:

bootstrap_javascript

Parameters:

jquery:

Truthy to include jQuery as well as Bootstrap

Usage:

{% bootstrap_javascript %}

Example:

{% bootstrap_javascript jquery=1 %}