Integration with Django¶
1 - Setup¶
1 - Install with pip
pip install snowebsvg
2 - Add snowebsvg
to django apps installed :
INSTALLED_APPS = [
...
'snowebsvg',
]
3 - Run migrations
python manage.py migrate
4 - Build SVG
python manage.py svg_build
Now, you have the list of available svg in your database.
2 - Add CSS files¶
There are 2 different methods to configure CSS files with Django :
You can add css files like the HTML getting started.
Or you can use django templatetags as below :
{% load svg %}
...
<head>
...
{% autoescape off %}
{% svg_stylesheets 'themes' 'core' %}
{% endautoescape %}
</head>
The version of css files is determined based on the pypi package installed.
You also need to configure colors and animations as needed.
3 - Add SVG in your Django HTML template¶
You can use svg_inline
to include an SVG in your template with these parameters :
<svg_key>
: choose at Snoweb SVG.<theme>
:'light'
or'dark'
, see more here.<width>
:100
,100%
,auto
, see more at SVG width.<height>
:100
,100%
,auto
, see more at SVG height.<variant>
:'none'
or'glass'
, see more here.<grid>
:True
orFalse
, display a grid preview.<klass>
: Add extra css classes to <svg> element.
{% load svg %}
<a href="#" class="svg-trigger">
{% svg_inline '<svg_key>' '<theme>' '<width>' '<height>' '<variant>' '<grid>' '<klass>' %}
</a>