Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I include a HTML file in a Jinja2 template?

I am using Flask micro-framework for my server which uses Jinja templates.

I have a parent template.html and some children templates called child1.html and child2.html, some of these children templates are pretty large HTML files and I would like to somehow split them for better lucidity over my work.

Contents of my main.py script:

from flask import Flask, request, render_template  app = Flask(__name__)  @app.route('/') @app.route('/<task>') def home(task=''):   return render_template('child1.html', task=task)  app.run() 

The simplified template.html:

<!DOCTYPE html> <html>   <head></head>   <body>     <div class="container">       {% block content %}{% endblock %}     </div>   </body> </html> 

The magic is in child1.html:

{% extends 'template.html' %} {% block content %}   {% if task == 'content1' %}     <!-- include content1.html -->   {% endif %}   {% if task == 'content2' %}     <!-- include content2.html -->   {% endif %} {% endblock %} 

Instead of the comments:

<!-- include content1.html --> 

I have a lot of html text, and it is very hard to keep track of changes and not to make some mistakes, which are then pretty hard to find and correct.

I'd like to just load the content1.html instead of writing it all in child1.html.

I came across this question, but I had problems implementing it.

I think Jinja2 might have a better tool for that.

NOTE: The code above might not be working properly, I just wrote it to illustrate the problem.

like image 825
quapka Avatar asked Apr 04 '14 10:04

quapka


People also ask

Can I use Jinja in HTML?

Jinja can generate any text-based format (HTML, XML, CSV, LaTeX, etc.). A Jinja template doesn't need to have a specific extension: . html , . xml , or any other extension is just fine.

What is the difference between Jinja and Jinja2?

Jinja, also commonly referred to as "Jinja2" to specify the newest release version, is a Python template engine used to create HTML, XML or other markup formats that are returned to the user via an HTTP response.


2 Answers

Use the jinja2 {% include %} directive.

{% extends 'template.html' %} {% block content %}     {% if task == 'content1' %}         {% include 'content1.html' %}     {% endif %}     {% if task == 'content2' %}         {% include 'content2.html' %}     {% endif %} {% endblock %} 

This will include the content from the correct content-file.

like image 55
msvalkon Avatar answered Oct 08 '22 08:10

msvalkon


You can use the include statement.

like image 26
jarandaf Avatar answered Oct 08 '22 08:10

jarandaf