Render multiple templates at once in Flask

SiddharthaRT picture SiddharthaRT · Jun 8, 2012 · Viewed 16.4k times · Source

I'm making a Flask application. I have a login area, a blogs area. If I want to get user's login, I'll render login template. But this doesn't render the blog template that has to be displayed below the login area. :/

I'll try to make it clearer:

{% block login %} {% endblock %}
blah blah
{% block blog_display %} {% endblock %}

Now i have a login.html which extends this, and goes into login block. I have a blogs.html which goes into blog_display. How to I render both? When I do render_template(), i can call it on only one of the login.html or blogs.html.

Please help me out. I'll give more details if you ask for it.

Answer

Sean Vieira picture Sean Vieira · Jun 8, 2012

You may be thinking about layouts the wrong way. Your layout is the most generic of your templates, not your most complex one. If you need little self-contained pieces of functionality then write them up just as they are and include them where they are needed.

That is to say, if you want something like this:

----------------------------------
                  +--------------+
  Header          |   Login      |
                  +--------------+
----------------------------------

  Body Content (Blog)

And you also want to have a stand-alone login page like this:

----------------------------------

  Header

----------------------------------

  +--------------+
  |   Login      |
  +--------------+

Then create a login partial and include it where you need it.

Example

templates/partials/login.html

<form action="/login" method="post">
<!-- Your login goes here -->
</form>

templates/your_base.html

<!DOCTYPE html>
<html>
<head>
{% block head %}
{# 
Default HEAD content goes here 
with extra nested blocks for children to override 
if needed. 
#}
{% endblock head %}
</head>
<body>
<header>{% block header %}{% endblock header %}</header>
{# Note: This assumes we *always* want a header #}
{% block content %}{% endblock content %}
</body>
</html>

templates/login.html

{% extends "your_base.html" -%}
{% block content -%}
{% include "partials/login.html" %}
{%- endblock content %}

templates/blog.html

{% extends "your_base.html" -%}
{% block header -%}
{{ super() }}{# Render the default header contents here #}
{% include "partials/login.html" %}
{%- endblock header %}
{% block content -%}
{# Render your blog posts here #}
{%- endblock content %}