Skip to content

README.md

Latest commit

 

History

History
71 lines (59 loc) · 1.72 KB

README.md

File metadata and controls

71 lines (59 loc) · 1.72 KB

django-messages-display

Display messages from django.contrib.messages as notifications in the browser.

Setup

Install the package using pip:

python -m pip install django-messages-display

Add it to the installed apps of your project:

INSTALLED_APPS = [
    ...
    "django_messages_display",
    ...
]

How to use

  1. Load the template tag in your template:

    {% load django_messages_display %}

  2. Use the django_messages_display tag where you want the notifications to appear:

    {% django_messages_display %}

    A good place to add this is before the closing body tag </body>.

  3. Load the CSS for the styling to apply:

    {% load static %}
...
<head>
   ...
   <link rel="stylesheet" href="{% static 'django_messages_display/django_messages_display.css' %}">
</head>

Example

It is convenient to integrate django-messages-display in your base template:

<!-- base.html -->
{% load static %}
{% load django_messages_display %}
...
<head>
   ...
   <link rel="stylesheet" href="{% static 'django_messages_display/django_messages_display.css' %}">
</head>
...
{% django_messages_display %}
</body>
...

Configuration

To include a close button for each message, add the following to your Django settings:

DJANGO_MESSAGES_DISPLAY_CLOSE_BUTTON = True

Accessibility

The notifications have the relevant attributes so that screen readers announce each one without interrupting the user's flow. Even though the notifications visually disappear after a certain amount of time, they remain in the document to be accessible by screen readers on demand.

The colors used for the notifications meet the WCAG 2.1 AA contrast levels.
⚡