HTML Templating
pygeoapi uses Jinja as its templating engine to render HTML and Flask to provide route paths of the API that returns HTTP responses. For complete details on how to use these modules, refer to the Jinja documentation and the Flask documentation.
The default pygeoapi configuration has server.templates
commented out and defaults to the pygeoapi pygeoapi/templates
and pygeoapi/static
folder. To point to a different set of template configuration, you can edit your configuration:
server:
templates:
path: /path/to/jinja2/templates/folder # jinja2 template HTML files
static: /path/to/static/folder # css, js, images and other static files referenced by the template
Note: the URL path to your static folder will always be /static
in your deployed web instance of pygeoapi.
Your templates folder should mimic the same file names and structure of the default pygeoapi templates. Otherwise, you will need to modify api.py
accordingly.
Note that you need only copy and edit the templates you are interested in updating. For example,
if you are only interested in updating the landing_page.html
template, then create your own version
of the only that same file. When pygeoapi detects that a custom HTML template is being used,
it will look for the custom template in server.templates.path
. If it does not exists, pygeoapi
will render the default HTML template for the given endpoint/requuest.
Linking to a static file in your HTML templates can be done using Jinja syntax and the exposed config['server']['url']
:
<!-- CSS example -->
<link rel="stylesheet" href="{{ config['server']['url'] }}/static/css/default.css">
<!-- JS example -->
<script src="{{ config['server']['url'] }}/static/js/main.js"></script>
<!-- Image example with metadata -->
<img src="{{ config['server']['url'] }}/static/img/logo.png" title="{{ config['metadata']['identification']['title'] }}" />
Featured themes
Community based themes can be found on the pygeoapi Community Plugins and Themes wiki page.