<!DOCTYPE html> <html lang="en"> <head> <title>{{ settings.title }}</title> <meta charset="utf-8"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-touch-fullscreen" content="yes"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> <link rel="stylesheet" href="{% static 'timeline/css/timeline.css' %}"> <link rel="stylesheet" href="{% static 'timeline/css/fonts/font.default.css' %}"> <style> html, body { height:100%; width:100%; padding: 0px; margin: 0px; } .tl-timeline { } </style> </head> <body> <div id="timeline"></div> <script src="{% static 'timeline/js/timeline.js' %}"></script> <script> var data = {{ timeline_json | safe }}; var timeline = new TL.Timeline('timeline', data, { hash_bookmark: true, debug: false, timenav_height: 100, }); </script> </body> </html>