Use the included djfrontend template tags to suit your needs.
Loads all the Django Frontend template tags.
{% load djfrontend %}
Each template tag now has a default value. You only need to include an argument if you wish to change the default.
Returns HTML tag according to chosen language. The default, ‘en’ is used if another language is not set.
{% djfrontend_h5bp_html %}
renders:
<html class="no-js" lang="en">
Returns HTML5 Boilerplate CSS file according to version number. The default version is the included ‘5.3.0’.
{% djfrontend_h5bp_css %}
renders:
<link rel="stylesheet" href="/static/djfrontend/css/h5bp/5.3.0/h5bp.css">
Returns Normalize CSS file according to version number. The default version is the included ‘4.2.0’.
{% djfrontend_normalize %}
renders:
<link rel="stylesheet" href="/static/djfrontend/css/normalize/4.2.0/normalize.css">
Returns Font Awesome CSS file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file. The default version is the included ‘4.6.3’.
{% djfrontend_fontawesome %}
renders:
<link rel="stylesheet" href="/static/djfrontend/css/fontawesome/4.6.3/font-awesome.css">
Or without TEMPLATE_DEBUG:
<link rel="stylesheet" href="/static/djfrontend/css/fontawesome/4.6.3/font-awesome.min.css">
Returns Modernizr JavaScript file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file from cdnjs with local callback. The default version is the included ‘2.8.3’.
{% djfrontend_modernizr %}
renders:
<script src="/static/djfrontend/js/modernizr/2.8.3/modernizr.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
<script>window.Modernizr || document.write(\'<script src="static/djfrontend/js/modernizr/2.8.3/modernizr.min.js"><\/script>\')</script>
Returns jQuery JavaScript file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file from Google CDN with local fallback. The default version is the included ‘1.12.4’.
{% djfrontend_jquery %}
renders:
<script src="/static/djfrontend/js/jquery/1.12.4/jquery.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/static/djfrontend/js/jquery/1.12.4/jquery.min.js"><\/script>')</script>
Returns jQuery UI plugin JavaScript file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file from Google CDN with local fallback. The default version is the included ‘1.11.4’.
{% djfrontend_jqueryui %}
renders:
<script src="/static/djfrontend/js/jquery/jqueryui/1.11.4/jquery-ui.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script>window.jQuery.ui || document.write(\'<script src="/static/djfrontend/js/jquery/jqueryui/1.11.4/jquery-ui.min.js"><\/script>\')</script>
Returns the jQuery DataTables plugin JavaScript file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file from cdnjs with local fallback. The default version is the included ‘1.10.12’.
{% djfrontend_jquery_datatables %}
renders:
<script src="/static/djfrontend/js/jquery/jquery.dataTables/1.10.12/jquery.dataTables.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//cdnjs.cloudflare.com/ajax/libs/datatables/1.10.12/jquery.dataTables.min.js"></script>
<script>window.jQuery.fn.DataTable || document.write('<script src="/static/djfrontend/js/jquery/jquery.dataTables/1.10.12/jquery.dataTables.min.js"><\/script>')</script>
Returns the jQuery DataTables CSS file according to version number. The default version is the included ‘1.10.12’.
{% djfrontend_jquery_datatables_css %}
renders:
<link rel="stylesheet" href="/static/djfrontend/css/jquery/jquery.dataTables/1.10.12/jquery.dataTables.css">
Or without TEMPLATE_DEBUG:
<link rel="stylesheet" href="/static/djfrontend/css/jquery/jquery.dataTables/1.10.12/jquery.dataTables.min.css">
Returns the jQuery Dynamic Formset plugin JavaScript file according to version number. TTEMPLATE_DEBUG returns full file, otherwise returns minified file from cdnjs with local fallback. The default version is the included ‘1.2.2’.
{% djfrontend_jquery_formset %}
renders:
<script src="/static/djfrontend/js/jquery/jquery.formset/1.2.2/jquery.formset.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.formset/1.2.2/jquery.formset.min.js"></script>
<script>window.jQuery.fn.formset || document.write('<script src="/static/djfrontend/js/jquery/jquery.formset/1.2.2/jquery.formset.min.js"><\/script>')</script>
Returns the jQuery ScrollTo plugin JavaScript file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file from cdnjs with local fallback. The default version is the included ‘2.1.2’.
{% djfrontend_jquery_scrollto %}
renders:
<script src="/static/djfrontend/js/jquery/jquery.scrollTo/2.1.2/jquery.scrollTo.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/2.1.2/jquery.scrollTo.min.js"></script>
<script>window.jQuery.fn.scrollTo || document.write('<script src="/static/djfrontend/js/jquery/jquery.scrollTo/2.1.2/jquery.scrollTo.min.js"><\/script>')</script>
Returns the jQuery Smooth Scroll plugin JavaScript file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file from cdnjs with local fallback. The default version is the included ‘1.7.2’.
{% djfrontend_jquery_smoothscroll %}
renders:
<script src="/static/djfrontend/js/jquery/jquery.smooth-scroll/1.7.2/jquery.smooth-scroll.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-smooth-scroll/1.7.2/jquery.smooth-scroll.min.js"></script>
<script>window.jQuery.fn.smoothScroll || document.write('<script src="/static/djfrontend/js/jquery/jquery.smooth-scroll/1.7.2/jquery.smooth-scroll.min.js"><\/script>')</script>
Returns Twitter Bootstrap CSS file according to version number. TEMPLATE_DEBUG returns full file, otherwise returns minified file. The default version is the included ‘3.3.7’.
{% djfrontend_twbs_css %}
renders:
<link rel="stylesheet" href="/static/djfrontend/css/twbs/3.3.7/bootstrap.css">
Or without TEMPLATE_DEBUG:
<link rel="stylesheet" href="/static/djfrontend/css/twbs/3.3.7/bootstrap.min.css">
Returns Twitter Bootstrap Theme CSS file according to version number. The default version is the included ‘3.3.7’.
{% djfrontend_twbs_theme_css %}
renders:
<link rel="stylesheet" href="/static/djfrontend/css/twbs/3.3.7/bootstrap-theme.css">
Or without TEMPLATE_DEBUG:
<link rel="stylesheet" href="/static/djfrontend/css/twbs/3.3.7/bootstrap-theme.min.css">
Returns Twitter Bootstrap JavaScript file(s) according to version number and file name(s). The default ‘all’ returns a concatenated file; full file for TEMPLATE_DEBUG, otherwise returns minified file from cdnjs with local fallback. The default version is the included ‘3.3.7’.
Individual files are not minified.
{% djfrontend_twbs_js %}
renders:
<script src="/static/djfrontend/js/twbs/3.3.7/bootstrap.js"></script>
Or without TEMPLATE_DEBUG:
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>window.jQuery.fn.scrollspy || document.write('<script src="/static/djfrontend/js/twbs/3.3.7/bootstrap.min.js"><\/script>')</script>
{% bootstrap_js files='alert affix' %}
renders:
<script src="/static/djfrontend/js/twbs/3.3.7/bootstrap-affix.js"></script>
<script src="/static/djfrontend/js/twbs/3.3.7/bootstrap-alert.js"></script>
Shout out to Ryan Brady and his Django Bootstrapped for inspiration and initial code.
Returns Google Analytics Universal Analytics snippet if TEMPLATE_DEBUG is not set. Use DJFRONTEND_GA_SETDOMAINNAME to set domain for multiple, or cross-domain tracking. Set DJFRONTEND_GA_SETALLOWLINKER to use _setAllowLinker method on target site for cross-domain tracking.
<script>(function(i,s,o,g,r,a,m){i["GoogleAnalyticsObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,"script","//www.google-analytics.com/analytics.js","ga");ga("create", "UA-XXXXX-X", "auto");ga("send", "pageview");</script>
Or with DJFRONTEND_GA_SETDOMAINNAME set:
<script>(function(i,s,o,g,r,a,m){i["GoogleAnalyticsObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,"script","//www.google-analytics.com/analytics.js","ga");ga("create", "UA-XXXXX-X", "example.com");ga("send", "pageview");</script>
Or with DJFRONTEND_GA_SETDOMAINNAME and DJFRONTEND_GA_SETALLOWLINKER set:
<script>(function(i,s,o,g,r,a,m){i["GoogleAnalyticsObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,"script","//www.google-analytics.com/analytics.js","ga");ga("require", "linker");ga("linker:autoLink", ["example.com"]);ga("create", "UA-XXXXX-X", "auto", {"allowLinker": true});ga("send", "pageview");</script>