Django Templates & Static files
Django templates are the presentation layer of the Django web application. A templates folder is typically created under the app directory and it has .html files. A static directory can also be created under the app directory to store images, CSS, and js files.
mysite
└── ...
myapp
└── templates
└── index.html
└── static
└── img
└── css
└── js
Django Template Tags
Django template is a mix of static HTML markups and dynamic python context dictionary. Several template tags and filters are available to render the context dictionary.
Template Tags
- extends 'base.html': It extends the code of the base template to any template file that sub-classes it. extends tag must be the first line if used.
- block content: It marks the dynamic section of a template which will be described in the extending template.
- : It loads the static resources under the static directory.
- for item in collection: It implements a simple python for a loop.
- if condition: It implements a simple python if condition.
- : It is used for comments other than HTML comments.
- : It prints the value of the given variable. A newline is not automatically included, unlike the Python print statement. Although HTML <br> tag can serve the same purpose.
Template Filters
Filters can be used to enhance the value of the context key variables.
All available filters in Django templates are as follows:
- add
- addslashes
- capfirst
- center
- cut
- date
- default
- default_if_none
- dictsort
- dictsortreversed
- divisibleby
- escape
- escapejs
- filesizeformat
- first
- floatformat
- force_escape
- get_digit
- iriencode
- join
- json_script
- last
- length
- length_is
- linebreaks
- linebreaksbr
- linenumbers
- ljust
- lower
- make_list
- phone2numeric
- pluralize
- pprint
- random
- rjust
- safe
- safeseq
- slice
- slugify
- stringformat
- striptags
- time
- timesince
- timeuntil
- title
- truncatechars
- truncatechars_html
- truncatewords
- truncatewords_html
- unordered_list
- upper
- urlencode
- urlize
- urlizetrunc
- wordcount
- wordwrap
- yesno
Static files
Django project settings.py defines a static directory that typically houses images, CSS, and javascript files. A sample code below shows how to use the static files.
load static
In img tag use:
src = "/static/img/my_image.png"
For CSS files use under link tag:
href = "/static/css/my_stylesheet.css"
For Javascript files use under script tag:
src = "/static/js/my_script.js"