diff --git a/python-html/pagedjs-interface.css b/python-html/pagedjs-interface.css
new file mode 100644
index 0000000..170f47e
--- /dev/null
+++ b/python-html/pagedjs-interface.css
@@ -0,0 +1,180 @@
+/* CSS for Paged.js interface – v0.4 */
+
+/* Change the look */
+:root {
+    --color-background: whitesmoke;
+    --color-pageSheet: #cfcfcf;
+    --color-pageBox: violet;
+    --color-paper: white;
+    --color-marginBox: transparent;
+    --pagedjs-crop-color: black;
+    --pagedjs-crop-shadow: white;
+    --pagedjs-crop-stroke: 1px;
+}
+
+/* To define how the book look on the screen: */
+@media screen, pagedjs-ignore {
+    body {
+        background-color: var(--color-background);
+    }
+
+    .pagedjs_pages {
+        display: flex;
+        width: calc(var(--pagedjs-width) * 2);
+        flex: 0;
+        flex-wrap: wrap;
+        margin: 0 auto;
+    }
+
+    .pagedjs_page {
+        background-color: var(--color-paper);
+        box-shadow: 0 0 0 1px var(--color-pageSheet);
+        margin: 0;
+        flex-shrink: 0;
+        flex-grow: 0;
+        margin-top: 10mm;
+    }
+
+    .pagedjs_first_page {
+        margin-left: var(--pagedjs-width);
+    }
+
+    .pagedjs_page:last-of-type {
+        margin-bottom: 10mm;
+    }
+
+    .pagedjs_pagebox{
+        box-shadow: 0 0 0 1px var(--color-pageBox);
+    }
+
+    .pagedjs_left_page{
+        z-index: 20;
+        width: calc(var(--pagedjs-bleed-left) + var(--pagedjs-pagebox-width))!important;
+    }
+
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-crop {
+        border-color: transparent;
+    }
+    
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-middle{
+        width: 0;
+    } 
+
+    .pagedjs_right_page{
+        z-index: 10;
+        position: relative;
+        left: calc(var(--pagedjs-bleed-left)*-1);
+    }
+
+    /* show the margin-box */
+
+    .pagedjs_margin-top-left-corner-holder,
+    .pagedjs_margin-top,
+    .pagedjs_margin-top-left,
+    .pagedjs_margin-top-center,
+    .pagedjs_margin-top-right,
+    .pagedjs_margin-top-right-corner-holder,
+    .pagedjs_margin-bottom-left-corner-holder,
+    .pagedjs_margin-bottom,
+    .pagedjs_margin-bottom-left,
+    .pagedjs_margin-bottom-center,
+    .pagedjs_margin-bottom-right,
+    .pagedjs_margin-bottom-right-corner-holder,
+    .pagedjs_margin-right,
+    .pagedjs_margin-right-top,
+    .pagedjs_margin-right-middle,
+    .pagedjs_margin-right-bottom,
+    .pagedjs_margin-left,
+    .pagedjs_margin-left-top,
+    .pagedjs_margin-left-middle,
+    .pagedjs_margin-left-bottom {
+        box-shadow: 0 0 0 1px inset var(--color-marginBox);
+    }
+
+    /* uncomment this part for recto/verso book : ------------------------------------ */
+
+    /*
+    .pagedjs_pages {
+        flex-direction: column;
+        width: 100%;
+    }
+
+    .pagedjs_first_page {
+        margin-left: 0;
+    }
+
+    .pagedjs_page {
+        margin: 0 auto;
+        margin-top: 10mm;
+    } 
+
+    .pagedjs_left_page{
+        width: calc(var(--pagedjs-bleed-left) + var(--pagedjs-pagebox-width) + var(--pagedjs-bleed-left))!important;
+    }
+
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-crop{
+        border-color: var(--pagedjs-crop-color);
+    }
+
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-middle{
+        width: var(--pagedjs-cross-size)!important;
+    } 
+
+    .pagedjs_right_page{
+        left: 0; 
+    } 
+    */
+    
+    
+
+    /*--------------------------------------------------------------------------------------*/
+
+
+
+    /* uncomment this par to see the baseline : -------------------------------------------*/
+
+    
+    /* .pagedjs_pagebox {
+        --pagedjs-baseline: 22px;
+        --pagedjs-baseline-position: 5px;
+        --pagedjs-baseline-color: cyan;
+        background: linear-gradient(transparent 0%, transparent calc(var(--pagedjs-baseline) - 1px), var(--pagedjs-baseline-color) calc(var(--pagedjs-baseline) - 1px), var(--pagedjs-baseline-color) var(--pagedjs-baseline)), transparent;
+        background-size: 100% var(--pagedjs-baseline);
+        background-repeat: repeat-y;
+        background-position-y: var(--pagedjs-baseline-position);
+    }  */
+   
+
+    /*--------------------------------------------------------------------------------------*/
+}
+
+
+
+
+
+/* Marks (to delete when merge in paged.js) */
+
+.pagedjs_marks-crop{
+    z-index: 999999999999;
+  
+}
+
+.pagedjs_bleed-top .pagedjs_marks-crop, 
+.pagedjs_bleed-bottom .pagedjs_marks-crop{
+    box-shadow: 1px 0px 0px 0px var(--pagedjs-crop-shadow);
+}  
+
+.pagedjs_bleed-top .pagedjs_marks-crop:last-child,
+.pagedjs_bleed-bottom .pagedjs_marks-crop:last-child{
+    box-shadow: -1px 0px 0px 0px var(--pagedjs-crop-shadow);
+}  
+
+.pagedjs_bleed-left .pagedjs_marks-crop,
+.pagedjs_bleed-right .pagedjs_marks-crop{
+    box-shadow: 0px 1px 0px 0px var(--pagedjs-crop-shadow);
+}
+
+.pagedjs_bleed-left .pagedjs_marks-crop:last-child,
+.pagedjs_bleed-right .pagedjs_marks-crop:last-child{
+    box-shadow: 0px -1px 0px 0px var(--pagedjs-crop-shadow);
+}
diff --git a/python-html/readme.md b/python-html/readme.md
new file mode 100644
index 0000000..a4e43c4
--- /dev/null
+++ b/python-html/readme.md
@@ -0,0 +1,123 @@
+# Paged.js in a jinja template
+
+This script shows a recipe for making a paged.js publication with Python. To avoid having to write all the HTML in the python script it uses the jinja templating engine.
+
+## Installation
+
+First, clone, or download a copy of this repository. 
+
+### Python 3
+
+The script uses Python 3. If you know you have it installed this step can be skipped. If you are not sure whether it is installed on your computer, run the following command in the terminal:
+
+```bash
+python3 --version
+```
+
+It should output the version number of the copy of Python you have installed, something like:
+
+```
+3.10.7
+```
+
+If the terminal instead prints something like:
+
+```
+Command 'python3' not found...
+```
+
+It is most likely Python isn't installed. You can [download it, and find installation instructions here](https://www.python.org/downloads/).
+
+### Jinja
+
+pip3 install jinja2
+
+## Running the script
+
+Running the script should result in the folder of the script: `index.html` this file is based on the template `templates/template.html`.
+
+*When using the terminal*: The script can be ran by first using `cd` to move into the folder of the script. The easiest way is typing `cd` and a space and then drag and drop the folder onto the terminal. Then press enter. Once you are in the folder, type:
+
+```
+python3 render-template.py
+```
+
+## Seeing the result
+
+The generated HTML file can simply be opened in a web browser.
+Pages using paged.js *and* an external styles file need to be opened through a local server.
+It is quite possible your editor has this functionality built in and it is perfectly fine to use that.
+Python also has a simple server built in. To start it, first `cd` into the folder of your project. Then run:
+
+```
+python3 -m http.server
+```
+
+The output should be something like:
+
+```
+Serving HTTP on 0.0.0.0 port 8000 (http://0.0.0.0:8000/) ...
+```
+
+Indicating a server has been started and is listening for requests on port 8000.
+Open a webbrowser and open the address <http://0.0.0.0:8000/> to see the generated document.
+
+## Next steps
+
+### Different template 
+
+It is possible to use a different template by adjusting the `env.get_template` replace for example the line:
+
+```
+template = env.get_template("template.html") 
+```
+
+with:
+
+```
+template = env.get_template("template-pagedjs.html") 
+```
+
+To load an example template that has paged.js built in.
+
+
+### Extending the template
+
+#### More data
+
+Extensive documentation on the jinja templating engine can be found here: <https://jinja.palletsprojects.com/en/3.1.x/templates/>
+
+The first way to extend the template is by providing extra variables, this can be done by providing extra keyword arguments in the template render call. With the python line below a placeholder `extra_placeholder` is added and becomes available in the template:
+
+```
+rendered_template = template.render(template_placeholder="world", extra_placeholder="More information in the template")
+```
+
+In the template it is possible to refer to this placeholder with the `{{ }}` syntax, so:
+
+```
+{{ extra_placeholder }}
+```
+
+#### Loops
+
+Just like python jinja supports [loops](https://jinja.palletsprojects.com/en/3.1.x/templates/#for), repeated pieces of code, or in this case HTML.
+
+It is important to understand that jinja places data in a template. It is not intended to generate data. To work with loops jinja needs a list (or actually an iterable), data it can loop over. In jinja the start of a loop is indicated with `{% for %}` the end of the loop with `{% endfor %}`
+
+Imagine this render call:
+
+```
+rendered_template = template.render(template_placeholder="world", list_of_technologies=["python", "jinja", "html", "css", "javascript", "paged.js"])
+```
+
+Now, add the following lines to the template to make jinja loop through the list and show the indvidual items in an HTML-list:
+
+```
+<h2>Used technologies</h2>
+<ul>
+{% for technology in list_of_technologies %}
+  <li>{{ technology }}</li>
+{% endfor %}
+</ul>
+```
\ No newline at end of file
diff --git a/python-html/render-template.py b/python-html/render-template.py
new file mode 100644
index 0000000..fe68e9c
--- /dev/null
+++ b/python-html/render-template.py
@@ -0,0 +1,22 @@
+from jinja2 import Environment, FileSystemLoader, select_autoescape
+
+# Setup a template loader, tell it in which folder it can find
+# the templates
+template_loader = FileSystemLoader("templates")
+ 
+env = Environment(loader= template_loader, autoescape=select_autoescape())
+
+# read a template file from the templates folder
+# and parse it into a Template object
+template = env.get_template("template.html") 
+
+# Transform or flatten the Template object into a string (piece of text)
+# The value of the placeholders is assigned through the keyword arguments
+# rendered_template = template.render(template_placeholder="world")
+
+rendered_template = template.render(template_placeholder="world", list_of_technologies=["python", "jinja", "html", "css", "javascript", "paged.js"])
+
+# Open a file handle and write the rendered template to a file.
+# A file which can be read by other programs, like a browser for example.
+with open('index.html', 'w') as h:
+  h.write(rendered_template)
diff --git a/python-html/templates/template-pagedjs.html b/python-html/templates/template-pagedjs.html
new file mode 100644
index 0000000..037f07d
--- /dev/null
+++ b/python-html/templates/template-pagedjs.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Paged.js document</title>
+  <script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>
+  <!-- It is of course completely possible to insert a local js file -->
+  <link rel="stylesheet" href="pagedjs-interface.css">
+  <!-- The template will be rendered in a different folder. Make sure the path
+       to the css file still works! -->
+</head>
+<body>
+  Hello {{ template_placeholder }}!
+  <!-- {{ template_placeholder }} is replaced by the value of the keyword
+       argument provided to the render call in the python script -->
+</body>
+</html>
\ No newline at end of file
diff --git a/python-html/templates/template.html b/python-html/templates/template.html
new file mode 100644
index 0000000..3c06c72
--- /dev/null
+++ b/python-html/templates/template.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Hello {{ template_placeholder }}!</title>
+</head>
+<body>
+  <!-- {{ template_placeholder }} is replaced by the value of the keyword
+    argument provided to the render call in the python script -->
+  Hello {{ template_placeholder }}!
+</body>
+</html>
\ No newline at end of file