Django app¶

Translucent also provides a reusable Translucent Django app.

Django installation¶

To use Translucent in a your Django Project, you’ve to follow these steps:

Install the Python package
Add confirm.translucent.django.TranslucentConfig to INSTALLED_APPS
Add confirm.translucent.django.template.context_processors.translucent to context_processors

Templates¶

Make sure you use the existing Translucent templates in your own Django templates, for example:

{% extend 'translucent/base.html' %}

{% block main %}
    Hello World
{% endblock %}

Hint

There are 3 templates available:

The skeleton template: Only includes the HTML skeleton with Translucent loaded
The base template: Implements different stylistic elements such as header, aside and main
The login template: Used for the login site

URL’s¶

To have Translucent’s authentication views & URL’s resolved in your project, add the following URL path to your URL configuration:

from django.urls import include, path

path(
    route='',
    view=include('confirm.translucent.django.urls')
)

Django settings¶

The following (optional) Django settings are available:

#: The website title.
SITE_TITLE = 'Translucent'

#: The activated translucent themes (the first theme is the default).
TRANSLUCENT_THEMES = [
    'default',
]

#: The default translucent mode.
TRANSLUCENT_MODE = 'light'

Django forms usage¶

To render a Translucent-specific form, you can substitute the origin Django components with Translucent components:

django.forms.Form with confirm.translucent.django.forms.TranslucentForm
django.forms.ModelForm with confirm.translucent.django.forms.TranslucentModelForm
{% csrf_token %} template tag with {% translucent_csrf_token %}

Your Python form should look something like this:

from confirm.translucent.django.forms import TranslucentModelForm

class MyModelForm(TranslucentModelForm):
    # …

Your HTML template should look something like this:

{% load translucent %}

<form>
    {% translucent_csrf_token %}
    …
</form>

Hint

Have a look at the TranslucentForm, TranslucentModelForm and TranslucentFormMixin classes for the available configuration options.