Neste post vou falar um pouco sobre templates e a framework Jinja2.

O HTML embebido no código gera uma grande confusão e torna difícil fazer manutenção do mesmo, o melhor é usar um sistema de templates, onde o HTML é mantido em ficheiros separados com uma sintaxe especial para a introdução de alguma lógica e manipulação dos dados vindos das aplicações. Existem várias frameworks Python para gestão de templates, o Jinja2 é apenas um deles.


Escrever código no Jinja2

O código interpretado pelo Jinja deve ser iniciado com os caracteres {% e fechado com os caracteres %}.
Exemplo:

{% for item in navigation %}
        <li><a href="{{ item.href }}">{{ item.caption }}</a></li>
{% endfor %}


Para acedermos directamente ao valor de uma variável passada, pela nossa aplicação, para o template através da função render usamos chavetas duplas.
Exemplos:
- {{variavel}}
- {{user.name}}

E para atribuir um valor a uma variável podemos usar o seguinte código:
{% set navigation = qualquer_coisa %}

Bloco if

Exemplo de um bloco if:
{% if kenny.sick %}
    Kenny is sick.
{% elif kenny.dead %}
    You killed Kenny!  You bastard!!!
{% else %}
    Kenny looks okay --- so far
{% endif %}


Bloco for

Exemplo de um bloco for:
{% for item in seq %}
    <li>{{ item }}</li>
{% endfor %}


Herança

O Jinja2 permite a herança de templates, isto é, podemos ter um template base onde fazemos o design geral da página, podemos incluir um cabeçalho e um rodapé, um menu horizontal ou vertical que depois poderá ser reutilizado por todos os templates que herdem do template base.html.

- template base.html
<!DOCTYPE html>
<html>
<head>
    <title>Título</title>
    <meta name="description" content="Descrição"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>    
<body>
    <div id="header">Header</div>    
    <div id="content">
            {# isto é um comentário do Jinja e não vai aparecer na página #}
            {# 
                O bloco a seguir tem o nome "container" 
                e pode ser usado pelos templates que herdem
                do template base.html
            #}
        {% block container %}
                
        {% endblock %}
    </div>
    <div id="header">Footer</div>        
</body>
</html>

- template conteudo.html
Como este template vai herdar do template base.html, não precisámos perder tempo a escrever os elementos que fazem parte do base.html, pois estes serão incluídos por meio da herança, assim podemos dedicar-nos a escrever apenas aos elementos exclusivos deste template.
{# Na intrução seguinte herdamos o template base.html #}
{% extends "base.html" %}

{# 
    O que escrevermos no bloco seguinte
    irá aparecer no bloco com o mesmo nome (nome "container")
    que existe no template base.html
#}
{% block container %}
    Aqui escrevemos o conteúdo que queremos para este template.     
{% endblock %}


Além dos recursos mencionados, o Jinja tem ainda uma série de funções, extensões, filtros e outros recursos, que são muito úteis na hora de fazermos os nossos templates. Mais informações sobre estes recursos na documentação do Jinja.

Este post faz parte da série de posts "Tutorial, Blog em Python":
  1. Tutorial, Blog em Python - Parte 1: Introdução
  2. Tutorial, Blog em Python - Parte 2: Ambiente de Desenvolvimento
  3. Tutorial, Blog em Python - Parte 3: Estrutura do projecto
  4. Tutorial, Blog em Python - Parte 4: Templates (post actual)
  5. Tutorial, Blog em Python - Parte 5: Base de Dados
  6. Tutorial, Blog em Python - Parte 6: Source code