Flaskでコンテンツのテンプレートを利用する
前回のエントリで静的なコンテンツを配置しましたが、これではフレームワークを使っている意味がないので、テンプレート機能について触れてみます。
①
まず、テンプレート機能を使うためには、importで、render_templateを追加します。
②
次に、インスタンスを定義するところで、コンテンツのテンプレート配置ディレクトリを指定します。staticのときと同様にデフォルトはありますが、実行コマンドのディレクトリ/templatesなので、最初から定義しましょう。
③
@app.routeでコンテンツのパスを指定します。別に拡張子がhtmlである必要はありません。
④
テンプレートを呼び出すために、render_templateにテンプレートファイルを指定して、コンテンツを生成します。コンテンツ内に可変の文字列等を挿入したい場合は、「コンテンツ内で定義している変数名に代入して引数に追加」します。この例では、テンプレート名はtemplate.html、titleに直前に変数に代入している"test page"、nameには"Flask template test"となります。
次のようなtemplate.htmlを用意します。
ここで、{{ title }}と{{ name }}とでてきます。この部分が"test page"と"Flask template test"に置き換わります。例よってcurlを実行すると、
テンプレートから置き換わった文字を表示します。次のようにすると、template.htmlは一つですが、タイトルや本文を変えたページを生成できるというわけです。
ただ、これでは、コンテンツ本文のHTMLはすべてプログラム内に?ということになるので、もう少しテンプレートらしくしてみます。
共通ページ (template.html)
ページ1 (top.html)
ページ2 (sample.html)
プログラム
この中で重要なのはコンテンツにある{% block content %}と{% endblock %}です。まず、top.htmlとsample.htmlは文言の異なる2つの文章が{% block content %}と{% endblock %}の間に書かれています。そして、{% extends "template.html" %}がありますが、template.htmlがベースのコンテンツであることを示しており、{% block content %}と{% endblock %}で定義した内容が、そのまま、template.htmlの{% block content %}と{% endblock %}に取り込まれます。
こうすることで、ヘッダのタブやフッタのコピーライトなどは共通化してすべてのページで表示し、コンテンツ部分は個別にページを作成することができます。何かメニューなどを追加したい場合は、共通ページを調整するだけですべてのページへ反映ができるというわけです。