Generate <img> markup block for an image.
Project description
A module to generate performant HTML image markup for images hosted on assets.ubuntu.com. The markup will:
Use data-src attributes for lazysizes
Use predefined srcset break points
Resize the image with ?w=XX&h=XX query parameters
Prefix all image URLs with cloudinary proxy URLs, for CDN and image transformations
Parameters
path (mandatory string): The path to an asset on assets.ubuntu.com (e.g. /v1/9f61b97f-logo-ubuntu.svg)
alt (mandatory string): Alt text to describe the image
width (mandatory integer): The number of pixels wide the image should be
height (mandatory integer): The number of pixels high the image should be
col (optional): The number of Vanilla columns the image should span (helps define break points efficiently)
Django usage
# myapp/templatetags.py
from canonicalwebteam import image_template
from django import template
from django.utils.safestring import mark_safe
register = template.Library()
@register.simple_tag
def image(*args, **kwargs):
return mark_safe(image_template(*args, **kwargs))
# settings.py
TEMPLATES[0]["OPTIONS"]["builtins"].append("myapp.templatetags")Flask usage
# app.py
from canonicalwebteam import image_template
from flask import Flask
app = Flask(__name__)
@app.context_processor
def utility_processor():
return {"image": image_template}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
File details
Details for the file canonicalwebteam.image-template-0.1.0a4.tar.gz.
File metadata
- Download URL: canonicalwebteam.image-template-0.1.0a4.tar.gz
- Upload date:
- Size: 2.8 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/1.11.0 pkginfo/1.4.2 requests/2.19.1 setuptools/40.4.1 requests-toolbelt/0.8.0 tqdm/4.26.0 CPython/3.6.6
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 | e9ab4a1e0753d37ec24a3ac3625501781c64278e9975cdb0ac5aeabe6340e15a |
|
| MD5 | e94e41381440e7617a1b95f45c0105e8 |
|
| BLAKE2b-256 | 02e262066831bf6f502c1e34167d15ed9a96adfcf813a0860a2f7ac177f86a75 |
