SVG icons for Django.
Project description
django-svgicon
SVG icons for Django.
- Automatic SVG Sprite generator based on icons used in the page
- Read icons from directory and Python dict
- Customizable template tags
- In-memory cache
Requirements
- Django >= 5
- Python >= 3.10
Installation
pip install django-svgicon
To parse SVG files faster, install lxml [optional]:
pip install lxml
Configuration
Add svgicon to your INSTALLED_APPS:
INSTALLED_APPS = (
...
"svgicon",
"YOUR_APP",
...
)
Add the middleware:
MIDDLEWARE = [
...
"svgicon.middleware.SvgiconMiddleware",
...
]
Usage
- Put the icons in
yourapp/static/svgicons, for example:
yourapp/static/svgicons/menu.svg
- Use it in your templates like this:
{% load svgicon %}
<!DOCTYPE html>
<html>
<head>
<title>The App</title>
{% svgicon_style %} <!-- before your app.css -->
</head>
<body>
{% svgicon_sprite %}
<main>
<p>Click on the {% icon "menu" %} button to open the menu.</p>
<button>{% icon "menu" %}</button>
</main>
</body>
</html>
For more examples like changing size or setting aria-label, follow the
demo template.
Settings
# By default, svgicon searches for icons using Django's static finders,
# unless you specify a directory like this
SVGICON_ICONS_DIR = BASE_DIR / "myicons"
# Load icons from dict
SVGICON_ICONS = dict(
square=(
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">'
'<path d="M3,3V21H21V3" />'
"</svg>"
),
)
# svgicon uses '1em' width and height for icons, which are relative to the parent's
# font-size.
SVGICON_WIDTH = '1em'
SVGICON_HEIGHT = '1em'
# Default CSS class for each icon
SVGICON_CSS_CLASS = 'svgicon'
# SVG symbol id prefix
SVGICON_SYMBOL_PREFIX = 'icon-'
# svgicon template tag names
SVGICON_TAGS = dict(
ICON="icon",
SPRITE="svgicon_sprite",
STYLE="svgicon_style",
)
To auto-load svgicon without mentioning {% load svgicon %},
modify template settings like this:
TEMPLATES = [
{
"BACKEND": "django.template.backends.django.DjangoTemplates",
"DIRS": [],
"APP_DIRS": True,
"OPTIONS": {
...
"builtins": ["svgicon.templatetags.svgicon"], # add this
...
},
},
]
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
Filter files by name, interpreter, ABI, and platform.
If you're not sure about the file name format, learn more about wheel file names.
Copy a direct link to the current filters
File details
Details for the file django_svgicon-0.1.0.tar.gz.
File metadata
- Download URL: django_svgicon-0.1.0.tar.gz
- Upload date:
- Size: 10.2 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/6.1.0 CPython/3.11.2
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
7c24e5d72bf06554f212d46d68d274f13bb97e43753ccfde548ab32e4ea0e13c
|
|
| MD5 |
b435f17b62a706afbd2e4547d0c4b217
|
|
| BLAKE2b-256 |
5e012f1977b44a60490915341ea38a1419290945c9f76fd7d02bf913c755be29
|
File details
Details for the file django_svgicon-0.1.0-py3-none-any.whl.
File metadata
- Download URL: django_svgicon-0.1.0-py3-none-any.whl
- Upload date:
- Size: 12.7 kB
- Tags: Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/6.1.0 CPython/3.11.2
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
3e03e88b9eff76574dba1e8f9717196957b6fa882743fa0f95b6bf22fb38ae98
|
|
| MD5 |
bb9a653bd8bc89052f9ec32f3eff4c0d
|
|
| BLAKE2b-256 |
92b43474508ec9f101eb6f195b522eacd5851f1efc1747ada7f1cb14adbd445a
|
