Multiple Template Inheritance, cannot inherit a block across multiple templates #1944

OleksandrMyronchuk · 2024-03-14T14:29:10Z

OleksandrMyronchuk
Mar 14, 2024

I'm working on a Flask application with Jinja templating. I have a base template (base.html) that defines several blocks for content and includes other templates like header.html, menu.html, and footer.html.

Within MyPage.html, I'm extending the base.html and defining a block named test1 with some content (test1). However, the rendered output only shows "test1=" with no content.

Here are the relevant code snippets:

App.py

...
@globals.app.route('/MyPage')
def MyPage():
    if os.path.exists(os.path.join(globals.app.root_path, 'templates/pages/MyPage.html')):
        return render_template('pages/MyPage.html')
    else:
        return jsonify({'error': 'Real time test trade page not found'}), 404
...

MyPage.html

{% extends 'base.html' %}

{% block test1 %}test1{% endblock %}
...

base.html

<!DOCTYPE html>
<html>
    {% include 'header.html' %}
    <body>
        <div class="container">
            <h1 class="text-center my-4">{% block header %}{% endblock %}</h1>
            {% include 'menu.html' %}
            {% block content %}{% endblock %}
        </div>
    </body>
    {% include 'footer.html' %}
</html>

header.html

<head>
    ...
    <title>{% block title %}{% endblock %}</title>
    ...
</head>
test1={% block test1 %}{% endblock %}

hierarchy

...
|
+---templates
|   |   body.html
|   |   footer.html
|   |   header.html
|   |   menu.html
|   |
|   \---pages
|           MyPage.html
...

I expected to see test1=test1, but now it is test1= (empty).

If I try to move {% block test1 %}test1{% endblock %} from MyPage.html to base.html, it works (test1=test1). However, in this case, the entire purpose of template programming is lost (I mean that you are forced to duplicate the code), so I would still prefer to use a template.

Could you please tell me how to fix my code so that the block {% block test1 %}{% endblock %} in header.html is rendered from the value set in the block {% block test1 %}test1{% endblock %} in MyPage.html?

Answered by CheeseCake87

Mar 15, 2024

I've created an example app based on what you've described, and I'm seeing the same result as you. I've looked over the docs and I can't find anything explaining the use of blocks with includes, but it's evident that blocks don't work with template includes.

Template includes will work with template variables though.

{% for box in boxes %}
    {% include "render_box.html" %}
{% endfor %}

{{ box }} will be able to be seen by render_box.html

A Macro or a Context Processor is probably what you want to look into to solve the issue you're having.

For example, you'd replace {% include 'header.html' %} with a block:

base.html

<!DOCTYPE html>
<html>
   {% block header %}{% endblock %}
    <body>
...

View full answer

CheeseCake87 · 2024-03-15T08:37:07Z

CheeseCake87
Mar 15, 2024

I've created an example app based on what you've described, and I'm seeing the same result as you. I've looked over the docs and I can't find anything explaining the use of blocks with includes, but it's evident that blocks don't work with template includes.

Template includes will work with template variables though.

{% for box in boxes %}
    {% include "render_box.html" %}
{% endfor %}

{{ box }} will be able to be seen by render_box.html

A Macro or a Context Processor is probably what you want to look into to solve the issue you're having.

For example, you'd replace {% include 'header.html' %} with a block:

base.html

<!DOCTYPE html>
<html>
   {% block header %}{% endblock %}
    <body>
...

Then use a macro in MyPage.html

header.html

{% macro header(value) -%}
    test1={{ value }}
{%- endmacro %}

MyPage.html

{% import 'header.html' as header %}

...

{% block header %}
{{ header.header("hello") }}
{% endblock %}

Note: You may need to test the code above, I wrote this on the train quickly and haven't tested it xD

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Multiple Template Inheritance, cannot inherit a block across multiple templates #1944

{{title}}

Replies: 1 comment

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Select a reply

Multiple Template Inheritance, cannot inherit a block across multiple templates #1944

OleksandrMyronchuk Mar 14, 2024

Replies: 1 comment

CheeseCake87 Mar 15, 2024

OleksandrMyronchuk
Mar 14, 2024

CheeseCake87
Mar 15, 2024