Themes¶
Gallery pages are created from a Jinja2 template index.html
that must
be located in THEME_DIR/templates
.
Bundled themes¶
Sigal comes with three themes, located in the sigal/themes
folder:
- colorbox:
source, demo. This theme uses a Swipe plugin to browse pictures on touch devices.
- galleria:
source, demo. This theme is based on the classic theme, pictures can be browsed with left/right keys, fullscreen support is available with the f key, and a map can be shown with the m key if the
show_map
setting is True. Theleaflet_provider
setting can be used to customize the tile provider (using Leaflet-providers).- photoswipe:
Variables¶
You can use the following variables in your template:
album
The current album that is rendered in the HTML file, represented by an
Album
object.album.medias
contains the list of all medias in the album (represented by theImage
andVideo
objects, inherited fromMedia
).index_title
Name of the index. This is either the directory name or the title specified in the
index.md
of thesource
directory.settings
The entire dictionary from
sigal.conf.py
.sigal_link
URL to the Sigal homepage.
theme.name
,theme.url
Name and url of the currently used theme.
Filters¶
You can define custom jinja filters for your template by creating a filters.py
script
at the root of your template directory.
This script will then be imported and all defined functions will be available as jinja filters with the same names in your templates.
Documentation of sigal’s main classes¶
-
class
sigal.gallery.
Album
(path, settings, dirnames, filenames, gallery)¶ Gather all informations on an album.
Attributes:
- Variables
description_file – Name of the Markdown file which gives information on an album
index_url – URL to the index page.
output_file – Name of the output HTML file
meta – Meta data from the Markdown file.
description – description from the Markdown file.
For details how to annotate your albums with meta data, see Album information.
List of
(url, title)
tuples defining the current breadcrumb path.
-
create_output_directories
()¶ Create output directories for thumbnails and original images.
-
description_file
= 'index.md'¶
-
property
random_thumbnail
¶
-
property
show_map
¶ Check if we have at least one photo with GPS location in the album
-
sort_medias
(medias_sort_attr)¶
-
sort_subdirs
(albums_sort_attr)¶
-
property
thumbnail
¶ Path to the thumbnail of the album.
-
property
url
¶ URL of the album, relative to its parent.
-
zip
¶ Placeholder ZIP method. The ZIP logic is controlled by the zip_gallery plugin
-
class
sigal.gallery.
Media
(filename, path, settings)¶ Base Class for media files.
Attributes:
- Variables
Media.type –
"image"
or"video"
.Media.filename – Filename of the resized image.
Media.thumbnail – Location of the corresponding thumbnail image.
Media.big – If not None, location of the unmodified image.
Media.big_url – If not None, url of the unmodified image.
-
property
big
¶ Path to the original image, if
keep_orig
is set (relative to the album directory). Copy the file if needed.
-
property
big_url
¶ URL of the original media.
-
filename
¶ Filename of the resized image.
-
src_filename
¶ Filename of the resized image.
-
property
thumbnail
¶ Path to the thumbnail image (relative to the album directory).
-
type
= ''¶ Type of media, e.g.
"image"
or"video"
.
-
property
url
¶ URL of the media.
-
class
sigal.gallery.
Image
(filename, path, settings)¶ Gather all informations on an image file.
-
property
big
¶ Path to the original image, if
keep_orig
is set (relative to the album directory). Copy the file if needed.
-
property
big_url
¶ URL of the original media.
-
date
¶ The date from the EXIF DateTimeOriginal metadata if available, or from the file date.
-
exif
¶ If not None contains a dict with the most common tags. For more information, see Simpler EXIF data output.
-
has_location
()¶ True if location information is available for EXIF GPSInfo.
-
raw_exif
¶ If not None, contains the raw EXIF tags.
-
size
¶ The dimensions of the resized image.
-
thumb_size
¶ The dimensions of the thumbnail image.
-
property
thumbnail
¶ Path to the thumbnail image (relative to the album directory).
-
type
= 'image'¶
-
property
url
¶ URL of the media.
-
property
-
class
sigal.gallery.
Video
(filename, path, settings)¶ Gather all informations on a video file.
-
property
big
¶ Path to the original image, if
keep_orig
is set (relative to the album directory). Copy the file if needed.
-
property
big_url
¶ URL of the original media.
-
property
thumbnail
¶ Path to the thumbnail image (relative to the album directory).
-
type
= 'video'¶
-
property
url
¶ URL of the media.
-
property
Simpler EXIF data output¶
Because the tags in the media.raw_exif
dictionary are a little bit
cumbersome to use, some common tags are extracted and formatted for easy use in
templates. If available, you can use:
media.exif.iso
The ISO speed rating.
media.exif.focal
The focal length, formatted as a decimal number.
media.exif.exposure
The exposure time formatted as a fractional number, e.g. “1/500”.
media.exif.fstop
The aperture value given as an F-number and formatted as a decimal.
media.exif.datetime
The time the image was taken. It is formatted with the
datetime_format
setting, which is%c
by default. See Python’s datetime documentation for a list of all possible values.media.exif.dateobj
The time the image was taken. It is a datetime object, that can be formatted with
strftime
:{% if media.exif.dateobj %} {{ media.exif.dateobj.strftime('%A, %d. %B %Y') }} {% endif %}
This will output something like “Monday, 25. June 2013”, depending on your locale.
media.exif.gps
If not None, the dict contains two keys
lat
andlon
denoting the GPS coordinates of the location where the image was taken.lat
will always be referenced to the north pole whereaslon
will be referenced to east to the prime meridan. To provide a link on an OpenStreetMap you could write a template like this:{% if media.exif.gps %} <a href="https://www.openstreetmap.org/?mlat={{ media.exif.gps.lat }}&mlon={{ media.exif.gps.lon }}#map=18/{{ media.exif.gps.lat }}/{{ media.exif.gps.lon }}">Go to location (OpenStreetMap)</a> {% endif %}