Skip to content

Modal

A popup window component for displaying additional content, forms, or information.

modal.html modal-dark.html

your_template.html
{% include 'components/modal.html' title='Modal 1' text='This is the first modal' %}

Multiple modals

If you need multiple modals, you need to additionally pass the id parameter to each modal.

your_template.html
{% include 'components/modal.html' with id='modal1' title='Modal 1' text='This is the first modal' %}
{% include 'components/modal.html' with id='modal2' title='Modal 2' text='This is the second modal' %}

Attention

Beware that the modal uses its own id to open and close itself. If you have multiple modals in the same template, omitting the id parameter will leave your site buggy and only ever open the first modal.