Display messages from django.contrib.messages as notifications in the browser.
Install the package using pip:
python -m pip install django-messages-displayAdd it to the installed apps of your project:
INSTALLED_APPS = [
...
"django_messages_display",
...
]-
Load the template tag in your template:
{% load django_messages_display %} -
Use the
django_messages_displaytag where you want the notifications to appear:{% django_messages_display %}A good place to add this is before the closing body tag
</body>. -
Load the CSS for the styling to apply:
{% load static %} ... <head> ... <link rel="stylesheet" href="{% static 'django_messages_display/django_messages_display.css' %}"> </head>
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>
...To include a close button for each message, add the following to your Django settings:
DJANGO_MESSAGES_DISPLAY_CLOSE_BUTTON = TrueThe 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.