技術雑記帳兼日記帳

AWS、Python、Terraformの使い方をコッソリ

flask テンプレート extendsとblock

Python

はじめに

flaskのテンプレートで複数のHTMLをまとめて出力する方法を解説する。

準備

下記のファイルを作成する。

  • render.py
from flask import Flask, render_template, request
app = Flask(__name__)

@app.route('/start/')
def login():
    return render_template('body.html', title='baseコンテンツ')

if __name__ == '__main__':
    app.run(debug=True, host='0.0.0.0', port=80)
  • base.html
<!DOCTYPE html>
<html>
  <head>
    <title>{{title}}</title>
  </head>
  <body>
    <p>ベースのコンテンツ</p>
    {% block body %}
    {% endblock %}
    <p>ベースのコンテンツ</p>
  </body>
</html>
  • body.html
{% extends "base.html" %}
{% block body %}
  <div>
  <p>ボディのコンテンツ.</p>
  </div>
{% endblock %}

実行結果

今回はスクリーンショットで確認する。 f:id:halhalhal1:20210325201327p:plain

実際のHTML

<!DOCTYPE html>
<html>
  <head>
    <title>baseコンテンツ</title>
  </head>
  <body>
    <p>ベースのコンテンツ</p>
    
  <div>
  <p>ボディのコンテンツ.</p>
  </div>

    <p>ベースのコンテンツ</p>
  </body>
</html>


上記のようにbase.htmlの「block body〜endblock」がbody.htmlの「block body〜endblock」の内容に置き換わっている。


まとめ

ヘッダやフッターページをページごとに記載する必要がないため、全体メニューをヘッダに持ったりするHPを作るのに重宝しそう。